refactor(flat-pages): update room not begin modal (#2115)

netless-io · Feb 20, 2024 · d429e3c · d429e3c
1 parent dda6d21
commit d429e3c
Show file tree

Hide file tree

Showing 5 changed files with 18 additions and 51 deletions.
diff --git a/packages/flat-pages/src/HomePage/index.tsx b/packages/flat-pages/src/HomePage/index.tsx
@@ -61,18 +61,6 @@ export const HomePage = observer(function HomePage() {
         };
     }, [refreshRooms, isLogin]);
 
-    useEffect(() => {
-        if (!isLogin) {
-            return;
-        }
-
-        if (globalStore.requestRefreshRooms) {
-            void refreshRooms();
-            void globalStore.updatePmiRoomList();
-            globalStore.setRequestRefreshRooms(false);
-        }
-    }, [refreshRooms, isLogin, globalStore.requestRefreshRooms]);
-
     return (
         <div className="homepage-layout-horizontal-container">
             <MainRoomMenu />

diff --git a/packages/flat-pages/src/components/RoomNotBeginModal.tsx b/packages/flat-pages/src/components/RoomNotBeginModal.tsx
@@ -1,38 +1,23 @@
-import React, { useContext, useEffect, useState } from "react";
+import React, { useContext, useMemo } from "react";
 import { Button, Modal } from "antd";
 import { observer } from "mobx-react-lite";
-import { RoomStoreContext, GlobalStoreContext } from "./StoreProvider";
 import { useLanguage, useTranslate } from "@netless/flat-i18n";
+import { GlobalStoreContext } from "./StoreProvider";
 
 export interface RoomNotBeginModalProps {}
 
 export const RoomNotBeginModal = observer<RoomNotBeginModalProps>(function RoomNotBeginModal({}) {
     const t = useTranslate();
     const lang = useLanguage();
-    const [title, setTitle] = useState("");
-    const [open, setOpen] = useState(false);
-    const roomStore = useContext(RoomStoreContext);
     const globalStore = useContext(GlobalStoreContext);
-    const uuid = globalStore.roomNotBeginRoomUUID;
-    const joinEarly = globalStore.serverRegionConfig?.server.joinEarly || 5;
 
-    const hasRoom = uuid && roomStore.rooms.has(uuid);
-    const closeModal = (): void => setOpen(false);
+    const title = useMemo((): string => {
+        const { title, ownerName } = globalStore.roomNotBegin || {};
+        return title || (ownerName && t("create-room-default-title", { name: ownerName })) || "";
+    }, [globalStore.roomNotBegin]);
 
-    useEffect(() => {
-        if (!open && uuid && roomStore.rooms.has(uuid)) {
-            const { title, ownerName } = roomStore.rooms.get(uuid)!;
-            if (title) {
-                setTitle(title);
-            } else if (ownerName) {
-                setTitle(t("create-room-default-title", { name: ownerName }));
-            } else {
-                setTitle("");
-            }
-            setOpen(true);
-            globalStore.updateRoomNotBeginRoomUUID(null);
-        }
-    }, [uuid, hasRoom]);
+    const joinEarly = globalStore.serverRegionConfig?.server.joinEarly || 5;
+    const closeModal = (): void => globalStore.updateRoomNotBegin(null);
 
     return (
         <Modal
@@ -43,7 +28,7 @@ export const RoomNotBeginModal = observer<RoomNotBeginModalProps>(function RoomN
                     {t("confirm")}
                 </Button>,
             ]}
-            open={open}
+            open={!!globalStore.roomNotBegin}
             title={[
                 t("room-not-begin-title-pre"),
                 <em key="room-not-begin-minutes" className="room-not-begin-early-minutes">

diff --git a/packages/flat-pages/src/utils/join-room-handler.ts b/packages/flat-pages/src/utils/join-room-handler.ts
@@ -58,26 +58,25 @@ export const joinRoomHandler = async (
 
         // if room not started, show different message according to owner
         if (e.errorCode === RequestErrorCode.RoomNotBegin && e.detail) {
-            const { uuid, ownerUUID } = e.detail as {
+            const { title, ownerUUID, ownerName } = e.detail as {
+                title: string;
                 uuid: string;
                 beginTime: number;
                 ownerUUID: string;
+                ownerName?: string;
             };
             if (globalStore.userUUID === ownerUUID) {
                 (e as ServerRequestError).errorMessage = "your-room-is-not-started-yet";
                 // show it in error tips
             } else {
                 pushHistory(RouteNameType.HomePage);
-                globalStore.setRequestRefreshRooms(true);
                 // show the modal
-                globalStore.updateRoomNotBeginRoomUUID(uuid);
+                globalStore.updateRoomNotBegin({ title, ownerName });
                 return;
             }
         }
 
         pushHistory(RouteNameType.HomePage);
         errorTips(e);
-
-        globalStore.setRequestRefreshRooms(true);
     }
 };
diff --git a/packages/flat-server-api/src/error.ts b/packages/flat-server-api/src/error.ts
@@ -32,6 +32,7 @@ export enum RequestErrorCode {
     RoomExpired, // room expired
     RoomNotBegin, // join room before begin_time
     RoomCreateLimit, // create room reach max limit
+    RoomNotBeginAndAddList, // join room before begin_time, and just added to the room list
 
     InternalError = 220000, // unknown error
     ForwardFailed, // forward failed
@@ -122,6 +123,7 @@ export const RequestErrorMessage = {
     [RequestErrorCode.RoomExpired]: "the-room-is-expired",
     [RequestErrorCode.RoomNotBegin]: "the-room-is-not-started-yet",
     [RequestErrorCode.RoomCreateLimit]: "rooms-has-reached-the-limit",
+    [RequestErrorCode.RoomNotBeginAndAddList]: "the-room-is-not-started-yet",
 
     [RequestErrorCode.InternalError]: "unknown-error",
     [RequestErrorCode.ForwardFailed]: "forward-failed",

diff --git a/packages/flat-stores/src/global-store.ts b/packages/flat-stores/src/global-store.ts
@@ -51,10 +51,7 @@ export class GlobalStore {
     public pmi: string | null = null;
     public pmiRoomList: PmiRoom[] | null = [];
 
-    public requestRefreshRooms = false;
-    // when get RoomNotBegin error, store the room's UUID here
-    // and show the modal to tell the user which room is added to the list.
-    public roomNotBeginRoomUUID: string | null = null;
+    public roomNotBegin: { title?: string; ownerName?: string } | null = null;
 
     // login with password
     public currentAccount: Account | null = null;
@@ -325,12 +322,8 @@ export class GlobalStore {
         this.serverRegionConfig = config;
     };
 
-    public setRequestRefreshRooms(value = true): void {
-        this.requestRefreshRooms = value;
-    }
-
-    public updateRoomNotBeginRoomUUID(roomUUID: string | null): void {
-        this.roomNotBeginRoomUUID = roomUUID;
+    public updateRoomNotBegin(value: { title?: string; ownerName?: string } | null): void {
+        this.roomNotBegin = value;
     }
 }