From 895627a6a37afb42bd16a443c57f5e530714b656 Mon Sep 17 00:00:00 2001 From: katspaugh Date: Fri, 12 May 2023 16:43:08 +0200 Subject: [PATCH] Fix: don't refresh main component on first page load --- src/hooks/useRouterQueryChanged.ts | 23 +++++++++++++++++++++++ src/pages/_app.tsx | 7 +++++-- 2 files changed, 28 insertions(+), 2 deletions(-) create mode 100644 src/hooks/useRouterQueryChanged.ts diff --git a/src/hooks/useRouterQueryChanged.ts b/src/hooks/useRouterQueryChanged.ts new file mode 100644 index 0000000000..7eb8b6ffa7 --- /dev/null +++ b/src/hooks/useRouterQueryChanged.ts @@ -0,0 +1,23 @@ +import { useRouter } from 'next/router' +import { useEffect, useState } from 'react' + +// Return a given query param only when it has changed from a previous non-falsey value +const useRouterQueryChanged = (queryParam: string): string => { + const router = useRouter() + const currentQuery = router.query[queryParam]?.toString() || '' + const [_, setPrevQuery] = useState(currentQuery) + const [newQuery, setNewQuery] = useState('') + + useEffect(() => { + setPrevQuery((prev) => { + if (prev) { + setNewQuery(currentQuery) + } + return currentQuery + }) + }, [currentQuery]) + + return newQuery +} + +export default useRouterQueryChanged diff --git a/src/pages/_app.tsx b/src/pages/_app.tsx index ef2038ffec..98fd15fed5 100644 --- a/src/pages/_app.tsx +++ b/src/pages/_app.tsx @@ -40,6 +40,7 @@ const TermsBanner = dynamic(() => import('@/components/common/TermsBanner'), { s import useSafeMessageNotifications from '@/hooks/useSafeMessageNotifications' import useSafeMessagePendingStatuses from '@/hooks/useSafeMessagePendingStatuses' +import useRouterQueryChanged from '@/hooks/useRouterQueryChanged' const GATEWAY_URL = IS_PRODUCTION || cgwDebugStorage.get() ? GATEWAY_URL_PRODUCTION : GATEWAY_URL_STAGING @@ -94,10 +95,12 @@ const WebCoreApp = ({ router, emotionCache = clientSideEmotionCache, }: WebCoreAppProps): ReactElement => { + const safeKey = useRouterQueryChanged('safe') + return ( - {'Safe{Wallet}'} + {'Safe'} @@ -108,7 +111,7 @@ const WebCoreApp = ({ - +