fix: resolve user profile dropdown cache sync issue across layouts (#23937)

web/app/components/swr-initializer.tsx

@@ -79,6 +79,9 @@ const SwrInitializer = ({
       <SWRConfig value={{
         shouldRetryOnError: false,
         revalidateOnFocus: false,
+        dedupingInterval: 60000,
+        focusThrottleInterval: 5000,
+        provider: () => new Map(),
       }}>
         {children}
       </SWRConfig>

web/context/app-context.tsx

@@ -75,7 +75,7 @@ export type AppContextProviderProps = {
 }
 
 export const AppContextProvider: FC<AppContextProviderProps> = ({ children }) => {
-  const { data: userProfileResponse, mutate: mutateUserProfile } = useSWR({ url: '/account/profile', params: {} }, fetchUserProfile)
+  const { data: userProfileResponse, mutate: mutateUserProfile, error: userProfileError } = useSWR({ url: '/account/profile', params: {} }, fetchUserProfile)
   const { data: currentWorkspaceResponse, mutate: mutateCurrentWorkspace, isLoading: isLoadingCurrentWorkspace } = useSWR({ url: '/workspaces/current', params: {} }, fetchCurrentWorkspace)
 
   const [userProfile, setUserProfile] = useState<UserProfileResponse>(userProfilePlaceholder)
@@ -86,15 +86,26 @@ export const AppContextProvider: FC<AppContextProviderProps> = ({ children }) =>
   const isCurrentWorkspaceEditor = useMemo(() => ['owner', 'admin', 'editor'].includes(currentWorkspace.role), [currentWorkspace.role])
   const isCurrentWorkspaceDatasetOperator = useMemo(() => currentWorkspace.role === 'dataset_operator', [currentWorkspace.role])
   const updateUserProfileAndVersion = useCallback(async () => {
-    if (userProfileResponse && !userProfileResponse.bodyUsed) {
+    if (userProfileResponse) {
-      const result = await userProfileResponse.json()
+      try {
+        const clonedResponse = (userProfileResponse as Response).clone()
+        const result = await clonedResponse.json()
         setUserProfile(result)
         const current_version = userProfileResponse.headers.get('x-version')
         const current_env = process.env.NODE_ENV === 'development' ? 'DEVELOPMENT' : userProfileResponse.headers.get('x-env')
         const versionData = await fetchLangGeniusVersion({ url: '/version', params: { current_version } })
         setLangGeniusVersionInfo({ ...versionData, current_version, latest_version: versionData.version, current_env })
       }
-  }, [userProfileResponse])
+ catch (error) {
+        console.error('Failed to update user profile:', error)
+        if (userProfile.id === '')
+          setUserProfile(userProfilePlaceholder)
+      }
+    }
+ else if (userProfileError && userProfile.id === '') {
+      setUserProfile(userProfilePlaceholder)
+    }
+  }, [userProfileResponse, userProfileError, userProfile.id])
 
   useEffect(() => {
     updateUserProfileAndVersion()