refactor store

src/service/onSocketMessage.ts

@@ -56,7 +56,7 @@ async function _handle(
 
     switch (pb.msg) {
       case "stoc_join_game": {
-        handleJoinGame(pb);
+        handleJoinGame(container, pb);
         break;
       }
       case "stoc_chat": {
@@ -64,19 +64,19 @@ async function _handle(
         break;
       }
       case "stoc_hs_player_change": {
-        handleHsPlayerChange(pb);
+        handleHsPlayerChange(container, pb);
         break;
       }
       case "stoc_hs_watch_change": {
-        handleHsWatchChange(pb);
+        handleHsWatchChange(container, pb);
         break;
       }
       case "stoc_hs_player_enter": {
-        handleHsPlayerEnter(pb);
+        handleHsPlayerEnter(container, pb);
         break;
       }
       case "stoc_type_change": {
-        handleTypeChange(pb);
+        handleTypeChange(container, pb);
         break;
       }
       case "stoc_select_hand": {
@@ -84,7 +84,7 @@ async function _handle(
         break;
       }
       case "stoc_hand_result": {
-        handleHandResult(pb);
+        handleHandResult(container, pb);
         break;
       }
       case "stoc_select_tp": {

src/service/room/handResult.ts

 import { ygopro } from "@/api";
-import { roomStore } from "@/stores";
+import { Container } from "@/container";
 
-export default function handResult(pb: ygopro.YgoStocMsg) {
+export default function handResult(
+  container: Container,
+  pb: ygopro.YgoStocMsg,
+) {
   const msg = pb.stoc_hand_result;
-  const me = roomStore.getMePlayer();
-  const op = roomStore.getOpPlayer();
+  const context = container.context;
+  const me = context.roomStore.getMePlayer();
+  const op = context.roomStore.getOpPlayer();
 
   if (me && op) {
     me.moraResult = msg.meResult;
     op.moraResult = msg.opResult;
-  } else if (roomStore.selfType !== ygopro.StocTypeChange.SelfType.OBSERVER) {
+  } else if (
+    context.roomStore.selfType !== ygopro.StocTypeChange.SelfType.OBSERVER
+  ) {
     console.error("<HandResult>me or op is undefined");
   }
 }

src/service/room/hsPlayerChange.ts

 import { ygopro } from "@/api";
-import { roomStore } from "@/stores";
+import { Container } from "@/container";
 
-export default function handleHsPlayerChange(pb: ygopro.YgoStocMsg) {
+export default function handleHsPlayerChange(
+  container: Container,
+  pb: ygopro.YgoStocMsg,
+) {
   const change = pb.stoc_hs_player_change;
+  const context = container.context;
 
   if (change.pos > 1) {
     console.log("Currently only supported 2v2 mode.");
@@ -21,25 +25,26 @@ export default function handleHsPlayerChange(pb: ygopro.YgoStocMsg) {
             " moved to " +
             change.moved_pos,
         );
-        roomStore.players[change.moved_pos] = roomStore.players[change.pos];
-        roomStore.players[change.pos] = undefined;
+        context.roomStore.players[change.moved_pos] =
+          context.roomStore.players[change.pos];
+        context.roomStore.players[change.pos] = undefined;
         break;
       }
       case ygopro.StocHsPlayerChange.State.READY:
       case ygopro.StocHsPlayerChange.State.NO_READY: {
-        const player = roomStore.players[change.pos];
+        const player = context.roomStore.players[change.pos];
         if (player) {
           player.state = change.state;
         }
         break;
       }
       case ygopro.StocHsPlayerChange.State.LEAVE: {
-        roomStore.players[change.pos] = undefined;
+        context.roomStore.players[change.pos] = undefined;
         break;
       }
       case ygopro.StocHsPlayerChange.State.TO_OBSERVER: {
-        roomStore.players[change.pos] = undefined;
-        roomStore.observerCount += 1;
+        context.roomStore.players[change.pos] = undefined;
+        context.roomStore.observerCount += 1;
         break;
       }
       default: {

src/service/room/hsPlayerEnter.ts

 import { ygopro } from "@/api";
+import { Container } from "@/container";
 import { AudioActionType, playEffect } from "@/infra/audio";
-import { roomStore } from "@/stores";
 
-export default function handleHsPlayerEnter(pb: ygopro.YgoStocMsg) {
+export default function handleHsPlayerEnter(
+  container: Container,
+  pb: ygopro.YgoStocMsg,
+) {
   playEffect(AudioActionType.SOUND_PLAYER_ENTER);
   const name = pb.stoc_hs_player_enter.name;
   const pos = pb.stoc_hs_player_enter.pos;
+  const context = container.context;
 
-  const player = roomStore.players[pos];
+  const player = context.roomStore.players[pos];
 
   if (player) {
     player.name = name;
   } else {
-    roomStore.players[pos] = {
+    context.roomStore.players[pos] = {
       name,
       state: ygopro.StocHsPlayerChange.State.NO_READY,
     };

src/service/room/hsWatchChange.ts

 import { ygopro } from "@/api";
-import { roomStore } from "@/stores";
+import { Container } from "@/container";
 
-export default function handleHsWatchChange(pb: ygopro.YgoStocMsg) {
+export default function handleHsWatchChange(
+  container: Container,
+  pb: ygopro.YgoStocMsg,
+) {
   const count = pb.stoc_hs_watch_change.count;
-  roomStore.observerCount = count;
+  container.context.roomStore.observerCount = count;
 }

src/service/room/joinGame.ts

 import { ygopro } from "@/api";
-import { roomStore } from "@/stores";
+import { Container } from "@/container";
 
-export default function handleJoinGame(pb: ygopro.YgoStocMsg) {
+export default function handleJoinGame(
+  container: Container,
+  pb: ygopro.YgoStocMsg,
+) {
   const _msg = pb.stoc_join_game;
-  // TODO
-  roomStore.joined = true;
+  container.context.roomStore.joined = true;
 }

src/service/room/typeChange.ts

 import { ygopro } from "@/api";
-import { roomStore } from "@/stores";
 import SelfType = ygopro.StocTypeChange.SelfType;
+import { Container } from "@/container";
 
-export default function handleTypeChange(pb: ygopro.YgoStocMsg) {
+export default function handleTypeChange(
+  container: Container,
+  pb: ygopro.YgoStocMsg,
+) {
   const selfType = pb.stoc_type_change.self_type;
   const assertHost = pb.stoc_type_change.is_host;
+  const context = container.context;
 
-  roomStore.isHost = assertHost;
-  roomStore.selfType = selfType;
+  context.roomStore.isHost = assertHost;
+  context.roomStore.selfType = selfType;
 
   switch (selfType) {
     case SelfType.UNKNOWN: {
@@ -15,7 +19,7 @@ export default function handleTypeChange(pb: ygopro.YgoStocMsg) {
       break;
     }
     case SelfType.OBSERVER: {
-      roomStore.players.forEach((player) => {
+      context.roomStore.players.forEach((player) => {
         if (player) {
           player.isMe = false;
         }
@@ -23,13 +27,17 @@ export default function handleTypeChange(pb: ygopro.YgoStocMsg) {
       break;
     }
     default: {
-      const player = roomStore.players[selfType - 1];
+      const player = context.roomStore.players[selfType - 1];
       const state = ygopro.StocHsPlayerChange.State.NO_READY;
       if (player) {
         player.state = state;
         player.isMe = true;
       } else {
-        roomStore.players[selfType - 1] = { name: "?", state, isMe: true };
+        context.roomStore.players[selfType - 1] = {
+          name: "?",
+          state,
+          isMe: true,
+        };
       }
       break;
     }

src/ui/Shared/chatHook.ts

@@ -6,6 +6,7 @@ import { useSnapshot } from "valtio";
 
 import { sendChat } from "@/api";
 import { getUIContainer } from "@/container/compat";
+// TODO: access store via `Container`
 import { chatStore, isMe, roomStore } from "@/stores";
 
 interface ChatItem {