optimize NewWaitRoom

src/ui/NewWaitRoom/index.tsx

@@ -3,7 +3,6 @@ import { CheckCircleFilled } from "@ant-design/icons";
 import {
   sendHsNotReady,
   sendHsReady,
-  sendHsStart,
   sendHsToDuelList,
   sendHsToObserver,
   sendUpdateDeck,
@@ -22,13 +21,7 @@ import {
   Tooltip,
 } from "antd";
 import classNames from "classnames";
-import {
-  forwardRef,
-  useEffect,
-  useImperativeHandle,
-  useRef,
-  useState,
-} from "react";
+import { forwardRef, useImperativeHandle, useRef, useState } from "react";
 import { useNavigate } from "react-router-dom";
 import { useSnapshot } from "valtio";
 
@@ -64,13 +57,9 @@ export const Component: React.FC = () => {
   const [deck, setDeck] = useState<IDeck>(JSON.parse(JSON.stringify(decks[0])));
   const room = useSnapshot(roomStore);
   const ref = useRef<MoraButtonRef>(null);
+  const navigate = useNavigate();
   // ref.current?.getMoraResult(); // 用这个来异步获取猜拳结果
 
-  useEffect(() => {
-    sendUpdateDeck(deck);
-    window.myExtraDeckCodes = [...deck.extra];
-  }, [deck]);
-
   const onClick = async () => {
     console.log(await ref.current?.getMoraResult());
   };
@@ -97,6 +86,12 @@ export const Component: React.FC = () => {
                 className={styles["btn"]}
                 danger
                 icon={<IconFont type="icon-exit" size={16} />}
+                onClick={() => {
+                  // 断开websocket🔗，
+                  socketMiddleWare({ cmd: socketCmd.DISCONNECT });
+                  // 返回上一个路由
+                  navigate("..");
+                }}
               />
             </Tooltip>
             <Button
@@ -129,9 +124,15 @@ export const Component: React.FC = () => {
                       size="large"
                       className={styles["btn-join"]}
                       onClick={() => {
+                        if (
                           room.getMePlayer()?.state === PlayerState.NO_READY
-                          ? sendHsReady()
-                          : sendHsNotReady();
+                        ) {
+                          sendUpdateDeck(deck);
+                          window.myExtraDeckCodes = [...deck.extra];
+                          sendHsReady();
+                        } else {
+                          sendHsNotReady();
+                        }
                       }}
                     >
                       {room.getMePlayer()?.state === PlayerState.NO_READY
@@ -306,7 +307,6 @@ const Controller: React.FC<{ onDeckChange: (deckName: string) => void }> = ({
 }) => {
   const snapDeck = useSnapshot(deckStore);
   const snapRoom = useSnapshot(roomStore);
-  const navigate = useNavigate();
   return (
     <Space>
       <Select
@@ -345,26 +345,6 @@ const Controller: React.FC<{ onDeckChange: (deckName: string) => void }> = ({
           ))}
         </Avatar.Group>
       </Button>
-      {/* <Button
-        size="large"
-        icon={<IconFont type="icon-play" size={12} />}
-        disabled={!snapRoom.isHost}
-        onClick={() => sendHsStart()}
-      >
-        开始游戏
-      </Button> */}
-      {/* <Button
-        size="large"
-        danger
-        onClick={() => {
-          // 断开websocket🔗，
-          socketMiddleWare({ cmd: socketCmd.DISCONNECT });
-          // 返回上一个路由
-          navigate("..");
-        }}
-      >
-        退出房间
-      </Button> */}
     </Space>
   );
 };