setShowAuthModal in useEffect to ensure state is fresh

siliconflow · Feb 19, 2025 · 80389b4 · 80389b4
1 parent cf0c770
commit 80389b4
Showing 1 changed file with 4 additions and 3 deletions.
diff --git a/app/components/home.tsx b/app/components/home.tsx
@@ -173,18 +173,19 @@ function Screen() {
   const shouldTightBorder =
     getClientConfig()?.isApp || (config.tightBorder && !isMobileScreen);
   const [showAuthModal, setShowAuthModal] = useState<boolean>(
-    !useAccessStore.getState().isValidSiliconFlow(),
+    () => !useAccessStore.getState().isValidSiliconFlow(),
   );
   useEffect(() => {
     loadAsyncGoogleFont();
-    return useAccessStore.subscribe((state, prevState) => {
+    const sub = useAccessStore.subscribe((state, prevState) => {
       if (state.siliconflowApiKey !== prevState.siliconflowApiKey) {
         console.log("SiliconFlow API Key changed", state.siliconflowApiKey);
         setShowAuthModal(!state.siliconflowApiKey);
       }
     });
+    setShowAuthModal(!useAccessStore.getState().isValidSiliconFlow());
+    return sub;
   }, []);
-
   if (isArtifact) {
     return (
       <Routes>