chore: delete mem and use global type

package.json

@@ -96,7 +96,6 @@
     "date-fns": "^2.30.0",
     "idb-keyval": "^6.2.1",
     "lucide-react": "^0.263.0",
-    "mem": "^9.0.2",
     "nanoid": "^4.0.2",
     "peerjs": "^1.4.7",
     "react-markdown": "^8.0.7",

pnpm-lock.yaml

@@ -41,9 +41,6 @@ dependencies:
   lucide-react:
     specifier: ^0.263.0
     version: 0.263.0(react@18.2.0)
-  mem:
-    specifier: ^9.0.2
-    version: 9.0.2
   nanoid:
     specifier: ^4.0.2
     version: 4.0.2
@@ -5112,6 +5109,7 @@ packages:
     engines: {node: '>=6'}
     dependencies:
       p-defer: 1.0.0
+    dev: true
 
   /map-obj@1.0.1:
     resolution: {integrity: sha512-7N/q3lyZ+LVCp7PzuxrJr4KMbBE2hW7BT7YNia330OFxIf4d3r5zVpicP2650l7CPN6RM9zOJRl3NGpqSiw3Eg==}
@@ -5275,14 +5273,6 @@ packages:
       p-is-promise: 2.1.0
     dev: true
 
-  /mem@9.0.2:
-    resolution: {integrity: sha512-F2t4YIv9XQUBHt6AOJ0y7lSmP1+cY7Fm1DRh9GClTGzKST7UWLMx6ly9WZdLH/G/ppM5RL4MlQfRT71ri9t19A==}
-    engines: {node: '>=12.20'}
-    dependencies:
-      map-age-cleaner: 0.1.3
-      mimic-fn: 4.0.0
-    dev: false
-
   /memorystream@0.3.1:
     resolution: {integrity: sha512-S3UwM3yj5mtUSEfP41UZmt/0SCoVYUcU1rkXv+BQ5Ig8ndL4sPoJNBUJERafdPb5jjHJGuMgytgKvKIf58XNBw==}
     engines: {node: '>= 0.10.0'}
@@ -5587,6 +5577,7 @@ packages:
   /mimic-fn@4.0.0:
     resolution: {integrity: sha512-vqiC06CuhBTUdZH+RYl8sFrL096vA45Ok5ISO6sE/Mr1jRbGH4Csnhi8f3wKVl7x8mO4Au7Ir9D3Oyv1VYMFJw==}
     engines: {node: '>=12'}
+    dev: true
 
   /mimic-response@3.1.0:
     resolution: {integrity: sha512-z0yWI+4FDrrweS8Zmt4Ej5HdJmky15+L2e6Wgn3+iK5fWzb6T3fhNFq2+MeTRb064c6Wr4N/wv0DzQTjNzHNGQ==}
@@ -6021,6 +6012,7 @@ packages:
   /p-defer@1.0.0:
     resolution: {integrity: sha512-wB3wfAxZpk2AzOfUMJNL+d36xothRSyj8EXOa4f6GMqYDN9BJaaSISbsk+wS9abmnebVw95C2Kb5t85UmpCxuw==}
     engines: {node: '>=4'}
+    dev: true
 
   /p-is-promise@2.1.0:
     resolution: {integrity: sha512-Y3W0wlRPK8ZMRbNq97l4M5otioeA5lm1z7bkNkxCka8HSPjR0xRWmpCmc9utiaLP9Jb1eD8BgeIxTW4AIF45Pg==}

src/domain/MessageList.ts

@@ -2,129 +2,123 @@ import { Remesh } from 'remesh'
 import { ListModule } from 'remesh/modules/list'
 import { nanoid } from 'nanoid'
 import { from, map, tap, merge } from 'rxjs'
-import mem from 'mem'
 import Storage from './externs/Storage'
+import { type Message } from '@/types'
 
-export interface Message {
+const MessageListDomain = Remesh.domain({
-  id: string
+  name: 'MessageListDomain',
-  [key: string]: any
+  impl: (domain) => {
-}
+    const storage = domain.getExtern(Storage)
+    const storageKey = `${storage.name}.MESSAGE_LIST`
 
-const MessageListDomain = <T extends Message>() =>
+    const MessageListModule = ListModule<Message>(domain, {
-  Remesh.domain({
+      name: 'MessageListModule',
-    name: 'MessageListDomain',
+      key: (message) => message.id
-    impl: (domain) => {
+    })
-      const storage = domain.getExtern(Storage)
-      const storageKey = `${storage.name}.MESSAGE_LIST`
 
-      const MessageListModule = ListModule<T>(domain, {
+    const ListQuery = MessageListModule.query.ItemListQuery
-        name: 'MessageListModule',
-        key: (message) => message.id
-      })
 
-      const ListQuery = MessageListModule.query.ItemListQuery
+    const ItemQuery = MessageListModule.query.ItemQuery
 
-      const ItemQuery = MessageListModule.query.ItemQuery
+    const ChangeListEvent = domain.event({
+      name: 'MessageList.ChangeListEvent',
+      impl: ({ get }) => {
+        return get(ListQuery())
+      }
+    })
 
-      const ChangeListEvent = domain.event({
+    const CreateItemEvent = domain.event<Message>({
-        name: 'MessageList.ChangeListEvent',
+      name: 'MessageList.CreateItemEvent'
-        impl: ({ get }) => {
+    })
-          return get(ListQuery())
-        }
-      })
 
-      const CreateItemEvent = domain.event<T>({
+    const CreateItemCommand = domain.command({
-        name: 'MessageList.CreateItemEvent'
+      name: 'MessageList.CreateItemCommand',
-      })
+      impl: (_, message: Omit<Message, 'id'>) => {
+        const newMessage = { ...message, id: nanoid() }
+        return [MessageListModule.command.AddItemCommand(newMessage), CreateItemEvent(newMessage), ChangeListEvent()]
+      }
+    })
 
-      const CreateItemCommand = domain.command({
+    const UpdateItemEvent = domain.event<Message>({
-        name: 'MessageList.CreateItemCommand',
+      name: 'MessageList.UpdateItemEvent'
-        impl: (_, message: Omit<T, 'id'>) => {
+    })
-          const newMessage = { ...message, id: nanoid() } as T
-          return [MessageListModule.command.AddItemCommand(newMessage), CreateItemEvent(newMessage), ChangeListEvent()]
-        }
-      })
 
-      const UpdateItemEvent = domain.event<T>({
+    const UpdateItemCommand = domain.command({
-        name: 'MessageList.UpdateItemEvent'
+      name: 'MessageList.UpdateItemCommand',
-      })
+      impl: (_, message: Message) => {
+        return [MessageListModule.command.UpdateItemCommand(message), UpdateItemEvent(message), ChangeListEvent()]
+      }
+    })
 
-      const UpdateItemCommand = domain.command({
+    const DeleteItemEvent = domain.event<string>({
-        name: 'MessageList.UpdateItemCommand',
+      name: 'MessageList.DeleteItemEvent'
-        impl: (_, message: T) => {
+    })
-          return [MessageListModule.command.UpdateItemCommand(message), UpdateItemEvent(message), ChangeListEvent()]
-        }
-      })
 
-      const DeleteItemEvent = domain.event<string>({
+    const DeleteItemCommand = domain.command({
-        name: 'MessageList.DeleteItemEvent'
+      name: 'MessageList.DeleteItemCommand',
-      })
+      impl: (_, id: string) => {
+        return [MessageListModule.command.DeleteItemCommand(id), DeleteItemEvent(id), ChangeListEvent()]
+      }
+    })
 
-      const DeleteItemCommand = domain.command({
+    const ClearListEvent = domain.event({
-        name: 'MessageList.DeleteItemCommand',
+      name: 'MessageList.ClearListEvent'
-        impl: (_, id: string) => {
+    })
-          return [MessageListModule.command.DeleteItemCommand(id), DeleteItemEvent(id), ChangeListEvent()]
-        }
-      })
 
-      const ClearListEvent = domain.event({
+    const ClearListCommand = domain.command({
-        name: 'MessageList.ClearListEvent'
+      name: 'MessageList.ClearListCommand',
-      })
+      impl: () => {
+        return [MessageListModule.command.DeleteAllCommand(), ClearListEvent(), ChangeListEvent()]
+      }
+    })
 
-      const ClearListCommand = domain.command({
+    const InitListEvent = domain.event<Message[]>({
-        name: 'MessageList.ClearListCommand',
+      name: 'MessageList.InitListEvent'
-        impl: () => {
+    })
-          return [MessageListModule.command.DeleteAllCommand(), ClearListEvent(), ChangeListEvent()]
-        }
-      })
 
-      const InitListEvent = domain.event<T[]>({
+    const InitListCommand = domain.command({
-        name: 'MessageList.InitListEvent'
+      name: 'MessageList.InitListCommand',
-      })
+      impl: (_, messages: Message[]) => {
+        return [MessageListModule.command.SetListCommand(messages), InitListEvent(messages)]
+      }
+    })
 
-      const InitListCommand = domain.command({
+    domain.effect({
-        name: 'MessageList.InitListCommand',
+      name: 'FormStorageToStateEffect',
-        impl: (_, messages: T[]) => {
+      impl: () => {
-          return [MessageListModule.command.SetListCommand(messages), InitListEvent(messages)]
+        return from(storage.get<Message[]>(storageKey)).pipe(map((messages) => InitListCommand(messages ?? [])))
-        }
+      }
-      })
+    })
 
-      domain.effect({
+    domain.effect({
-        name: 'FormStorageToStateEffect',
+      name: 'FormStateToStorageEffect',
-        impl: () => {
+      impl: ({ fromEvent }) => {
-          return from(storage.get<T[]>(storageKey)).pipe(map((messages) => InitListCommand(messages ?? [])))
+        const createItem$ = fromEvent(ChangeListEvent).pipe(
-        }
+          tap(async (messages) => await storage.set<Message[]>(storageKey, messages))
-      })
+        )
+        return merge(createItem$).pipe(map(() => null))
+      }
+    })
 
-      domain.effect({
+    return {
-        name: 'FormStateToStorageEffect',
+      query: {
-        impl: ({ fromEvent }) => {
+        ItemQuery,
-          const createItem$ = fromEvent(ChangeListEvent).pipe(
+        ListQuery
-            tap(async (messages) => await storage.set<T[]>(storageKey, messages))
+      },
-          )
+      command: {
-          return merge(createItem$).pipe(map(() => null))
+        CreateItemCommand,
-        }
+        UpdateItemCommand,
-      })
+        DeleteItemCommand,
-
+        ClearListCommand
-      return {
+      },
-        query: {
+      event: {
-          ItemQuery,
+        CreateItemEvent,
-          ListQuery
+        UpdateItemEvent,
-        },
+        DeleteItemEvent,
-        command: {
+        ClearListEvent
-          CreateItemCommand,
-          UpdateItemCommand,
-          DeleteItemCommand,
-          ClearListCommand
-        },
-        event: {
-          CreateItemEvent,
-          UpdateItemEvent,
-          DeleteItemEvent,
-          ClearListEvent
-        }
       }
     }
-  })()
+  }
+})
 
-export default mem(MessageListDomain)
+export default MessageListDomain

src/views/Footer/index.tsx

@@ -6,11 +6,10 @@ import MessageInput from '@/components/MessageInput'
 import MessageInputDomain from '@/domain/MessageInput'
 import MessageListDomain from '@/domain/MessageList'
 import { MESSAGE_MAX_LENGTH } from '@/constants'
-import { type Message } from '@/types'
 
 const Footer: FC = () => {
   const send = useRemeshSend()
-  const messageListDomain = useRemeshDomain(MessageListDomain<Message>())
+  const messageListDomain = useRemeshDomain(MessageListDomain())
   const messageInputDomain = useRemeshDomain(MessageInputDomain())
   const text = useRemeshQuery(messageInputDomain.query.MessageQuery())
   const isPreview = useRemeshQuery(messageInputDomain.query.PreviewQuery())

src/views/Main/index.tsx

@@ -3,10 +3,9 @@ import { useRemeshDomain, useRemeshQuery } from 'remesh-react'
 import MessageList from '@/components/MessageList'
 import MessageItem from '@/components/MessageItem'
 import MessageListDomain from '@/domain/MessageList'
-import { type Message } from '@/types'
 
 const Main: FC = () => {
-  const messageListDomain = useRemeshDomain(MessageListDomain<Message>())
+  const messageListDomain = useRemeshDomain(MessageListDomain())
   const messageList = useRemeshQuery(messageListDomain.query.ListQuery())
 
   return (