A lot of refactoring on new events system

seed-ecosystem · Nov 30, 2024 · 8bc64d7 · 8bc64d7
1 parent 17bd83b
commit 8bc64d7
Show file tree

Hide file tree

Showing 33 changed files with 397 additions and 431 deletions.
diff --git a/src/api/create-server-socket.ts b/src/api/create-server-socket.ts
@@ -77,6 +77,7 @@ export function createServerSocket(url: string): SeedSocket {
       }
 
       if (event.type == "event") {
+        console.log("<< ws: event", event);
         events.emit(event.event);
       }
     };

diff --git a/src/api/event/socket-event.ts b/src/api/event/socket-event.ts
@@ -1,3 +1,9 @@
-import {SocketEventNew} from "@/api/event/socket-event-new.ts";
+import {Message} from "@/api/message/message.ts";
 
-export type SocketEvent = SocketEventNew;
+export type SocketEvent = {
+  type: "new";
+  message: Message;
+} | {
+  type: "wait";
+  chatId: string;
+};
diff --git a/src/api/request/subscribe-request.ts b/src/api/request/subscribe-request.ts
@@ -2,5 +2,6 @@ import {SocketRequest} from "@/api/request/socket-request.ts";
 
 export interface SubscribeRequest extends SocketRequest<never> {
   type: "subscribe";
-  chatId: string[];
+  chatId: string;
+  nonce: number;
 }
diff --git a/src/components/AppDependencies.ts b/src/components/AppDependencies.ts
@@ -19,13 +19,18 @@ export async function createAppDependencies(): Promise<AppDependencies> {
   const persistence = await createPersistence();
   const socket = createServerSocket("https://meetacy.app/seed-go");
 
-  socket.bind({ type: "subscribe", chatId: [chat.chatId] } as SubscribeRequest);
+  const lastNonce = await persistence.message.lastMessageNonce(chat);
 
-  if (await persistence.key.last({ chat }) == null) {
-    await persistence.key.push({
-      chat: chat,
+  socket.bind({ type: "subscribe", chatId: chat.chatId, nonce: lastNonce ?? 0 } as SubscribeRequest);
+
+  if (await persistence.message.lastMessage(chat) == null) {
+    await persistence.message.add({
+      ...chat,
       key: key,
-      nonce: 0
+      nonce: 0,
+      content: {
+        type: "deferred"
+      }
     });
   }
 
@@ -34,9 +39,7 @@ export async function createAppDependencies(): Promise<AppDependencies> {
     socket: socket,
     persistence: persistence,
     createChat() {
-      const result = createChatDependencies(this, chat);
-      result.loadMore();
-      return result;
+      return createChatDependencies(this, chat);
     }
   };
 

diff --git a/src/components/chat/ChatDependencies.ts b/src/components/chat/ChatDependencies.ts
@@ -1,14 +1,13 @@
 import {createChatEventBus} from "@/usecase/chat/event-bus/create-chat-event-bus.ts";
-import {createGetHistoryUsecase} from "@/usecase/chat/get-history-usecase/create-get-history-usecase.ts";
-import {createLoadMoreUsecase} from "@/usecase/chat/load-more-usecase/create-load-more-usecase.ts";
 import {AppDependencies} from "@/components/AppDependencies.ts";
 import {createMessageCoder} from "@/crypto/create-message-coder.ts";
 import {createGetMessageKeyUsecase} from "@/usecase/chat/get-message-key-usecase/create-get-message-key-usecase.ts";
 import {Chat} from "@/persistence/chat/chat.ts";
 import {EventBus} from "@/usecase/chat/event-bus/event-bus.ts";
-import {LoadMoreUsecase} from "@/usecase/chat/load-more-usecase/load-more-usecase.ts";
-import {SendMessageUsecase} from "@/usecase/chat/send-message/send-message-usecase.ts";
-import {createSendMessageUsecase} from "@/usecase/chat/send-message/create-send-message-usecase.ts";
+import {
+  createSendTextMessageUsecase,
+  SendTextMessageUsecase
+} from "@/usecase/chat/send-message/send-text-message-usecase.ts";
 import {createLocalNonceUsecase} from "@/usecase/chat/nonce/create-local-nonce-usecase.ts";
 import {SetNicknameUsecase} from "@/usecase/chat/nickname/set-nickname-usecase.ts";
 import {createSetNicknameUsecase} from "@/usecase/chat/nickname/create-set-nickname-usecase.ts";
@@ -20,12 +19,14 @@ import {
 } from "@/usecase/chat/messages-snapshot-usecase/create-messages-snapshot-usecase.ts";
 import {createDecodeMessagesUsecase} from "@/usecase/chat/decode-messages-usecase/decode-message-usecase.ts";
 import {handleSocketEventsUsecase} from "@/usecase/chat/socket-event-usecase/handle-socket-events-usecase.ts";
+import {createSendMessageUsecase} from "@/usecase/chat/send-message/send-message-usecase.ts";
+import {messagesHistoryUsecase} from "@/usecase/chat/messages-history-usecase/messages-history-usecase.ts";
+import {OptionPredicator} from "typia/lib/programmers/helpers/OptionPredicator";
 
 export interface ChatDependencies {
   chat: Chat;
   events: EventBus;
-  loadMore: LoadMoreUsecase;
-  sendMessage: SendMessageUsecase;
+  sendMessage: SendTextMessageUsecase;
   setNickname: SetNicknameUsecase;
   getNickname: GetNicknameUsecase;
 }
@@ -36,8 +37,6 @@ export function createChatDependencies(
 ): ChatDependencies {
   const {socket, persistence} = app;
 
-  const {key} = persistence;
-
   const events = createChatEventBus();
   const coder = createMessageCoder();
   const sanitizeContent = createSanitizeContentUsecase();
@@ -53,34 +52,44 @@ export function createChatDependencies(
     storage: persistence.nickname
   });
 
-  const getMessageKey = createGetMessageKeyUsecase({ keyStorage: key, coder, chat });
+  const getMessageKey = createGetMessageKeyUsecase({ messageStorage: persistence.message, coder, chat });
 
   const decodeMessage = createDecodeMessagesUsecase({
     getMessageKey, coder,
     sanitizeContent, getNickname
   });
 
-  const getHistory = createGetHistoryUsecase({ socket, chat, decodeMessage });
-  const loadMore = createLoadMoreUsecase({ getHistory, events });
-
   const localNonce = createLocalNonceUsecase();
 
   const sendMessage = createSendMessageUsecase({
     coder, events, localNonce,
     getMessageKey, socket,
-    nickname, sanitizeContent
+    sanitizeContent, chat
+  });
+
+  const sendTextMessage = createSendTextMessageUsecase({
+    nickname, sendMessage
   });
 
   const setNickname = createSetNicknameUsecase({
     events,
     storage: persistence.nickname
   });
 
-  const socketEventUsecase = handleSocketEventsUsecase({decodeMessage, events, socket, messagesSnapshot});
+  const socketEventUsecase = handleSocketEventsUsecase({
+    decodeMessage, events,
+    socket, messagesSnapshot,
+    messagesStorage: persistence.message
+  });
   socketEventUsecase();
 
+  const messageHistoryUsecase = messagesHistoryUsecase({
+    chat, events, getNickname, messagesStorage: persistence.message
+  });
+  messageHistoryUsecase();
+
   return {
-    events, loadMore, sendMessage,
+    events, sendMessage: sendTextMessage,
     chat, setNickname, getNickname
   };
 }
diff --git a/src/components/chat/ChatScreen.tsx b/src/components/chat/ChatScreen.tsx
@@ -5,21 +5,22 @@ import {EmptyMessages} from "@/components/chat/EmptyMessages.tsx";
 import {MessageInput} from "@/components/chat/MessageInput.tsx";
 import {useEffect, useState} from "react";
 import {ChatDependencies} from "@/components/chat/ChatDependencies.ts";
+import {LoadingSpinner} from "@/components/ui/loading-spinner.tsx";
 
 export function ChatScreen(
-  {chat, events, loadMore, sendMessage, setNickname, getNickname}: ChatDependencies
+  {events, sendMessage, setNickname, getNickname}: ChatDependencies
 ) {
   const [messages, setMessages] = useState<Message[]>([]);
 
-  const [hasMore, setHasMore] = useState(true);
+  const [loaded, setLoaded] = useState(false);
   const [text, setText] = useState("");
   const [nickname, setNicknameState] = useState(getNickname());
 
   useEffect(() => {
     const subscription = events.flow.collect((event) => {
       switch (event.type) {
-        case "has_no_more":
-          setHasMore(false);
+        case "loaded":
+          setLoaded(true);
           break;
         case "messages_snapshot":
           setMessages(event.messages);
@@ -42,18 +43,17 @@ export function ChatScreen(
         <div className="w-full flex-grow flex justify-center">
           <div className="h-full flex-grow max-w-full md:max-w-3xl flex flex-col">
             {
-              (messages.length == 0 && !hasMore)
-                ? EmptyMessages()
-                : <MessagesList
-                    messages={messages}
-                    hasMore={hasMore}
-                    next={loadMore} />
+              loaded
+                ? messages.length == 0
+                  ? EmptyMessages()
+                  : <MessagesList messages={messages}/>
+                : LoadingMessages()
             }
 
             <MessageInput
               text={text}
               setText={setText}
-              onClick={() => sendMessage({ text, ...chat })}
+              onClick={() => sendMessage({ text })}
             />
           </div>
         </div>
@@ -66,3 +66,9 @@ export function ChatScreen(
     </>
   )
 }
+
+function LoadingMessages() {
+  return <>
+    <div className="w-full h-full flex justify-center items-center"><LoadingSpinner/></div>
+  </>;
+}
diff --git a/src/components/chat/MessagesList.tsx b/src/components/chat/MessagesList.tsx
@@ -7,19 +7,15 @@ import {LoadingSpinner} from "@/components/ui/loading-spinner.tsx";
 import {CircleX} from "lucide-react";
 
 export function MessagesList(
-  {messages, hasMore, next}: {
-    messages: Message[];
-    hasMore: boolean;
-    next(): void;
-  }
+  {messages}: { messages: Message[]; }
 ) {
   return <>
     <div className="flex flex-col-reverse flex-grow h-0 w-full overflow-y-scroll no-scrollbar" id="chatMessageListScroll">
 
       <ChatMessageList
         dataLength={messages.length}
-        next={next}
-        hasMore={hasMore}
+        next={() => {}}
+        hasMore={false}
         style={{display: 'flex', flexDirection: 'column-reverse'}}>
         {messages.map((message) => {
           const variant = message.isAuthor ? 'sent' : 'received';

diff --git a/src/crypto/create-message-coder.ts b/src/crypto/create-message-coder.ts
@@ -5,43 +5,46 @@ import {decryptAes256, encryptAes256, hmacSha256, verifyHmacSha256} from "@/cryp
 export function createMessageCoder(): MessageCoder {
   return {
     async decode({ content, contentIV, signature, key }) {
-      // Check that message is signed
-      const verify = await verifyHmacSha256({
-        data: "SIGNATURE",
-        key: key,
-        signature: signature
-      })
-
-      if (!verify) {
-        return null
-      }
 
       // Decrypt content
       const decryptedJSON = await decryptAes256({
         encrypted: content,
         iv: contentIV,
         key: key,
-      })
+      });
+
+      if (!decryptedJSON) return null;
+
+      // Check that message is signed
+      const verify = await verifyHmacSha256({
+        data: "SIGNATURE:" + decryptedJSON.string,
+        key: key,
+        signature: signature
+      });
+
+      if (!verify) return null;
 
       return JSON.parse(decryptedJSON.string) as MessageContent;
     },
 
     async encode({ content, key }) {
+      const contentString = JSON.stringify(content);
+
       const signature = await hmacSha256({
-        data: "SIGNATURE",
+        data: "SIGNATURE:" + contentString,
         key: key
-      })
+      });
 
       const encryptedContent = await encryptAes256({
-        data: JSON.stringify(content),
+        data: contentString,
         key: key
       });
 
       return {
         contentIV: encryptedContent.iv,
         content: encryptedContent.encrypted,
         signature: signature
-      }
+      };
     },
 
     deriveNextKey(key: string): Promise<string> {

diff --git a/src/crypto/message/content/typing-content.ts b/src/crypto/message/content/typing-content.ts
@@ -0,0 +1,4 @@
+export interface TypingContent {
+  type: "typing";
+  title: string;
+}
diff --git a/src/crypto/message/content/unknown-content.ts b/src/crypto/message/content/unknown-content.ts
@@ -1 +1,3 @@
-export type UnknownContent = { type: "unknown" };
+export interface UnknownContent {
+  type: "unknown";
+}
diff --git a/src/crypto/subtle-crypto.ts b/src/crypto/subtle-crypto.ts
@@ -44,22 +44,24 @@ export async function decryptAes256(
     iv: string;
     key: string;
   }
-): Promise<{ string: string }> {
+): Promise<{ string: string } | undefined> {
   const { encrypted, iv, key } = options;
   const importedKey = await importCryptoKey(key, aesOptions, "decrypt");
 
-  const decrypted = await crypto.decrypt(
-    {
-      iv: base64ToArrayBuffer(iv),
-      ...aesOptions
-    },
-    importedKey,
-    base64ToArrayBuffer(encrypted)
-  )
-
-  return {
-    string: arrayBufferToString(decrypted)
-  }
+  try {
+    const decrypted = await crypto.decrypt(
+      {
+        iv: base64ToArrayBuffer(iv),
+        ...aesOptions
+      },
+      importedKey,
+      base64ToArrayBuffer(encrypted)
+    )
+
+    return {
+      string: arrayBufferToString(decrypted)
+    }
+  } catch (error) {}
 }
 
 

diff --git a/src/persistence/create-persistence.ts b/src/persistence/create-persistence.ts
@@ -2,15 +2,13 @@ import {Persistence} from "@/persistence/persistence.ts";
 import {openDB} from "idb";
 import {createChatObjectStore, createChatStorage} from "@/persistence/chat/create-chat-storage.ts";
 import {createMessageObjectStore, createMessageStorage} from "@/persistence/message/create-message-storage.ts";
-import {createKeyObjectStore, createKeyStorage} from "@/persistence/key/create-key-storage.ts";
 import {createNicknameObjectStore, createNicknameStorage} from "@/persistence/nickname/create-nickname-storage.ts";
 
 export async function createPersistence(): Promise<Persistence> {
   const db = await openDB("persistence", 2, {
     upgrade(database, version) {
       if (version == 0) {
         createMessageObjectStore(database);
-        createKeyObjectStore(database);
         createChatObjectStore(database);
         createNicknameObjectStore(database);
       }
@@ -23,7 +21,6 @@ export async function createPersistence(): Promise<Persistence> {
   return {
     chat: createChatStorage(db),
     message: createMessageStorage(db),
-    key: createKeyStorage(db),
     nickname: createNicknameStorage(db)
   };
 }
-Original file line number
+Diff line change
@@ Expand Up / @@ -77,6 +77,7 @@ export function createServerSocket(url: string): SeedSocket { @@
           }
           if (event.type == "event") {
+            console.log("<< ws: event", event);
             events.emit(event.event);
           }
         };
@@ Expand Down @@