fix: chip

app/(main)/(routes)/matches/(routes)/[matchId]/(components)/ChipInputButton/index.tsx

@@ -0,0 +1,9 @@
+"use client";
+
+import { Button, ButtonProps } from "@/components/Button";
+import { useChipInputModal } from "../ChipInputModal/hooks";
+
+export function ChipInputButton(props: Omit<ButtonProps, "onClick">) {
+  const { onOpen } = useChipInputModal();
+  return <Button {...props} onClick={onOpen} />;
+}

app/(main)/(routes)/matches/(routes)/[matchId]/(components)/ChipInputModal/(components)/Form/actions.ts

@@ -1,10 +1,11 @@
 "use server";
 
+import { revalidatePath } from "next/cache";
 import { z } from "zod";
 import { serverServices } from "@/lib/services/server";
 import { schema } from "@/lib/utils/schema";
 
-type AddChipState = {
+export type AddChipState = {
   success?: boolean;
   errors?: {
     base?: string[];
@@ -72,6 +73,8 @@ export async function addChip(
     });
   });
 
+  revalidatePath(`/matches/${matchId}`);
+
   return {
     success: true,
   };

app/(main)/(routes)/matches/(routes)/[matchId]/(components)/MatchTable/(components)/ChipInputButton/index.tsx

@@ -0,0 +1,11 @@
+"use client";
+
+import { useChipInputModal } from "../../../ChipInputModal/hooks";
+
+export function ChipInputButton(
+  props: React.ComponentPropsWithoutRef<"button">,
+) {
+  const gameInputModal = useChipInputModal();
+
+  return <button onClick={gameInputModal.onOpen} {...props}></button>;
+}

app/(main)/(routes)/matches/(routes)/[matchId]/(components)/MatchTable/index.tsx

@@ -2,6 +2,7 @@ import classNames from "classnames";
 import { serverServices } from "@/lib/services/server";
 import { MatchPlayer } from "@/lib/type";
 import { AddGameButton } from "./(components)/AddGameButton";
+import { ChipInputButton } from "./(components)/ChipInputButton";
 import styles from "./styles.module.css";
 
 type Column = {
@@ -48,7 +49,7 @@ export async function MatchTable({
           rankCounts: [0] as number[],
           averageRank: 0,
           totalScore: 0,
-          chipCount: 0,
+          chipCount: null,
           result: 0,
         }) as const,
     ),
@@ -142,7 +143,7 @@ export async function MatchTable({
             </div>
           ))}
         </div>
-        <div className={classNames(styles["row"])}>
+        <ChipInputButton className={classNames(styles["row"], "w-full")}>
           <div
             className={classNames(
               styles["col"],
@@ -160,7 +161,7 @@ export async function MatchTable({
               {column.chipCount}
             </div>
           ))}
-        </div>
+        </ChipInputButton>
         <div className={classNames(styles["row"])}>
           <div
             className={classNames(

app/(main)/(routes)/matches/(routes)/[matchId]/page.tsx

@@ -4,6 +4,7 @@ import { Button } from "@/components/Button";
 import { Icon } from "@/components/Icon";
 import { serverServices } from "@/lib/services/server";
 import { dayjs } from "@/lib/utils/date";
+import { ChipInputButton } from "./(components)/ChipInputButton";
 import { ChipInputModal } from "./(components)/ChipInputModal";
 import { GameInputModal } from "./(components)/GameInputModal";
 import { MatchPlayerInputButton } from "./(components)/MatchPlayerInputButton";
@@ -37,6 +38,9 @@ export default async function Match({
           <p className="font-bold">{displayDate}</p>
         </div>
         <div className="flex items-center gap-0.5">
+          <ChipInputButton isIconOnly variant="light">
+            <Icon className="size-5 fill-current" name="chip" />
+          </ChipInputButton>
           <MatchPlayerInputButton isIconOnly variant="light">
             <Icon className="size-5 fill-current" name="personAdd" />
           </MatchPlayerInputButton>

components/Modal/index.tsx

@@ -25,8 +25,10 @@ export const useQueryControlledModal = (key: string) => {
   }, [key, pathname, router, searchParams]);
 
   const onClose = useCallback(() => {
-    router.back();
-  }, [router]);
+    const params = new URLSearchParams(searchParams);
+    params.delete(key);
+    router.push(`${pathname}?${params.toString()}`);
+  }, [key, pathname, router, searchParams]);
 
   return {
     isOpen,

lib/services/features/match.ts

@@ -168,7 +168,7 @@ export function matchService(supabase: Supabase) {
           chip_count: chipCount,
         })
         .eq("match_id", matchId)
-        .eq("profile_id", playerId);
+        .eq("player_id", playerId);
       if (updateMatchPlayerResponse.error)
         throw updateMatchPlayerResponse.error;
 

lib/utils/schema.ts

@@ -5,7 +5,9 @@ import {
   NAME_MAX_LENGTH,
   PASSWORD_MIN_LENGTH,
   calcMethods,
+  chipRates,
   inclines,
+  rates,
 } from "@/lib/config";
 
 export const schema = {
@@ -37,7 +39,7 @@ export const schema = {
     )
     .regex(/^[a-zA-Z0-9]+$/, "ユーザーIDは半角英数字のみで入力してください"),
   calcMethod: z.enum(calcMethods),
-  chipRate: z.string().transform(Number),
+  chipRate: z.string().transform((v) => chipRates[Number(v)]),
   crackBoxBonus: z
     .string()
     .min(1, "飛び賞を入力してください")
@@ -56,7 +58,7 @@ export const schema = {
   points: z
     .string()
     .transform((v) => (v === "0" || !!v ? Number(v) * 100 : undefined)),
-  rate: z.string().transform(Number),
+  rate: z.string().transform((v) => rates[Number(v)]),
   incline: z.enum(inclines),
   customIncline: z
     .object({