refactor(app): split page orchestration flows

src/app/private-room/private-room-screen.tsx

@@ -1,7 +1,7 @@
 "use client";
 
 import type { CSSProperties } from "react";
-import { useEffect, useMemo, useRef } from "react";
+import { useMemo } from "react";
 import Image from "next/image";
 import {
   ImageIcon,
@@ -12,7 +12,6 @@ import {
 
 import type { PrivateRoomMoment } from "@/data/dto/private-room";
 import { AppBottomNav, MobileShell } from "@/app/_components/core";
-import { useGuestLoginBootstrap } from "@/hooks/use-guest-login-bootstrap";
 import { ROUTES } from "@/router/routes";
 import { useAppNavigator } from "@/router/use-app-navigator";
 import { useAuthDispatch, useAuthState } from "@/stores/auth/auth-context";
@@ -20,9 +19,14 @@ import {
   usePrivateRoomDispatch,
   usePrivateRoomState,
 } from "@/stores/private-room";
-import { useUserDispatch } from "@/stores/user/user-context";
 
 import styles from "./private-room-screen.module.css";
+import {
+  isPrivateRoomAuthRequired,
+  usePrivateRoomBootstrapFlow,
+  usePrivateRoomUnlockPaywallNavigation,
+  usePrivateRoomUnlockSuccessRefresh,
+} from "./use-private-room-flow";
 
 const FALLBACK_PROFILE = {
   name: "Elio Silvestri",
@@ -37,70 +41,23 @@ export function PrivateRoomScreen() {
   const navigator = useAppNavigator();
   const authState = useAuthState();
   const authDispatch = useAuthDispatch();
-  const userDispatch = useUserDispatch();
   const state = usePrivateRoomState();
   const dispatch = usePrivateRoomDispatch();
-  const previousLoginStatusRef = useRef(authState.loginStatus);
-  const lastUnlockSuccessNonceRef = useRef(0);
 
-  useGuestLoginBootstrap({
-    dispatch: authDispatch,
+  usePrivateRoomBootstrapFlow({
+    authDispatch,
     hasInitialized: authState.hasInitialized,
-    isLoading: authState.isLoading,
+    isAuthLoading: authState.isLoading,
     loginStatus: authState.loginStatus,
+    roomDispatch: dispatch,
+    roomStatus: state.status,
   });
-
-  useEffect(() => {
-    if (!authState.hasInitialized || authState.isLoading) return;
-    if (authState.loginStatus === "notLoggedIn") return;
-
-    const previousLoginStatus = previousLoginStatusRef.current;
-    previousLoginStatusRef.current = authState.loginStatus;
-
-    if (state.status === "idle") {
-      dispatch({ type: "PrivateRoomInit" });
-      return;
-    }
-
-    if (
-      previousLoginStatus !== authState.loginStatus &&
-      state.status !== "loading"
-    ) {
-      dispatch({ type: "PrivateRoomRefresh" });
-    }
-  }, [
-    authState.hasInitialized,
-    authState.isLoading,
-    authState.loginStatus,
-    dispatch,
-    state.status,
-  ]);
-
-  useEffect(() => {
-    const request = state.unlockPaywallRequest;
-    if (!request) return;
-
-    if (
-      authState.loginStatus === "guest" ||
-      authState.loginStatus === "notLoggedIn"
-    ) {
-      navigator.openAuth(ROUTES.privateRoom);
-    } else {
-      navigator.openSubscription({ type: "topup" });
-    }
-    dispatch({ type: "PrivateRoomUnlockPaywallConsumed" });
-  }, [
-    authState.loginStatus,
-    dispatch,
-    navigator,
-    state.unlockPaywallRequest,
-  ]);
-
-  useEffect(() => {
-    if (state.unlockSuccessNonce <= lastUnlockSuccessNonceRef.current) return;
-    lastUnlockSuccessNonceRef.current = state.unlockSuccessNonce;
-    userDispatch({ type: "UserFetch" });
-  }, [state.unlockSuccessNonce, userDispatch]);
+  usePrivateRoomUnlockPaywallNavigation({
+    loginStatus: authState.loginStatus,
+    roomDispatch: dispatch,
+    unlockPaywallRequest: state.unlockPaywallRequest,
+  });
+  usePrivateRoomUnlockSuccessRefresh(state.unlockSuccessNonce);
 
   const profile = state.profile;
   const displayName =
@@ -117,10 +74,7 @@ export function PrivateRoomScreen() {
   );
 
   const handleTopUpClick = () => {
-    if (
-      authState.loginStatus === "guest" ||
-      authState.loginStatus === "notLoggedIn"
-    ) {
+    if (isPrivateRoomAuthRequired(authState.loginStatus)) {
       navigator.openAuth(ROUTES.privateRoom);
       return;
     }