fix(demo): remove login page

demo/src/app/page.tsx

@@ -1,13 +1,52 @@
-import LoginCard from "@/components/Card/Login"
-import styles from "./index.module.css"
+"use client"
+
+import { useAppSelector, EMobileActiveTab } from "@/common"
+import dynamic from "next/dynamic"
+
+import Header from "@/components/Layout/Header"
+import Action from "@/components/Layout/Action"
+// import RTCCard from "@/components/Dynamic/RTCCard"
+// import ChatCard from "@/components/Chat/ChatCard"
+import AuthInitializer from "@/components/authInitializer"
+import { cn } from "@/lib/utils"
+
+const DynamicRTCCard = dynamic(() => import("@/components/Dynamic/RTCCard"), {
+  ssr: false,
+})
+
+const DynamicChatCard = dynamic(() => import("@/components/Chat/ChatCard"), {
+  ssr: false,
+})
+
+export default function Home() {
+  const mobileActiveTab = useAppSelector(
+    (state) => state.global.mobileActiveTab,
+  )
 
-export default function Login() {
   return (
-    <main className={styles.login}>
-      <div className={styles.starts} />
-      <div className={styles.starts2} />
-      <div className={styles.starts3} />
-      <LoginCard />
-    </main>
+    <AuthInitializer>
+      <div className="relative mx-auto flex h-full min-h-screen flex-col md:h-screen">
+        <Header className="h-[60px]" />
+        <Action className="h-[48px]" />
+        <div className="mx-2 mb-2 flex h-full max-h-[calc(100vh-108px-24px)] flex-col md:flex-row md:gap-2">
+          <DynamicRTCCard
+            className={cn(
+              "m-0 w-full rounded-b-lg bg-[#181a1d] md:w-[480px] md:rounded-lg",
+              {
+                ["hidden md:block"]: mobileActiveTab === EMobileActiveTab.CHAT,
+              },
+            )}
+          />
+          <DynamicChatCard
+            className={cn(
+              "m-0 w-full rounded-b-lg bg-[#181a1d] md:rounded-lg",
+              {
+                ["hidden md:block"]: mobileActiveTab === EMobileActiveTab.AGENT,
+              },
+            )}
+          />
+        </div>
+      </div>
+    </AuthInitializer>
   )
 }

demo/src/components/authInitializer/index.tsx

@@ -1,30 +1,42 @@
 "use client"
 
 import { ReactNode, useEffect } from "react"
-import { useAppDispatch, getOptionsFromLocal } from "@/common"
+import {
+  useAppDispatch,
+  getOptionsFromLocal,
+  getRandomUserId,
+  getRandomChannel,
+  genRandomString,
+} from "@/common"
 import { setOptions, reset, setAgentSettings } from "@/store/reducers/global"
 
 interface AuthInitializerProps {
-  children: ReactNode;
+  children: ReactNode
 }
 
 const AuthInitializer = (props: AuthInitializerProps) => {
-  const { children } = props;
+  const { children } = props
   const dispatch = useAppDispatch()
 
   useEffect(() => {
     if (typeof window !== "undefined") {
       const data = getOptionsFromLocal()
-      if (data) {
+      if (data && data?.options?.channel) {
         dispatch(reset())
         dispatch(setOptions(data.options))
         dispatch(setAgentSettings(data.settings))
+      } else {
+        const newOptions = {
+          userName: genRandomString(8),
+          channel: getRandomChannel(),
+          userId: getRandomUserId(),
+        }
+        dispatch(setOptions(newOptions))
       }
     }
   }, [dispatch])
 
   return children
 }
 
-
-export default AuthInitializer;
+export default AuthInitializer