Fix null issues

frontend/src/ui/panels/DMPanel.ts

@@ -1,10 +1,10 @@
-import { MessagePanel, type MessagePanelCallbacks } from "./MessagePanel";
+import { MessagePanel, type MessagePanelCallbacks, type MessagePanelState } from "./MessagePanel";
 import { 
     fetchDMHistory, 
     decryptDm, 
     sendDMViaWebSocket 
 } from "../../api/dmApi";
-import type { Message } from "../../core/types";
+import type { Message, WebSocketMessage } from "../../core/types";
 import type { UserState } from "../state";
 
 export interface DMPanelData {
@@ -22,7 +22,7 @@ export class DMPanel extends MessagePanel {
     constructor(
         user: UserState,
         callbacks: MessagePanelCallbacks,
-        onStateChange: (state: any) => void
+        onStateChange: (state: MessagePanelState) => void
     ) {
         super("dm", user, callbacks, onStateChange);
     }
@@ -116,7 +116,7 @@ export class DMPanel extends MessagePanel {
     }
 
     // Handle incoming WebSocket DM messages
-    handleWebSocketMessage = async (response: any): Promise<void> => {
+    handleWebSocketMessage = async (response: WebSocketMessage): Promise<void> => {
         if (response.type === "dmNew" && this.dmData) {
             const { senderId, recipientId, ...envelope } = response.data;
             

frontend/src/ui/panels/MessagePanel.ts

@@ -22,7 +22,7 @@ export interface MessagePanelCallbacks {
 export abstract class MessagePanel {
     protected state: MessagePanelState;
     protected callbacks: MessagePanelCallbacks;
-    public onStateChange: (state: MessagePanelState) => void;
+    public onStateChange: ((state: MessagePanelState) => void) | null;
     protected currentUser: UserState;
 
     constructor(
@@ -57,8 +57,10 @@ export abstract class MessagePanel {
     // Common methods
     protected updateState(updates: Partial<MessagePanelState>): void {
         this.state = { ...this.state, ...updates };
+        if (this.onStateChange) {
             this.onStateChange(this.state);
         }
+    }
 
     protected addMessage(message: Message): void {
         const messageExists = this.state.messages.some(msg => msg.id === message.id);

frontend/src/ui/panels/PublicChatPanel.ts

@@ -1,4 +1,4 @@
-import { MessagePanel, type MessagePanelCallbacks } from "./MessagePanel";
+import { MessagePanel, type MessagePanelCallbacks, type MessagePanelState } from "./MessagePanel";
 import { API_BASE_URL } from "../../core/config";
 import { getAuthHeaders } from "../../auth/api";
 import { request } from "../../core/websocket";
@@ -12,7 +12,7 @@ export class PublicChatPanel extends MessagePanel {
         chatName: string,
         currentUser: UserState,
         callbacks: MessagePanelCallbacks,
-        onStateChange: (state: any) => void
+        onStateChange: (state: MessagePanelState) => void
     ) {
         super(`public-${chatName}`, currentUser, callbacks, onStateChange);
         this.updateState({