From d8a1545ee8028fea03fb4d4a5ff7b87b87071a6f Mon Sep 17 00:00:00 2001 From: Justin Date: Mon, 18 Jul 2022 09:54:56 -0400 Subject: [PATCH 1/3] Query account on hover for follow stats --- app/soapbox/actions/importer/index.ts | 5 +++-- app/soapbox/actions/suggestions.ts | 2 +- app/soapbox/components/hover_ref_wrapper.tsx | 6 ++++-- 3 files changed, 8 insertions(+), 5 deletions(-) diff --git a/app/soapbox/actions/importer/index.ts b/app/soapbox/actions/importer/index.ts index 87c6cca85..be8b47304 100644 --- a/app/soapbox/actions/importer/index.ts +++ b/app/soapbox/actions/importer/index.ts @@ -40,13 +40,14 @@ export function importFetchedAccount(account: APIEntity) { return importFetchedAccounts([account]); } -export function importFetchedAccounts(accounts: APIEntity[]) { +export function importFetchedAccounts(accounts: APIEntity[], args = { should_refetch: false }) { + const { should_refetch } = args; const normalAccounts: APIEntity[] = []; const processAccount = (account: APIEntity) => { if (!account.id) return; - normalAccounts.push(account); + normalAccounts.push({ should_refetch, ...account }); if (account.moved) { processAccount(account.moved); diff --git a/app/soapbox/actions/suggestions.ts b/app/soapbox/actions/suggestions.ts index 86743f5aa..600dffb7d 100644 --- a/app/soapbox/actions/suggestions.ts +++ b/app/soapbox/actions/suggestions.ts @@ -91,7 +91,7 @@ const fetchTruthSuggestions = (params: Record = {}) => const next = getLinks(response).refs.find(link => link.rel === 'next')?.uri; const accounts = suggestedProfiles.map(mapSuggestedProfileToAccount); - dispatch(importFetchedAccounts(accounts)); + dispatch(importFetchedAccounts(accounts, { should_refetch: true })); dispatch({ type: SUGGESTIONS_TRUTH_FETCH_SUCCESS, suggestions: suggestedProfiles, next, skipLoading: true }); return suggestedProfiles; }) diff --git a/app/soapbox/components/hover_ref_wrapper.tsx b/app/soapbox/components/hover_ref_wrapper.tsx index 2090543cc..7e103f3e5 100644 --- a/app/soapbox/components/hover_ref_wrapper.tsx +++ b/app/soapbox/components/hover_ref_wrapper.tsx @@ -1,12 +1,13 @@ import classNames from 'classnames'; import debounce from 'lodash/debounce'; import React, { useRef } from 'react'; -import { useDispatch } from 'react-redux'; +import { fetchAccount } from 'soapbox/actions/accounts'; import { openProfileHoverCard, closeProfileHoverCard, } from 'soapbox/actions/profile_hover_card'; +import { useAppDispatch } from 'soapbox/hooks'; import { isMobile } from 'soapbox/is_mobile'; const showProfileHoverCard = debounce((dispatch, ref, accountId) => { @@ -21,12 +22,13 @@ interface IHoverRefWrapper { /** Makes a profile hover card appear when the wrapped element is hovered. */ export const HoverRefWrapper: React.FC = ({ accountId, children, inline = false, className }) => { - const dispatch = useDispatch(); + const dispatch = useAppDispatch(); const ref = useRef(null); const Elem: keyof JSX.IntrinsicElements = inline ? 'span' : 'div'; const handleMouseEnter = () => { if (!isMobile(window.innerWidth)) { + dispatch(fetchAccount(accountId)); showProfileHoverCard(dispatch, ref, accountId); } }; From 6b2027cba525dc8f4af2d2ac324ad4ca8d25303a Mon Sep 17 00:00:00 2001 From: Justin Date: Mon, 18 Jul 2022 10:16:56 -0400 Subject: [PATCH 2/3] Fix test --- app/soapbox/actions/__tests__/suggestions.test.ts | 1 + 1 file changed, 1 insertion(+) diff --git a/app/soapbox/actions/__tests__/suggestions.test.ts b/app/soapbox/actions/__tests__/suggestions.test.ts index 3c8d0c95a..a153208a7 100644 --- a/app/soapbox/actions/__tests__/suggestions.test.ts +++ b/app/soapbox/actions/__tests__/suggestions.test.ts @@ -57,6 +57,7 @@ describe('fetchSuggestions()', () => { avatar_static: response[0].account_avatar, id: response[0].account_id, note: response[0].note, + should_refetch: true, verified: response[0].verified, display_name: response[0].display_name, }], From a6122d052773ff5590d89f0406e7032d353cab99 Mon Sep 17 00:00:00 2001 From: Justin Date: Mon, 18 Jul 2022 10:26:51 -0400 Subject: [PATCH 3/3] refactor --- app/soapbox/actions/importer/index.ts | 6 +++++- 1 file changed, 5 insertions(+), 1 deletion(-) diff --git a/app/soapbox/actions/importer/index.ts b/app/soapbox/actions/importer/index.ts index be8b47304..20041180b 100644 --- a/app/soapbox/actions/importer/index.ts +++ b/app/soapbox/actions/importer/index.ts @@ -47,7 +47,11 @@ export function importFetchedAccounts(accounts: APIEntity[], args = { should_ref const processAccount = (account: APIEntity) => { if (!account.id) return; - normalAccounts.push({ should_refetch, ...account }); + if (should_refetch) { + account.should_refetch = true; + } + + normalAccounts.push(account); if (account.moved) { processAccount(account.moved);