split modalSlice.ts

src/reducers/duel/mod.ts

@@ -40,7 +40,7 @@ import {
   setOptionModalIsOpenImpl,
   resetOptionModalImpl,
   optionModalCase,
-} from "./modalSlice";
+} from "./modal/mod";
 import {
   MonsterState,
   initMonstersImpl,

src/reducers/duel/modal/cardListModalSlice.ts

+import { PayloadAction, CaseReducer } from "@reduxjs/toolkit";
+import { DuelState } from "../mod";
+import { RootState } from "../../../store";
+
+// 更新卡牌列表弹窗打开状态
+export const setCardListModalIsOpenImpl: CaseReducer<
+  DuelState,
+  PayloadAction<boolean>
+> = (state, action) => {
+  state.modalState.cardListModal.isOpen = action.payload;
+};
+
+// 更新卡牌列表数据
+export const setCardListModalInfoImpl: CaseReducer<
+  DuelState,
+  PayloadAction<{ name?: string; desc?: string; imgUrl?: string }[]>
+> = (state, action) => {
+  const list = action.payload;
+
+  state.modalState.cardListModal.list = list;
+};
+
+export const selectCardListModalIsOpen = (state: RootState) =>
+  state.duel.modalState.cardListModal.isOpen;
+export const selectCardListModalInfo = (state: RootState) =>
+  state.duel.modalState.cardListModal.list;

src/reducers/duel/modal/cardModalSlice.ts

+import { PayloadAction, CaseReducer } from "@reduxjs/toolkit";
+import { DuelState } from "../mod";
+import { RootState } from "../../../store";
+
+// 更新卡牌弹窗打开状态
+export const setCardModalIsOpenImpl: CaseReducer<
+  DuelState,
+  PayloadAction<boolean>
+> = (state, action) => {
+  state.modalState.cardModal.isOpen = action.payload;
+};
+
+// 更新卡牌弹窗文本
+export const setCardModalTextImpl: CaseReducer<
+  DuelState,
+  PayloadAction<[string?, string?]>
+> = (state, action) => {
+  const name = action.payload[0];
+  const desc = action.payload[1];
+
+  state.modalState.cardModal.name = name;
+  state.modalState.cardModal.desc = desc;
+};
+
+// 更新卡牌弹窗图片Url
+export const setCardModalImgUrlImpl: CaseReducer<
+  DuelState,
+  PayloadAction<string>
+> = (state, action) => {
+  state.modalState.cardModal.imgUrl = action.payload;
+};
+
+// 更新卡牌弹窗互动选项
+export const setCardModalInteractiviesImpl: CaseReducer<
+  DuelState,
+  PayloadAction<{ desc: string; response: number }[]>
+> = (state, action) => {
+  state.modalState.cardModal.interactivies = action.payload;
+};
+
+export const selectCardModalIsOpen = (state: RootState) =>
+  state.duel.modalState.cardModal.isOpen;
+export const selectCardModalName = (state: RootState) =>
+  state.duel.modalState.cardModal.name;
+export const selectCardModalDesc = (state: RootState) =>
+  state.duel.modalState.cardModal.desc;
+export const selectCardModalImgUrl = (state: RootState) =>
+  state.duel.modalState.cardModal.imgUrl;
+export const selectCardModalInteractivies = (state: RootState) =>
+  state.duel.modalState.cardModal.interactivies;

src/reducers/duel/modalSlice.ts → src/reducers/duel/modal/checkCardModalSlice.ts

@@ -4,120 +4,10 @@ import {
   createAsyncThunk,
   ActionReducerMapBuilder,
 } from "@reduxjs/toolkit";
-import { CardMeta, fetchCard, getCardStr } from "../../api/cards";
-import { ygopro } from "../../api/ocgcore/idl/ocgcore";
-import { fetchStrings } from "../../api/strings";
-import { RootState } from "../../store";
-import { DuelState } from "./mod";
-import { judgeSelf } from "./util";
-
-export interface ModalState {
-  // 卡牌弹窗
-  cardModal: {
-    isOpen: boolean;
-    name?: string;
-    desc?: string;
-    imgUrl?: string;
-    interactivies: { desc: string; response: number }[];
-  };
-  // 卡牌列表弹窗
-  cardListModal: {
-    isOpen: boolean;
-    list: {
-      name?: string;
-      desc?: string;
-      imgUrl?: string;
-    }[];
-  };
-  // 卡牌选择弹窗
-  checkCardModal: {
-    isOpen: boolean;
-    onSubmit?: string;
-    selectMin?: number;
-    selectMax?: number;
-    cancelAble: boolean;
-    cancelResponse?: number;
-    tags: {
-      tagName: string;
-      options: {
-        code: number;
-        name?: string;
-        desc?: string;
-        effectDesc?: string;
-        response: number;
-      }[];
-    }[];
-  };
-  // Yes or No弹窗
-  yesNoModal: {
-    isOpen: boolean;
-    msg?: string;
-  };
-  // 表示形式选择弹窗
-  positionModal: {
-    isOpen: boolean;
-    positions: ygopro.CardPosition[];
-  };
-  // 选项选择弹窗
-  optionModal: {
-    isOpen: boolean;
-    options: { msg: string; response: number }[];
-  };
-}
-
-// 更新卡牌弹窗打开状态
-export const setCardModalIsOpenImpl: CaseReducer<
-  DuelState,
-  PayloadAction<boolean>
-> = (state, action) => {
-  state.modalState.cardModal.isOpen = action.payload;
-};
-
-// 更新卡牌弹窗文本
-export const setCardModalTextImpl: CaseReducer<
-  DuelState,
-  PayloadAction<[string?, string?]>
-> = (state, action) => {
-  const name = action.payload[0];
-  const desc = action.payload[1];
-
-  state.modalState.cardModal.name = name;
-  state.modalState.cardModal.desc = desc;
-};
-
-// 更新卡牌弹窗图片Url
-export const setCardModalImgUrlImpl: CaseReducer<
-  DuelState,
-  PayloadAction<string>
-> = (state, action) => {
-  state.modalState.cardModal.imgUrl = action.payload;
-};
-
-// 更新卡牌弹窗互动选项
-export const setCardModalInteractiviesImpl: CaseReducer<
-  DuelState,
-  PayloadAction<{ desc: string; response: number }[]>
-> = (state, action) => {
-  state.modalState.cardModal.interactivies = action.payload;
-};
-
-// 更新卡牌列表弹窗打开状态
-export const setCardListModalIsOpenImpl: CaseReducer<
-  DuelState,
-  PayloadAction<boolean>
-> = (state, action) => {
-  state.modalState.cardListModal.isOpen = action.payload;
-};
-
-// 更新卡牌列表数据
-export const setCardListModalInfoImpl: CaseReducer<
-  DuelState,
-  PayloadAction<{ name?: string; desc?: string; imgUrl?: string }[]>
-> = (state, action) => {
-  const list = action.payload;
-
-  state.modalState.cardListModal.list = list;
-};
+import { RootState } from "../../../store";
+import { DuelState } from "../mod";
+import { judgeSelf } from "../util";
+import { fetchCard, getCardStr } from "../../../api/cards";
 
 // 更新卡牌选择弹窗打开状态
 export const setCheckCardModalIsOpenImpl: CaseReducer<
@@ -244,106 +134,6 @@ export const resetCheckCardModalImpl: CaseReducer<DuelState> = (state) => {
   state.modalState.checkCardModal.tags = [];
 };
 
-// 更新YesNo弹窗是否打开状态
-export const setYesNoModalIsOpenImpl: CaseReducer<
-  DuelState,
-  PayloadAction<boolean>
-> = (state, action) => {
-  state.modalState.yesNoModal.isOpen = action.payload;
-};
-
-// 设置YesNo弹窗展示内容
-export const fetchYesNoMeta = createAsyncThunk(
-  "duel/fetchYesNoMeta",
-  async (param: {
-    code: number;
-    location: ygopro.CardLocation;
-    descCode: number;
-    textGenerator: (
-      desc: string,
-      cardMeta: CardMeta,
-      cardLocation: ygopro.CardLocation
-    ) => string;
-  }) => {
-    const desc = await fetchStrings("!system", param.descCode);
-    const meta = await fetchCard(param.code);
-
-    // TODO: 国际化文案
-    return param.textGenerator(desc, meta, param.location);
-  }
-);
-
-export const YesNoModalCase = (builder: ActionReducerMapBuilder<DuelState>) => {
-  builder.addCase(fetchYesNoMeta.fulfilled, (state, action) => {
-    state.modalState.yesNoModal.msg = action.payload;
-  });
-};
-
-export const setPositionModalIsOpenImpl: CaseReducer<
-  DuelState,
-  PayloadAction<boolean>
-> = (state, action) => {
-  state.modalState.positionModal.isOpen = action.payload;
-};
-
-export const setPositionModalPositionsImpl: CaseReducer<
-  DuelState,
-  PayloadAction<ygopro.CardPosition[]>
-> = (state, action) => {
-  state.modalState.positionModal.positions = action.payload;
-};
-
-export const setOptionModalIsOpenImpl: CaseReducer<
-  DuelState,
-  PayloadAction<boolean>
-> = (state, action) => {
-  state.modalState.optionModal.isOpen = action.payload;
-};
-
-export const resetOptionModalImpl: CaseReducer<DuelState> = (state) => {
-  state.modalState.optionModal.options = [];
-};
-
-export const resetPositionModalImpl: CaseReducer<DuelState> = (state) => {
-  state.modalState.positionModal.isOpen = false;
-  state.modalState.positionModal.positions = [];
-};
-
-// 增加选项
-export const fetchOptionMeta = createAsyncThunk(
-  "duel/fetchOptionMeta",
-  async (param: { code: number; response: number }) => {
-    const meta = await fetchCard(param.code >> 4);
-    const msg = getCardStr(meta, param.code & 0xf) || "[?]";
-
-    const response = { msg, response: param.response };
-
-    return response;
-  }
-);
-
-export const optionModalCase = (
-  builder: ActionReducerMapBuilder<DuelState>
-) => {
-  builder.addCase(fetchOptionMeta.fulfilled, (state, action) => {
-    state.modalState.optionModal.options.push(action.payload);
-  });
-};
-
-export const selectCardModalIsOpen = (state: RootState) =>
-  state.duel.modalState.cardModal.isOpen;
-export const selectCardModalName = (state: RootState) =>
-  state.duel.modalState.cardModal.name;
-export const selectCardModalDesc = (state: RootState) =>
-  state.duel.modalState.cardModal.desc;
-export const selectCardModalImgUrl = (state: RootState) =>
-  state.duel.modalState.cardModal.imgUrl;
-export const selectCardModalInteractivies = (state: RootState) =>
-  state.duel.modalState.cardModal.interactivies;
-export const selectCardListModalIsOpen = (state: RootState) =>
-  state.duel.modalState.cardListModal.isOpen;
-export const selectCardListModalInfo = (state: RootState) =>
-  state.duel.modalState.cardListModal.list;
 export const selectCheckCardModalIsOpen = (state: RootState) =>
   state.duel.modalState.checkCardModal.isOpen;
 export const selectCheckCardModalMinMax = (state: RootState) => {
@@ -360,15 +150,3 @@ export const selectCheckCardModalCancelAble = (state: RootState) =>
   state.duel.modalState.checkCardModal.cancelAble;
 export const selectCheckCardModalCacnelResponse = (state: RootState) =>
   state.duel.modalState.checkCardModal.cancelResponse;
-export const selectYesNoModalIsOpen = (state: RootState) =>
-  state.duel.modalState.yesNoModal.isOpen;
-export const selectYesNOModalMsg = (state: RootState) =>
-  state.duel.modalState.yesNoModal.msg;
-export const selectPositionModalIsOpen = (state: RootState) =>
-  state.duel.modalState.positionModal.isOpen;
-export const selectPositionModalPositions = (state: RootState) =>
-  state.duel.modalState.positionModal.positions;
-export const selectOptionModalIsOpen = (state: RootState) =>
-  state.duel.modalState.optionModal.isOpen;
-export const selectOptionModalOptions = (state: RootState) =>
-  state.duel.modalState.optionModal.options;

src/reducers/duel/modal/mod.ts

+import { ygopro } from "../../../api/ocgcore/idl/ocgcore";
+
+export interface ModalState {
+  // 卡牌弹窗
+  cardModal: {
+    isOpen: boolean;
+    name?: string;
+    desc?: string;
+    imgUrl?: string;
+    interactivies: { desc: string; response: number }[];
+  };
+  // 卡牌列表弹窗
+  cardListModal: {
+    isOpen: boolean;
+    list: {
+      name?: string;
+      desc?: string;
+      imgUrl?: string;
+    }[];
+  };
+  // 卡牌选择弹窗
+  checkCardModal: {
+    isOpen: boolean;
+    onSubmit?: string;
+    selectMin?: number;
+    selectMax?: number;
+    cancelAble: boolean;
+    cancelResponse?: number;
+    tags: {
+      tagName: string;
+      options: {
+        code: number;
+        name?: string;
+        desc?: string;
+        effectDesc?: string;
+        response: number;
+      }[];
+    }[];
+  };
+  // Yes or No弹窗
+  yesNoModal: {
+    isOpen: boolean;
+    msg?: string;
+  };
+  // 表示形式选择弹窗
+  positionModal: {
+    isOpen: boolean;
+    positions: ygopro.CardPosition[];
+  };
+  // 选项选择弹窗
+  optionModal: {
+    isOpen: boolean;
+    options: { msg: string; response: number }[];
+  };
+}
+
+export * from "./cardModalSlice";
+export * from "./cardListModalSlice";
+export * from "./checkCardModalSlice";
+export * from "./yesNoModalSlice";
+export * from "./positionModalSlice";
+export * from "./optionModalSlice";

src/reducers/duel/modal/optionModalSlice.ts

+import {
+  PayloadAction,
+  CaseReducer,
+  createAsyncThunk,
+  ActionReducerMapBuilder,
+} from "@reduxjs/toolkit";
+import { DuelState } from "../mod";
+import { fetchCard, getCardStr } from "../../../api/cards";
+import { RootState } from "../../../store";
+
+export const setOptionModalIsOpenImpl: CaseReducer<
+  DuelState,
+  PayloadAction<boolean>
+> = (state, action) => {
+  state.modalState.optionModal.isOpen = action.payload;
+};
+
+export const resetOptionModalImpl: CaseReducer<DuelState> = (state) => {
+  state.modalState.optionModal.options = [];
+};
+
+// 增加选项
+export const fetchOptionMeta = createAsyncThunk(
+  "duel/fetchOptionMeta",
+  async (param: { code: number; response: number }) => {
+    const meta = await fetchCard(param.code >> 4);
+    const msg = getCardStr(meta, param.code & 0xf) || "[?]";
+
+    const response = { msg, response: param.response };
+
+    return response;
+  }
+);
+
+export const optionModalCase = (
+  builder: ActionReducerMapBuilder<DuelState>
+) => {
+  builder.addCase(fetchOptionMeta.fulfilled, (state, action) => {
+    state.modalState.optionModal.options.push(action.payload);
+  });
+};
+
+export const selectOptionModalIsOpen = (state: RootState) =>
+  state.duel.modalState.optionModal.isOpen;
+export const selectOptionModalOptions = (state: RootState) =>
+  state.duel.modalState.optionModal.options;

src/reducers/duel/modal/positionModalSlice.ts

+import { PayloadAction, CaseReducer } from "@reduxjs/toolkit";
+import { RootState } from "../../../store";
+import { DuelState } from "../mod";
+import { ygopro } from "../../../api/ocgcore/idl/ocgcore";
+
+export const setPositionModalIsOpenImpl: CaseReducer<
+  DuelState,
+  PayloadAction<boolean>
+> = (state, action) => {
+  state.modalState.positionModal.isOpen = action.payload;
+};
+
+export const setPositionModalPositionsImpl: CaseReducer<
+  DuelState,
+  PayloadAction<ygopro.CardPosition[]>
+> = (state, action) => {
+  state.modalState.positionModal.positions = action.payload;
+};
+
+export const resetPositionModalImpl: CaseReducer<DuelState> = (state) => {
+  state.modalState.positionModal.isOpen = false;
+  state.modalState.positionModal.positions = [];
+};
+
+export const selectPositionModalIsOpen = (state: RootState) =>
+  state.duel.modalState.positionModal.isOpen;
+export const selectPositionModalPositions = (state: RootState) =>
+  state.duel.modalState.positionModal.positions;

src/reducers/duel/modal/yesNoModalSlice.ts

+import {
+  PayloadAction,
+  CaseReducer,
+  createAsyncThunk,
+  ActionReducerMapBuilder,
+} from "@reduxjs/toolkit";
+import { CardMeta, fetchCard } from "../../../api/cards";
+import { ygopro } from "../../../api/ocgcore/idl/ocgcore";
+import { fetchStrings } from "../../../api/strings";
+import { RootState } from "../../../store";
+import { DuelState } from "../mod";
+
+// 更新YesNo弹窗是否打开状态
+export const setYesNoModalIsOpenImpl: CaseReducer<
+  DuelState,
+  PayloadAction<boolean>
+> = (state, action) => {
+  state.modalState.yesNoModal.isOpen = action.payload;
+};
+
+// 设置YesNo弹窗展示内容
+export const fetchYesNoMeta = createAsyncThunk(
+  "duel/fetchYesNoMeta",
+  async (param: {
+    code: number;
+    location: ygopro.CardLocation;
+    descCode: number;
+    textGenerator: (
+      desc: string,
+      cardMeta: CardMeta,
+      cardLocation: ygopro.CardLocation
+    ) => string;
+  }) => {
+    const desc = await fetchStrings("!system", param.descCode);
+    const meta = await fetchCard(param.code);
+
+    // TODO: 国际化文案
+    return param.textGenerator(desc, meta, param.location);
+  }
+);
+
+export const YesNoModalCase = (builder: ActionReducerMapBuilder<DuelState>) => {
+  builder.addCase(fetchYesNoMeta.fulfilled, (state, action) => {
+    state.modalState.yesNoModal.msg = action.payload;
+  });
+};
+
+export const selectYesNoModalIsOpen = (state: RootState) =>
+  state.duel.modalState.yesNoModal.isOpen;
+export const selectYesNOModalMsg = (state: RootState) =>
+  state.duel.modalState.yesNoModal.msg;

src/service/duel/selectCard.ts

@@ -5,7 +5,7 @@ import {
   setCheckCardModalMinMax,
   setCheckCardModalOnSubmit,
 } from "../../reducers/duel/mod";
-import { fetchCheckCardMeta } from "../../reducers/duel/modalSlice";
+import { fetchCheckCardMeta } from "../../reducers/duel/modal/mod";
 import MsgSelectCard = ygopro.StocGameMessage.MsgSelectCard;
 import { CardZoneToChinese } from "./util";
 

src/service/duel/selectChain.ts

@@ -7,7 +7,7 @@ import {
   setCheckCardModalMinMax,
   setCheckCardModalOnSubmit,
 } from "../../reducers/duel/mod";
-import { fetchCheckCardMeta } from "../../reducers/duel/modalSlice";
+import { fetchCheckCardMeta } from "../../reducers/duel/modal/mod";
 import { AppDispatch } from "../../store";
 import { CardZoneToChinese } from "./util";
 import MsgSelectChain = ygopro.StocGameMessage.MsgSelectChain;

src/service/duel/selectEffectYn.ts

 import { CardMeta } from "../../api/cards";
 import { ygopro } from "../../api/ocgcore/idl/ocgcore";
 import { setYesNoModalIsOpen } from "../../reducers/duel/mod";
-import { fetchYesNoMeta } from "../../reducers/duel/modalSlice";
+import { fetchYesNoMeta } from "../../reducers/duel/modal/mod";
 import { AppDispatch } from "../../store";
 import { CardZoneToChinese } from "./util";
 import MsgSelectEffectYn = ygopro.StocGameMessage.MsgSelectEffectYn;

src/service/duel/selectOption.ts

 import { ygopro } from "../../api/ocgcore/idl/ocgcore";
 import { setOptionModalIsOpen } from "../../reducers/duel/mod";
-import { fetchOptionMeta } from "../../reducers/duel/modalSlice";
+import { fetchOptionMeta } from "../../reducers/duel/modal/mod";
 import { AppDispatch } from "../../store";
 import MsgSelectOption = ygopro.StocGameMessage.MsgSelectOption;
 

src/ui/Duel/cardListModal.tsx

@@ -4,7 +4,7 @@ import { store } from "../../store";
 import {
   selectCardListModalIsOpen,
   selectCardListModalInfo,
-} from "../../reducers/duel/modalSlice";
+} from "../../reducers/duel/modal/mod";
 import { setCardListModalIsOpen } from "../../reducers/duel/mod";
 import { Modal, List, Popover, Card } from "antd";
 

src/ui/Duel/cardModal.tsx

@@ -7,7 +7,7 @@ import {
   selectCardModalDesc,
   selectCardModalImgUrl,
   selectCardModalInteractivies,
-} from "../../reducers/duel/modalSlice";
+} from "../../reducers/duel/modal/mod";
 import {
   setCardModalIsOpen,
   clearHandsIdleInteractivity,

src/ui/Duel/checkCardModal.tsx

@@ -8,7 +8,7 @@ import {
   selectCheckCardModalMinMax,
   selectCheckCardModalOnSubmit,
   selectCheckCardModalTags,
-} from "../../reducers/duel/modalSlice";
+} from "../../reducers/duel/modal/mod";
 import {
   resetCheckCardModal,
   setCheckCardModalIsOpen,

src/ui/Duel/optionModal.tsx

@@ -6,7 +6,7 @@ import { CheckCard } from "@ant-design/pro-components";
 import {
   selectOptionModalIsOpen,
   selectOptionModalOptions,
-} from "../../reducers/duel/modalSlice";
+} from "../../reducers/duel/modal/mod";
 import { sendSelectOptionResponse } from "../../api/ocgcore/ocgHelper";
 import {
   resetOptionModal,

src/ui/Duel/positionModal.tsx

@@ -6,7 +6,7 @@ import { sendSelectPositionResponse } from "../../api/ocgcore/ocgHelper";
 import {
   selectPositionModalIsOpen,
   selectPositionModalPositions,
-} from "../../reducers/duel/modalSlice";
+} from "../../reducers/duel/modal/mod";
 import { ygopro } from "../../api/ocgcore/idl/ocgcore";
 import {
   resetPositionModal,

src/ui/Duel/yesNoModal.tsx

@@ -6,7 +6,7 @@ import { sendSelectEffectYnResponse } from "../../api/ocgcore/ocgHelper";
 import {
   selectYesNoModalIsOpen,
   selectYesNOModalMsg,
-} from "../../reducers/duel/modalSlice";
+} from "../../reducers/duel/modal/mod";
 import { setYesNoModalIsOpen } from "../../reducers/duel/mod";
 
 const YesNoModal = () => {