fix: mobile need login modal

Signed-off-by: Innei <tukon479@gmail.com>
RSSNext · Dec 3, 2024 · 0fb16f2 · 0fb16f2
1 parent 779a120
commit 0fb16f2
Show file tree

Hide file tree

Showing 2 changed files with 23 additions and 26 deletions.
diff --git a/apps/renderer/src/modules/app-layout/feed-column/index.mobile.tsx b/apps/renderer/src/modules/app-layout/feed-column/index.mobile.tsx
@@ -1,16 +1,38 @@
+import { RootPortal } from "@follow/components/ui/portal/index.js"
 import { Outlet } from "react-router"
 
+import { useLoginModalShow, useWhoami } from "~/atoms/user"
+import { PlainModal } from "~/components/ui/modal/stacked/custom-modal"
+import { DeclarativeModal } from "~/components/ui/modal/stacked/declarative-modal"
 import { useDailyTask } from "~/hooks/biz/useDailyTask"
+import { LoginModalContent } from "~/modules/auth/LoginModalContent"
 
 import { NewUserGuide } from "./index.shared"
 
 export const MobileRootLayout = () => {
   useDailyTask()
-
+  const isAuthFail = useLoginModalShow()
+  const user = useWhoami()
   return (
     <>
       <Outlet />
       <NewUserGuide />
+
+      {isAuthFail && !user && (
+        <RootPortal>
+          <DeclarativeModal
+            id="login"
+            CustomModalComponent={PlainModal}
+            open
+            overlay
+            title="Login"
+            canClose={false}
+            clickOutsideToDismiss={false}
+          >
+            <LoginModalContent canClose={false} runtime={"browser"} />
+          </DeclarativeModal>
+        </RootPortal>
+      )}
     </>
   )
 }
diff --git a/apps/renderer/src/modules/app-layout/feed-column/mobile.tsx b/apps/renderer/src/modules/app-layout/feed-column/mobile.tsx
@@ -1,8 +1,6 @@
 import { Logo } from "@follow/components/icons/logo.js"
 import { ActionButton } from "@follow/components/ui/button/index.js"
-import { RootPortal } from "@follow/components/ui/portal/index.js"
 import { views } from "@follow/constants"
-import { IN_ELECTRON } from "@follow/shared/constants"
 import { cn } from "@follow/utils/utils"
 import useEmblaCarousel from "embla-carousel-react"
 import type { FC } from "react"
@@ -11,11 +9,7 @@ import { useTranslation } from "react-i18next"
 import { Link } from "react-router"
 
 import { useSetSidebarActiveView, useSidebarActiveView } from "~/atoms/sidebar"
-import { useLoginModalShow, useWhoami } from "~/atoms/user"
-import { PlainModal } from "~/components/ui/modal/stacked/custom-modal"
-import { DeclarativeModal } from "~/components/ui/modal/stacked/declarative-modal"
 import { getRouteParams } from "~/hooks/biz/useRouteParams"
-import { LoginModalContent } from "~/modules/auth/LoginModalContent"
 
 import { FeedList } from "../../feed-column/list"
 import { FooterInfo } from "./components/FooterInfo"
@@ -34,9 +28,6 @@ export function FeedColumnMobile({ asWidget }: { asWidget?: boolean }) {
 
   const [feedListScrollRef, setFeedListScrollRef] = useState<HTMLDivElement | null>()
 
-  const isAuthFail = useLoginModalShow()
-  const user = useWhoami()
-
   const { t } = useTranslation()
 
   return (
@@ -73,22 +64,6 @@ export function FeedColumnMobile({ asWidget }: { asWidget?: boolean }) {
         </SwipeWrapper>
       </div>
 
-      {isAuthFail && !user && (
-        <RootPortal>
-          <DeclarativeModal
-            id="login"
-            CustomModalComponent={PlainModal}
-            open
-            overlay
-            title="Login"
-            canClose={false}
-            clickOutsideToDismiss={false}
-          >
-            <LoginModalContent canClose={false} runtime={IN_ELECTRON ? "app" : "browser"} />
-          </DeclarativeModal>
-        </RootPortal>
-      )}
-
       <FooterInfo />
       <MobileFloatBar
         className={asWidget ? "!bottom-0" : undefined}