fix: sonar cloud issue and build error

components/rooms/RoomButtonGroup.tsx

@@ -3,8 +3,6 @@ import Icon from "../shared/Icon";
 
 type RoomButtonGroupProps = {
   isHost: boolean;
-  isReady: boolean;
-  onToggleReady: () => void;
   onClickLeave: () => void;
   onClickClose: () => void;
   onClickStart: () => void;

components/shared/Breadcrumb/index.tsx

@@ -1,2 +1,2 @@
-export { default as Breadcrumb } from "./Breadcrumb";
+export { default } from "./Breadcrumb";
 export * from "./Breadcrumb";

components/shared/Button/Button.tsx

@@ -116,7 +116,7 @@ const InteralButton = <C extends ElementType = "button">(
     "relative px-4 py-1.5 inline-flex items-center gap-1.5 rounded-lg shadow-md text-white/90 focus:outline-8 transition-[box-shadow,background,opacity] ease-in",
     buttonVariants[variant],
     (disabled || loading) &&
-      "opacity-70 pointer-events-none select-none text-gray-200",
+      "opacity-70 pointer-events-none select-none text-grey-200",
     active && buttonVariants[`${variant}_active`],
     className
   );

features/game/contexts/index.ts

@@ -1,2 +1,2 @@
-export { default as GameListProvider } from "./gameList";
-export * from "./gameList";
+export { default as GameListProvider } from "./GameList";
+export * from "./GameList";

features/room/components/JoinLockRoomForm.tsx

@@ -1,4 +1,6 @@
+import { AxiosError } from "axios";
 import { FormEvent, PropsWithChildren, useState } from "react";
+import { useTranslation } from "react-i18next";
 import { Button } from "@/components/shared/Button/v2";
 import Icon from "@/components/shared/Icon";
 import InputOTP from "@/components/shared/InputOTP";
@@ -8,7 +10,8 @@ interface JoinLockRoomFormProps extends PropsWithChildren {
   id: string;
 }
 
-function JoinLockRoomForm({ id, children }: JoinLockRoomFormProps) {
+function JoinLockRoomForm({ id, children }: Readonly<JoinLockRoomFormProps>) {
+  const { t } = useTranslation("rooms");
   const { handleJoinRoom } = useJoinRoom(id);
   const [password, setPassword] = useState("");
   const [errorMessage, setErrorMessage] = useState("");
@@ -24,8 +27,11 @@ function JoinLockRoomForm({ id, children }: JoinLockRoomFormProps) {
     try {
       await handleJoinRoom(password);
     } catch (error) {
-      if (typeof error === "string") {
-        setErrorMessage(error);
+      /// 待調整重構
+      if (error instanceof AxiosError) {
+        const msg = error.response?.data.message.replaceAll(" ", "_");
+        if (!msg) return;
+        setErrorMessage(t(msg));
       }
     }
   };

features/room/components/RoomCard.tsx

@@ -9,7 +9,7 @@ interface RoomsCardProps {
   onClick: () => void;
 }
 
-function RoomCard({ room, onClick }: RoomsCardProps) {
+function RoomCard({ room, onClick }: Readonly<RoomsCardProps>) {
   const { handleJoinRoom } = useJoinRoom(room.id);
   const lackTotalPlayers = room.maxPlayers - room.currentPlayers;
 

features/room/hooks/useJoinRoom.ts

@@ -38,7 +38,7 @@ function useJoinRoom(id: string) {
         const msg = err.response?.data.message.replaceAll(" ", "_");
         if (!msg) return toast({ children: "error!", state: "error" });
         toast({ children: t(msg), state: "error" });
-        return Promise.reject(t(msg));
+        throw err;
       }
     } finally {
       setIsLoading(false);

features/user/components/UserCard.tsx

@@ -14,7 +14,7 @@ interface IUserRole {
   text: string;
 }
 
-function UserCard({ id, nickname, isSelf, isHost }: UserCardProps) {
+function UserCard({ id, nickname, isSelf, isHost }: Readonly<UserCardProps>) {
   if (!id) {
     return <BoxFancy className="h-28" borderGradientColor="cyberpunk" />;
   }

pages/auth/login.tsx

@@ -1,4 +1,4 @@
-import { ReactElement, useEffect } from "react";
+import { useEffect } from "react";
 import { useRouter } from "next/router";
 import { GetStaticProps } from "next";
 import { serverSideTranslations } from "next-i18next/serverSideTranslations";

pages/auth/token/[token].tsx

@@ -1,4 +1,4 @@
-import { ReactElement, useEffect } from "react";
+import { useEffect } from "react";
 import { useRouter } from "next/router";
 import { GetStaticProps, GetStaticPaths } from "next";
 import { serverSideTranslations } from "next-i18next/serverSideTranslations";

pages/index.tsx

@@ -29,7 +29,7 @@ function CarouselCard({
   );
 }
 
-function TabPaneContent({ tabKey }: TabItemType<TabKey>) {
+function TabPaneContent({ tabKey }: Readonly<TabItemType<TabKey>>) {
   const gameList = useGameList();
 
   if ([TabKey.HOT, TabKey.NEW].includes(tabKey)) {

pages/rooms/[roomId]/index.tsx

@@ -273,12 +273,10 @@ export default function Room() {
             </div>
             <div className="absolute bottom-0 right-0 flex items-center">
               <RoomButtonGroup
-                onToggleReady={handleToggleReady}
                 onClickClose={handleClickClose}
                 onClickLeave={handleLeave}
                 onClickStart={handleStart}
                 isHost={isHost}
-                isReady={isHost || !!player?.isReady}
               />
             </div>
           </div>

pages/rooms/index.tsx

@@ -11,7 +11,7 @@ import usePagination from "@/hooks/usePagination";
 import useRequest from "@/hooks/useRequest";
 import { Room, RoomType, getRooms } from "@/requests/rooms";
 
-function TabPaneContent({ tabKey }: TabItemType<RoomType>) {
+function TabPaneContent({ tabKey }: Readonly<TabItemType<RoomType>>) {
   const { fetch } = useRequest();
   const gameList = useGameList();
   const [room, setRoom] = useState<Room | null>(null);

pages/without-layout.tsx

@@ -1,4 +1,3 @@
-import { ReactElement } from "react";
 import { NextPageWithProps } from "./_app";
 import Button from "@/components/shared/Button";
 import Link from "next/link";
@@ -14,7 +13,7 @@ const WithoutLayout: NextPageWithProps = () => {
   );
 };
 
-WithoutLayout.getLayout = (page: ReactElement) => page;
+WithoutLayout.getLayout = ({ children }) => children;
 WithoutLayout.Anonymous = true;
 
 export default WithoutLayout;