fix(web): harden workspace route guards against flash

- move guard redirects to useEffect to keep render side-effect free\n- keep null short-circuit for unauthorized routes before child mount\n- add app loading fallback in RoleRouteGuard while workspace is loading

web/app/(commonLayout)/datasets/layout.tsx

@@ -1,6 +1,7 @@
 'use client'
 
 import { useRouter } from 'next/navigation'
+import { useEffect } from 'react'
 import Loading from '@/app/components/base/loading'
 import { useAppContext } from '@/context/app-context'
 import { ExternalApiPanelProvider } from '@/context/external-api-panel-context'
@@ -9,12 +10,19 @@ import { ExternalKnowledgeApiProvider } from '@/context/external-knowledge-api-c
 export default function DatasetsLayout({ children }: { children: React.ReactNode }) {
   const { isCurrentWorkspaceEditor, isCurrentWorkspaceDatasetOperator, currentWorkspace, isLoadingCurrentWorkspace } = useAppContext()
   const router = useRouter()
+  const shouldRedirect = !isLoadingCurrentWorkspace
+    && currentWorkspace.id
+    && !(isCurrentWorkspaceEditor || isCurrentWorkspaceDatasetOperator)
+
+  useEffect(() => {
+    if (shouldRedirect)
+      router.replace('/apps')
+  }, [shouldRedirect, router])
 
   if (isLoadingCurrentWorkspace || !currentWorkspace.id)
     return <Loading type="app" />
 
-  if (!(isCurrentWorkspaceEditor || isCurrentWorkspaceDatasetOperator)) {
-    router.replace('/apps')
+  if (shouldRedirect) {
     return null
   }
 

web/app/(commonLayout)/role-route-guard.tsx

@@ -2,22 +2,29 @@
 
 import type { ReactNode } from 'react'
 import { usePathname, useRouter } from 'next/navigation'
+import { useEffect } from 'react'
+import Loading from '@/app/components/base/loading'
 import { useAppContext } from '@/context/app-context'
 
 export default function RoleRouteGuard({ children }: { children: ReactNode }) {
   const { isCurrentWorkspaceDatasetOperator, isLoadingCurrentWorkspace, currentWorkspace } = useAppContext()
   const pathname = usePathname()
   const router = useRouter()
-
-  if (
-    !isLoadingCurrentWorkspace
+  const shouldRedirect = !isLoadingCurrentWorkspace
     && currentWorkspace.id
     && isCurrentWorkspaceDatasetOperator
     && !pathname.startsWith('/datasets')
-  ) {
-    router.replace('/datasets')
+
+  useEffect(() => {
+    if (shouldRedirect)
+      router.replace('/datasets')
+  }, [shouldRedirect, router])
+
+  if (isLoadingCurrentWorkspace)
+    return <Loading type="app" />
+
+  if (shouldRedirect)
     return null
-  }
 
   return <>{children}</>
 }