From d1f85f4b96a06d83bd120ff628226f8cf5d51365 Mon Sep 17 00:00:00 2001 From: Kah Keng Tay Date: Sat, 15 Jul 2023 12:54:24 -0700 Subject: [PATCH] remove query invalidation, add user id to query key --- src/api/queries.ts | 11 ++++++++--- src/contexts/ConnectionWrapper.tsx | 10 ---------- .../rainbowSIWEmod/RainbowKitSiweNextAuthProvider.tsx | 11 ++++++----- 3 files changed, 14 insertions(+), 18 deletions(-) diff --git a/src/api/queries.ts b/src/api/queries.ts index 77b9619b2..01e02bedc 100644 --- a/src/api/queries.ts +++ b/src/api/queries.ts @@ -1,5 +1,6 @@ import { useQuery } from 'react-query'; import { fetchChats, fetchShareSettings } from '@/api/fetches'; +import { useSession } from 'next-auth/react'; export interface ChatSession { id: string; @@ -9,7 +10,9 @@ export interface Chats { sessions: ChatSession[] | undefined; } export const useQueryChats = () => { - const { data: chats, ...rest } = useQuery(['chats'], async () => fetchChats()); + const { data: sessionData } = useSession(); + const userId = sessionData?.user?.name || ''; + const { data: chats, ...rest } = useQuery(['chats', userId], async () => fetchChats()); return { chats, ...rest }; }; @@ -18,8 +21,10 @@ export interface ChatShareSettings { canEdit?: boolean; } export const useQueryShareSettings = (sessionId: string) => { - const { data, ...rest } = useQuery(['shareSettings', sessionId], async () => + const { data: sessionData } = useSession(); + const userId = sessionData?.user?.name || ''; + const { data: settings, ...rest } = useQuery(['shareSettings', sessionId, userId], async () => fetchShareSettings(sessionId) ); - return { settings: data as ChatShareSettings, ...rest }; + return { settings, ...rest }; }; diff --git a/src/contexts/ConnectionWrapper.tsx b/src/contexts/ConnectionWrapper.tsx index c03e0dc4d..c9e068dd3 100644 --- a/src/contexts/ConnectionWrapper.tsx +++ b/src/contexts/ConnectionWrapper.tsx @@ -76,14 +76,6 @@ const ConnectionWrapper = ({ children, useSiwe = true }: any) => { return nonce; }; - const invalidateQueries = () => { - // set timeout to allow cookie response to first be set prior to refetching - setTimeout(() => { - queryClient.invalidateQueries({ queryKey: ['chats'] }); - queryClient.invalidateQueries({ queryKey: ['shareSettings'] }); - }, 1000); - }; - const getSigninCallback = async (message: string, signature: string) => { const backendUrl = getBackendApiUrl(); const result = await axios.post( @@ -94,14 +86,12 @@ const ConnectionWrapper = ({ children, useSiwe = true }: any) => { }, { withCredentials: true } ); - invalidateQueries(); return !!result.data; }; const getSignoutCallback = async () => { const backendUrl = getBackendApiUrl(); await axios.post(`${backendUrl}/logout`, {}, { withCredentials: true }); - invalidateQueries(); }; const CustomAvatar: AvatarComponent = ({ diff --git a/src/utils/rainbowSIWEmod/RainbowKitSiweNextAuthProvider.tsx b/src/utils/rainbowSIWEmod/RainbowKitSiweNextAuthProvider.tsx index 0b28eb56c..b5ca2b82d 100644 --- a/src/utils/rainbowSIWEmod/RainbowKitSiweNextAuthProvider.tsx +++ b/src/utils/rainbowSIWEmod/RainbowKitSiweNextAuthProvider.tsx @@ -42,13 +42,12 @@ export function RainbowKitSiweNextAuthProvider({ const { address: account } = useAccount(); const signoutSequence = async () => { - // signout on frontend first, so that we don't end up in situation - // where frontend is signed in but backend is signed out, which will - // be confusing to the user - await signOut({ redirect: false }); + // signout on backend first, to ensure session cookies get cleared + // prior to any frontend hooks firing if (getSignoutCallback) { await getSignoutCallback(); } + await signOut({ redirect: false }); }; /* force logout if account changes */ @@ -99,7 +98,9 @@ export function RainbowKitSiweNextAuthProvider({ verify: async ({ message, signature }) => { const messageJson = JSON.stringify(message); // signin on backend first, so that any issues there will not lead to - // an inconsistent signin state with frontend + // an inconsistent signin state with frontend. also, this ensures + // session cookies are set by backend prior to any frontend hooks + // firing if (getSigninCallback) { const result = await getSigninCallback(messageJson, signature); if (!result) {