feat: valtio logic in fixedslot/singleslot

src/ui/Duel/PlayMat/FixedSlot.tsx

@@ -24,6 +24,7 @@ import {
   clearAllIdleInteractivities,
   type CardState,
   clearAllPlaceInteradtivities,
+  messageStore,
 } from "@/valtioStores";
 
 const NeosConfig = useConfig();
@@ -57,7 +58,7 @@ export const FixedSlot = (props: {
       : props.rotation;
   const edgesWidth = 2.0;
   const edgesColor = BABYLON.Color4.FromColor3(BABYLON.Color3.Yellow());
-  const dispatch = store.dispatch;
+  // const dispatch = store.dispatch;
 
   const faceDown =
     snapState.location.position === ygopro.CardPosition.FACEDOWN_DEFENSE ||
@@ -77,36 +78,50 @@ export const FixedSlot = (props: {
         clearAllPlaceInteradtivities(1);
       } else if (snapState.occupant) {
         // 中央弹窗展示选中卡牌信息
-        dispatch(setCardModalMeta(snapState.occupant));
-        dispatch(
-          setCardModalInteractivies(
-            snapState.idleInteractivities.map((interactivity) => {
-              return {
+        // dispatch(setCardModalMeta(snapState.occupant));
+        messageStore.cardModal.meta = snapState.occupant;
+        // dispatch(
+        //   setCardModalInteractivies(
+        //     snapState.idleInteractivities.map((interactivity) => {
+        //       return {
+        //         desc: interactTypeToString(interactivity.interactType),
+        //         response: interactivity.response,
+        //       };
+        //     })
+        //   )
+        // );
+        messageStore.cardModal.interactivies =
+          snapState.idleInteractivities.map((interactivity) => ({
             desc: interactTypeToString(interactivity.interactType),
             response: interactivity.response,
-              };
-            })
-          )
-        );
-        dispatch(setCardModalCounters(snapState.counters));
-        dispatch(setCardModalIsOpen(true));
+          }));
+        // dispatch(setCardModalCounters(snapState.counters));
+        messageStore.cardModal.counters = snapState.counters;
+        // dispatch(setCardModalIsOpen(true));
+        messageStore.cardModal.isOpen = true;
 
         // 侧边栏展示超量素材信息
         if (
           snapState.overlay_materials &&
           snapState.overlay_materials.length > 0
         ) {
-          dispatch(
-            setCardListModalInfo(
-              snapState.overlay_materials?.map((overlay) => {
-                return {
+          // dispatch(
+          //   setCardListModalInfo(
+          //     snapState.overlay_materials?.map((overlay) => {
+          //       return {
+          //         meta: overlay,
+          //         interactivies: [],
+          //       };
+          //     }) || []
+          //   )
+          // );
+          messageStore.cardListModal.list =
+            snapState.overlay_materials?.map((overlay) => ({
               meta: overlay,
               interactivies: [],
-                };
-              }) || []
-            )
-          );
-          dispatch(setCardListModalIsOpen(true));
+            })) || [];
+          // dispatch(setCardListModalIsOpen(true));
+          messageStore.cardListModal.isOpen = true;
         }
       }
     },

src/ui/Duel/PlayMat/SingleSlot.tsx

@@ -13,6 +13,8 @@ import { store } from "@/store";
 import { interactTypeToString } from "../utils";
 import { useSnapshot } from "valtio";
 
+import { messageStore } from "@/valtioStores";
+
 const NeosConfig = useConfig();
 const transform = NeosConfig.ui.card.transform;
 export const Depth = 0.005;
@@ -24,7 +26,7 @@ export const SingleSlot = (props: {
 }) => {
   const snapState = useSnapshot(props.state);
   const boxRef = useRef(null);
-  const dispatch = store.dispatch;
+  // const dispatch = store.dispatch;
   const edgeRender =
     snapState.find((item) =>
       item === undefined ? false : item.idleInteractivities.length > 0
@@ -35,26 +37,38 @@ export const SingleSlot = (props: {
   useClick(
     (_event) => {
       if (snapState.length != 0) {
-        dispatch(
-          setCardListModalInfo(
-            snapState
+        // dispatch(
+        //   setCardListModalInfo(
+        //     snapState
+        //       .filter(
+        //         (item) => item.occupant !== undefined && item.occupant.id !== 0
+        //       )
+        //       .map((item) => {
+        //         return {
+        //           meta: item.occupant,
+        //           interactivies: item.idleInteractivities.map((interactivy) => {
+        //             return {
+        //               desc: interactTypeToString(interactivy.interactType),
+        //               response: interactivy.response,
+        //             };
+        //           }),
+        //         };
+        //       })
+        //   )
+        // );
+        messageStore.cardListModal.list = snapState
           .filter(
             (item) => item.occupant !== undefined && item.occupant.id !== 0
           )
-              .map((item) => {
-                return {
+          .map((item) => ({
             meta: item.occupant,
-                  interactivies: item.idleInteractivities.map((interactivy) => {
-                    return {
+            interactivies: item.idleInteractivities.map((interactivy) => ({
               desc: interactTypeToString(interactivy.interactType),
               response: interactivy.response,
-                    };
-                  }),
-                };
-              })
-          )
-        );
-        dispatch(setCardListModalIsOpen(true));
+            })),
+          }));
+        // dispatch(setCardListModalIsOpen(true));
+        messageStore.cardListModal.isOpen = true;
       }
     },
     boxRef,