Refactor state

frontend/src/core/components/StatusBadge.tsx

@@ -1,6 +1,6 @@
 import { useState, useEffect } from "react";
 import { checkUserSimilarity } from "@/core/api/account/profile";
-import { useAppState } from "@/pages/chat/state";
+import { useUserStore } from "@/state/user";
 import { MaterialIcon } from "@/utils/material";
 
 interface StatusBadgeProps {
@@ -11,7 +11,7 @@ interface StatusBadgeProps {
 
 export function StatusBadge({ verified, userId, size = "small" }: StatusBadgeProps) {
     const [isSimilarToVerified, setIsSimilarToVerified] = useState(false);
-    const { user } = useAppState();
+    const { user } = useUserStore();
     
     const className = `status-badge ${size}`;
 

frontend/src/core/components/VerifyButton.tsx

@@ -1,6 +1,6 @@
 import { useState } from "react";
 import { verifyUser } from "@/core/api/account/profile";
-import { useAppState } from "@/pages/chat/state";
+import { useUserStore } from "@/state/user";
 import { MaterialButton } from "@/utils/material";
 
 interface VerifyButtonProps {
@@ -11,7 +11,7 @@ interface VerifyButtonProps {
 
 export function VerifyButton({ userId, verified, onVerificationChange }: VerifyButtonProps) {
     const [isVerifying, setIsVerifying] = useState(false);
-    const { user } = useAppState();
+    const { user } = useUserStore();
 
     // Only show for owner
     if (user.currentUser?.id !== 1) {

frontend/src/core/onlineStatusManager.ts

@@ -11,7 +11,7 @@ import type {
     SubscribeStatusWebSocketMessage,
     UnsubscribeStatusWebSocketMessage
 } from "./types";
-import { useAppState } from "@/pages/chat/state";
+import { usePresenceStore } from "@/state/presence";
 
 export interface UserStatus {
     online: boolean;
@@ -96,7 +96,7 @@ export class OnlineStatusManager {
         this.statusCache.set(userId, { online, lastSeen });
 
         // Update the global state
-        const { updateOnlineStatus } = useAppState.getState();
+        const { updateOnlineStatus } = usePresenceStore.getState();
         updateOnlineStatus(userId, online, lastSeen);
     }
 

frontend/src/core/typingManager.ts

@@ -16,7 +16,7 @@ import type {
     DmTypingRequest,
     StopDmTypingRequest
 } from "./types";
-import { useAppState } from "@/pages/chat/state";
+import { usePresenceStore } from "@/state/presence";
 
 /**
  * Manages typing indicators for public chat and DMs
@@ -133,7 +133,7 @@ export class TypingManager {
      * Handle incoming typing indicator from WebSocket
      */
     handleTyping(message: TypingWebSocketMessage): void {
-        const { addTypingUser } = useAppState.getState();
+        const { addTypingUser } = usePresenceStore.getState();
         addTypingUser(message.data.userId, message.data.username);
     }
 
@@ -141,7 +141,7 @@ export class TypingManager {
      * Handle incoming stop typing indicator from WebSocket
      */
     handleStopTyping(message: StopTypingWebSocketMessage): void {
-        const { removeTypingUser } = useAppState.getState();
+        const { removeTypingUser } = usePresenceStore.getState();
         removeTypingUser(message.data.userId);
     }
 
@@ -149,7 +149,7 @@ export class TypingManager {
      * Handle incoming DM typing indicator from WebSocket
      */
     handleDmTyping(message: DmTypingWebSocketMessage): void {
-        const { setDmTypingUser } = useAppState.getState();
+        const { setDmTypingUser } = usePresenceStore.getState();
         setDmTypingUser(message.data.userId, true);
     }
 
@@ -157,7 +157,7 @@ export class TypingManager {
      * Handle incoming stop DM typing indicator from WebSocket
      */
     handleStopDmTyping(message: StopDmTypingWebSocketMessage): void {
-        const { setDmTypingUser } = useAppState.getState();
+        const { setDmTypingUser } = usePresenceStore.getState();
         setDmTypingUser(message.data.userId, false);
     }
 

frontend/src/core/websocket.ts

@@ -11,7 +11,7 @@ import { delay } from "@/utils/utils";
 import { CallSignalingHandler } from "./calls/signaling";
 import { onlineStatusManager } from "./onlineStatusManager";
 import { typingManager } from "./typingManager";
-import { useAppState } from "@/pages/chat/state";
+import { useUserStore } from "@/state/user";
 
 /**
  * Creates a new WebSocket connection to the chat server
@@ -170,14 +170,14 @@ function setupEventHandlers(): void {
                 typingManager.handleStopDmTyping(response as any);
             } else if (response.type === "suspended") {
                 // Handle account suspension
-                const { setSuspended } = useAppState.getState();
+                const { setSuspended } = useUserStore.getState();
                 const reason = response.data?.reason || "No reason provided";
                 setSuspended(reason);
                 // Close WebSocket connection
                 websocket.close();
             } else if (response.type === "account_deleted") {
                 // Handle account deletion - silent logout
-                const { logout } = useAppState.getState();
+                const { logout } = useUserStore.getState();
                 logout();
                 // Close WebSocket connection
                 websocket.close();