update handSlice

src/api/cards.ts

 import axios from "axios";
 
-interface CardMeta {
+export interface CardMeta {
   id: number;
   data: {
     ot?: number;

src/reducers/duel/handsSlice.ts

-import {
-  PayloadAction,
-  CaseReducer,
-  createAsyncThunk,
-  ActionReducerMapBuilder,
-} from "@reduxjs/toolkit";
+import { createAsyncThunk, ActionReducerMapBuilder } from "@reduxjs/toolkit";
 import { DuelState } from "./mod";
 import { RootState } from "../../store";
-import { Card, fetchCard } from "../../api/cards";
+import { Card, fetchCard, CardMeta } from "../../api/cards";
 import { judgeSelf } from "./util";
 import * as UICONFIG from "../../config/ui";
 
@@ -15,16 +10,33 @@ export interface Hands {
 }
 
 // 增加手牌
-export const addHandsImpl: CaseReducer<
-  DuelState,
-  PayloadAction<[number, number[]]>
-> = (state, action) => {
+export const fetchHandsMeta = createAsyncThunk(
+  "duel/fetchHandsMeta",
+  async (param: [number, number[]]) => {
+    const player = param[0];
+    const Ids = param[1];
+
+    const metas = await Promise.all(
+      Ids.filter((id) => {
+        return id !== 0;
+      }).map(async (id) => {
+        return await fetchCard(id);
+      })
+    );
+    const response: [number, CardMeta[]] = [player, metas];
+
+    return response;
+  }
+);
+
+export const handsCase = (builder: ActionReducerMapBuilder<DuelState>) => {
+  builder.addCase(fetchHandsMeta.fulfilled, (state, action) => {
     const player = action.payload[0];
     const hands = action.payload[1];
     const selfType = state.selfType;
 
-  const cards = hands.map((id) => {
-    return { meta: { id, data: {}, text: {} }, transform: {} };
+    const cards = hands.map((meta) => {
+      return { meta, transform: {} };
     });
     if (judgeSelf(player, selfType)) {
       if (state.meHands) {
@@ -40,41 +52,6 @@ export const addHandsImpl: CaseReducer<
         state.opHands = { cards };
       }
     }
-};
-
-export const fetchMeHandsMeta = createAsyncThunk(
-  "duel/fetchMeHandsMeta",
-  async (Ids: number[]) => {
-    return await Promise.all(
-      Ids.map(async (id) => {
-        return await fetchCard(id);
-      })
-    );
-  }
-);
-
-export const meHandsCase = (builder: ActionReducerMapBuilder<DuelState>) => {
-  builder.addCase(fetchMeHandsMeta.fulfilled, (state, action) => {
-    // TODO: 合法性校验
-    const cardMetas = action.payload;
-
-    if (state.meHands) {
-      for (let meta of cardMetas) {
-        for (let hand of state.meHands.cards) {
-          if (hand.meta.id === meta.id) {
-            hand.meta = meta;
-          }
-        }
-      }
-    } else {
-      state.meHands = {
-        cards: cardMetas.map((meta) => {
-          return { meta, transform: {} };
-        }),
-      };
-
-      setHandsTransform(state.meHands.cards);
-    }
   });
 };
 

src/reducers/duel/mod.ts

@@ -5,7 +5,7 @@
 
 import { createSlice, PayloadAction } from "@reduxjs/toolkit";
 import { InitInfo, infoInitImpl } from "./initInfoSlice";
-import { Hands, addHandsImpl, meHandsCase } from "./handsSlice";
+import { Hands, handsCase } from "./handsSlice";
 import { newTurnImpl } from "./turnSlice";
 import { newPhaseImpl } from "./phaseSlice";
 import { RootState } from "../../store";
@@ -30,16 +30,15 @@ const duelSlice = createSlice({
       state.selfType = action.payload;
     },
     infoInit: infoInitImpl,
-    addHands: addHandsImpl,
     updateTurn: newTurnImpl,
     updatePhase: newPhaseImpl,
   },
   extraReducers(builder) {
-    meHandsCase(builder);
+    handsCase(builder);
   },
 });
 
-export const { setSelfType, infoInit, addHands, updateTurn, updatePhase } =
+export const { setSelfType, infoInit, updateTurn, updatePhase } =
   duelSlice.actions;
 export const selectDuelHsStart = (state: RootState) => {
   return state.duel.meInitInfo != null;

src/service/duel/draw.ts

 import { ygopro } from "../../api/ocgcore/idl/ocgcore";
 import { AppDispatch } from "../../store";
-import { addHands } from "../../reducers/duel/mod";
-import { fetchMeHandsMeta } from "../../reducers/duel/handsSlice";
+import { fetchHandsMeta } from "../../reducers/duel/handsSlice";
 
 export default (
   draw: ygopro.StocGameMessage.MsgDraw,
   dispatch: AppDispatch
 ) => {
-  // FIXME: draw.player 和先后攻有关系
-  if (draw.player === 0) {
-    dispatch(addHands([0, draw.cards]));
-    dispatch(fetchMeHandsMeta(draw.cards));
-  } else if (draw.player === 1) {
-    dispatch(addHands([1, draw.cards]));
-  } else {
-    console.log("Currently only support 2v2 mode.");
-  }
+  dispatch(fetchHandsMeta([draw.player, draw.cards]));
 };