diff --git a/packages/web/src/pages/settings-page/components/desktop/ManagerMode/AccountsManagingYouHomePage.tsx b/packages/web/src/pages/settings-page/components/desktop/ManagerMode/AccountsManagingYouHomePage.tsx index 2a74dd562cb..5d44670a5f2 100644 --- a/packages/web/src/pages/settings-page/components/desktop/ManagerMode/AccountsManagingYouHomePage.tsx +++ b/packages/web/src/pages/settings-page/components/desktop/ManagerMode/AccountsManagingYouHomePage.tsx @@ -31,7 +31,14 @@ export const AccountsManagingYouHomePage = ( const { toast } = useContext(ToastContext) const [removeManager, removeResult] = useRemoveManager() - const { data: managers, status: managersStatus } = useGetManagers({ userId }) + // Always update manager list when mounting this page + const { data: managers, status: managersStatus } = useGetManagers( + { userId }, + { force: true } + ) + // Don't flash loading spinner if we are refreshing the cache + const isLoading = + managersStatus !== Status.SUCCESS && (!managers || managers.length === 0) const handleRemoveManager = useCallback( (params: { userId: number; managerUserId: number }) => { @@ -72,7 +79,7 @@ export const AccountsManagingYouHomePage = ( - {managersStatus !== Status.SUCCESS ? ( + {isLoading ? ( ({ diff --git a/packages/web/src/pages/settings-page/components/desktop/ManagerMode/AccountsYouManageHomePage.tsx b/packages/web/src/pages/settings-page/components/desktop/ManagerMode/AccountsYouManageHomePage.tsx index 8f493fc89a5..291c023d7a8 100644 --- a/packages/web/src/pages/settings-page/components/desktop/ManagerMode/AccountsYouManageHomePage.tsx +++ b/packages/web/src/pages/settings-page/components/desktop/ManagerMode/AccountsYouManageHomePage.tsx @@ -34,8 +34,13 @@ export const AccountsYouManageHomePage = ({ const userId = currentUser?.user_id const { data: managedAccounts, status } = useGetManagedAccounts( { userId: userId! }, - { disabled: userId == null } + // Always update managed accounts list when mounting this page + { disabled: userId == null, force: true } ) + // Don't flash loading spinner if we are refreshing the cache + const isLoading = + status !== Status.SUCCESS && + (!managedAccounts || managedAccounts.length === 0) const [approveManagedAccount, approveResult] = useApproveManagedAccount() const [rejectManagedAccount, rejectResult] = useRemoveManager() const { toast } = useContext(ToastContext) @@ -95,7 +100,7 @@ export const AccountsYouManageHomePage = ({ {messages.takeControl}{' '} - {status !== Status.SUCCESS ? ( + {isLoading ? ( ({ diff --git a/packages/web/src/pages/settings-page/components/desktop/ManagerMode/AccountsYouManageSettingsCard.tsx b/packages/web/src/pages/settings-page/components/desktop/ManagerMode/AccountsYouManageSettingsCard.tsx index 3cb90b2f134..979c5b80b50 100644 --- a/packages/web/src/pages/settings-page/components/desktop/ManagerMode/AccountsYouManageSettingsCard.tsx +++ b/packages/web/src/pages/settings-page/components/desktop/ManagerMode/AccountsYouManageSettingsCard.tsx @@ -1,8 +1,8 @@ import { useCallback, useEffect, useState } from 'react' import { Button, IconUserArrowRotate } from '@audius/harmony' +import { useLocation } from 'react-router-dom' -import { useHistoryContext } from 'app/HistoryProvider' import { ACCOUNTS_YOU_MANAGE_SETTINGS_PAGE, doesMatchRoute } from 'utils/route' import SettingsCard from '../SettingsCard' @@ -18,17 +18,14 @@ const messages = { export const AccountsYouManageSettingsCard = () => { const [isModalOpen, setIsModalOpen] = useState(false) - const { history } = useHistoryContext() + const location = useLocation() useEffect(() => { - const match = doesMatchRoute( - history.location, - ACCOUNTS_YOU_MANAGE_SETTINGS_PAGE - ) + const match = doesMatchRoute(location, ACCOUNTS_YOU_MANAGE_SETTINGS_PAGE) if (match) { setIsModalOpen(true) } - }, [history.location]) + }, [location]) const handleOpen = useCallback(() => { setIsModalOpen(true)