register handsSelector in simpleDuelPlate

src/reducers/duel/handsSlice.ts

 import { PayloadAction, CaseReducer } from "@reduxjs/toolkit";
 import { DuelState } from "./mod";
+import { RootState } from "../../store";
 
 export interface Hands {
   cards: number[]; // TODO: use Card struct Unitly
@@ -28,3 +29,8 @@ export const opAddHandsImpl: CaseReducer<DuelState, PayloadAction<number[]>> = (
     state.opHands = { cards: action.payload };
   }
 };
+
+export const selectMeHands = (state: RootState) =>
+  state.duel.meHands || { cards: [] };
+export const selectOpHands = (state: RootState) =>
+  state.duel.opHands || { cards: [] };

src/ui/Duel/main.tsx

@@ -3,8 +3,23 @@
  *
  * */
 
+import { RootState } from "../../store";
 import SimpleDuelPlateImpl from "./simpleDuel/mod";
+import { selectMeHands } from "../../reducers/duel/handsSlice";
 
 export default function Duel() {
-  return new SimpleDuelPlateImpl().render();
+  const simpleDuelPlate = new SimpleDuelPlateImpl();
+
+  // TODO: opHands
+  const handsSelector = (state: RootState) => {
+    const cards = selectMeHands(state).cards;
+
+    return cards.map((item) => {
+      return { code: item };
+    });
+  };
+
+  simpleDuelPlate.registerHands(handsSelector);
+
+  return simpleDuelPlate.render();
 }