Message delete

src/hooks/use-app.ts

@@ -12,7 +12,7 @@ import { toast } from "sonner";
 export default function useApp(): App {
   const node = useRef<WebSocket | null>(null);
   const [profiles, setProfiles] = useState<StringMap<UserProfile | null>>({});
-  const { messages, addMessage } = useMessages();
+  const { messages, addMessage, deleteMessage, editMessage } = useMessages();
   const [sidebarOpen, setSidebarOpen] = useState(false);
   const profile = useUser();
   const [clientSettings, setClientSettings] = useClientSettings();
@@ -38,6 +38,8 @@ export default function useApp(): App {
   }, []);
 
   return {
+    editMessage,
+    deleteMessage,
     currentChannel,
     setCurrentChannel,
     server,
@@ -61,7 +63,7 @@ export default function useApp(): App {
 
       const onResponse = (res: Response<UserProfile>) => {
         setProfiles((prev) => {
-          console.log('test')
+          console.log("test");
           prev[id] = res.data as UserProfile;
           return prev;
         });

src/hooks/use-messages.ts

@@ -6,6 +6,8 @@ interface MessageStore {
   messages: Message[];
   setMessages: (msgs: Message[]) => void;
   addMessage: (msg: Message) => void;
+  deleteMessage: (id: number) => void;
+  editMessage: (id: number, contents: string) => void;
   clearMessages: () => void;
 }
 
@@ -13,6 +15,8 @@ type ServerMessageStore = {
   messages: Record<string, Message[]>; // server_id → messages
   setMessages: (serverId: string, msgs: Message[]) => void;
   addMessage: (serverId: string, msg: Message) => void;
+  deleteMessage: (serverId: string, id: number) => void;
+  editMessage: (serverId: string, id: number, contents: string) => void;
   clearMessages: (serverId?: string) => void;
 };
 
@@ -27,6 +31,16 @@ export const useMessages = create<MessageStore>()(
             ? state
             : { messages: [...state.messages, msg] }
         ),
+      deleteMessage: (id: number) =>
+        set((state) => ({
+          messages: state.messages.filter((m) => m.id !== id),
+        })),
+      editMessage: (id: number, contents) =>
+        set((state) => ({
+          messages: state.messages.map((m) =>
+            m.id === id ? { ...m, contents } : m
+          ),
+        })),
       clearMessages: () => set({ messages: [] }),
     }),
     { name: "chat-messages" }
@@ -47,7 +61,6 @@ export const useServerMessages = create<ServerMessageStore>()(
         set((state) => {
           const serverMsgs = state.messages[serverId] || [];
 
-          // avoid duplicates
           if (serverMsgs.some((m) => m.id === msg.id)) return state;
 
           return {
@@ -58,6 +71,26 @@ export const useServerMessages = create<ServerMessageStore>()(
           };
         }),
 
+      deleteMessage: (serverId, id) =>
+        set((state) => ({
+          messages: {
+            ...state.messages,
+            [serverId]: (state.messages[serverId] || []).filter(
+              (m) => m.id !== id
+            ),
+          },
+        })),
+
+      editMessage: (serverId, id, contents) =>
+        set((state) => ({
+          messages: {
+            ...state.messages,
+            [serverId]: (state.messages[serverId] || []).map((m) =>
+              m.id === id ? { ...m, contents } : m
+            ),
+          },
+        })),
+
       clearMessages: (serverId) =>
         set((state) =>
           serverId