Merge pull request #195 from h8570rg/develop

Prd

app/(main)/(components)/ReleaseNotesModal/index.tsx

@@ -0,0 +1,79 @@
+"use client";
+
+import { Suspense } from "react";
+import { Button } from "@/components/Button";
+import {
+  Modal,
+  ModalBody,
+  ModalContent,
+  ModalFooter,
+  ModalHeader,
+} from "@/components/Modal";
+import packageJson from "@/package.json";
+import { versionComponents } from "./versions";
+
+// バージョンをパースして数値に変換するヘルパー関数
+function parseVersion(version: string) {
+  return version.split(".").map(Number);
+}
+
+// バージョンの大小を比較する関数
+function isVersionGreater(v1: string, v2: string) {
+  const parsedV1 = parseVersion(v1);
+  const parsedV2 = parseVersion(v2);
+
+  for (let i = 0; i < 3; i++) {
+    if (parsedV1[i] > parsedV2[i]) return true;
+    if (parsedV1[i] < parsedV2[i]) return false;
+  }
+
+  return false;
+}
+
+function setLastVersion() {
+  localStorage.setItem("lastVersion", packageJson.version);
+}
+
+function ReleaseNotesModal() {
+  const lastVersion = localStorage.getItem("lastVersion");
+
+  const newVersions = Object.entries(versionComponents).filter(([v]) =>
+    lastVersion ? isVersionGreater(v, lastVersion) : v === "0.1.0",
+  );
+
+  if (lastVersion && newVersions.length === 0) {
+    return null;
+  }
+
+  const onClose = () => {
+    setLastVersion();
+  };
+
+  return (
+    <Suspense>
+      <Modal defaultOpen={true} size="xs" placement="center" onClose={onClose}>
+        <ModalContent>
+          {(onClose) => (
+            <>
+              <ModalHeader className="flex flex-col gap-1">
+                リリース情報
+              </ModalHeader>
+              <ModalBody>
+                {newVersions.reverse().map(([v, Component]) => (
+                  <Component key={v} />
+                ))}
+              </ModalBody>
+              <ModalFooter>
+                <Button variant="light" onPress={onClose}>
+                  閉じる
+                </Button>
+              </ModalFooter>
+            </>
+          )}
+        </ModalContent>
+      </Modal>
+    </Suspense>
+  );
+}
+
+export default ReleaseNotesModal;

app/(main)/(components)/ReleaseNotesModal/versions/0_1_0.tsx

@@ -0,0 +1,16 @@
+export default function ReleaseNotes_0_1_0() {
+  return (
+    <>
+      <p>Janrecoへようこそ！</p>
+      <p>
+        現在はベータ版ですが、機能の追加や改善を行っていく予定です。今後のアップデートにご期待ください！
+      </p>
+      <h2>- 今後の機能追加予定 -</h2>
+      <ol className="list-inside list-disc">
+        <li>半荘結果編集</li>
+        <li>ユーザー情報編集</li>
+        <li>フリー記録 など</li>
+      </ol>
+    </>
+  );
+}

app/(main)/(components)/ReleaseNotesModal/versions/index.ts

@@ -0,0 +1,5 @@
+import V0_1_0 from "./0_1_0";
+
+export const versionComponents = {
+  "0.1.0": V0_1_0,
+} as const;

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

@@ -136,7 +136,7 @@ export async function MatchTable({
           結果を入力する
         </GameModalTrigger>
       </div>
-      <div className="rounded-lg bg-default-100 text-foreground-500">
+      <div className="mt-3 rounded-lg bg-default-100 text-foreground-500">
         <div className={classNames(styles["row"])}>
           <div
             className={classNames(

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

@@ -19,7 +19,7 @@ export default async function Match({
 
   return (
     <MatchContextProvider>
-      <div className="flex h-full flex-col">
+      <div className="flex h-full flex-col pb-5">
         <div className="mb-1 flex items-center justify-between">
           <div className="flex items-center gap-1">
             <Button isIconOnly variant="light" as={Link} href="/matches">

app/(main)/(routes)/matches/page.tsx

@@ -24,7 +24,7 @@ export default async function Matches() {
           </li>
         ))}
       </ul>
-      <div className="fixed inset-x-0 bottom-0 z-10 p-4">
+      <div className="sticky inset-x-0 bottom-0 z-10 bg-gradient-to-t from-background p-4">
         <CreateMatchButton className="w-full" />
       </div>
     </div>

app/(main)/layout.tsx

@@ -1,16 +1,21 @@
+import dynamic from "next/dynamic";
 import Navbar from "./(components)/Navbar";
-// import { getUser } from "./actions";
+
+const ReleaseNotesModal = dynamic(
+  () => import("./(components)/ReleaseNotesModal"),
+  { ssr: false },
+);
 
 export default async function AppLayout({
   children,
 }: {
   children: React.ReactNode;
 }) {
-  // await getUser(); // TODO: パフォーマンス検証中。うまくいったらコンテキスト流したい。
   return (
     <div className="flex h-full flex-col">
       <Navbar />
-      <main className="flex-1 px-4 pb-5">{children}</main>
+      <main className="flex-1 px-4">{children}</main>
+      <ReleaseNotesModal />
     </div>
   );
 }

lib/migration/index.ts

@@ -4,6 +4,14 @@ import readline from "readline";
 import { createClient } from "@supabase/supabase-js";
 import type { Database } from "../database.types";
 
+// allはすべてのデータを移管する。
+// 対戦相手も紐づけるため、all一度しか実行しない。よってドキュメントも詳しく残していない。
+const mode: "all" | "isolate" = "all";
+
+const adminUserId = "";
+
+const allModeUserIdMap = {};
+
 // readline インターフェースを作成
 const rl = readline.createInterface({
   input: process.stdin,
@@ -93,7 +101,7 @@ async function main() {
             migration({
               oldData,
               userIdBefore,
-              userIdAfter,
+              userIdAfter: mode === "all" ? adminUserId : userIdAfter,
             });
           } else {
             // ユーザーが「n」などで確認しなかった場合の処理
@@ -124,11 +132,15 @@ async function migration({
     createdAt: key,
   }));
 
-  const olsPlayerMatches = oldMatchesArray.filter((item) =>
-    item.players.some((player) => player.id === userIdBefore),
-  );
+  // all mode の場合は全ての match を移管
+  const oldPlayerMatches =
+    mode === "all"
+      ? oldMatchesArray
+      : oldMatchesArray.filter((item) =>
+          item.players.some((player) => player.id === userIdBefore),
+        );
 
-  for (const playerMatch of olsPlayerMatches) {
+  for (const playerMatch of oldPlayerMatches) {
     const {
       players: oldPlayers,
       chips: oldChips,
@@ -138,7 +150,12 @@ async function migration({
     } = playerMatch;
 
     // 移管後の playerId と移管前の playerId の対応を保存
-    const playerIdMap: { [key: string]: string } = {};
+    const playerIdMap: { [key: string]: string } =
+      mode === "all"
+        ? allModeUserIdMap
+        : {
+            [userIdBefore]: userIdAfter,
+          };
 
     // match を作成
     const match = await createMatch({
@@ -170,7 +187,8 @@ async function migration({
           playerChip = Math.round(playerChip);
         }
       }
-      if (player.id !== userIdBefore) {
+      if (!playerIdMap[player.id]) {
+        // 移管後の playerId が存在しない場合は新規作成
         const profile = await createProfile({
           name: player.nickName,
         });
@@ -181,12 +199,12 @@ async function migration({
         });
         playerIdMap[player.id] = profile.id;
       } else {
+        // 移管後の playerId が存在する場合はそのまま使用
         await createMatchPlayer({
           matchId: match.id,
-          playerId: userIdAfter,
+          playerId: playerIdMap[player.id],
           chipCount: playerChip,
         });
-        playerIdMap[userIdBefore] = userIdAfter;
       }
     }
 

next-env.d.ts

@@ -2,4 +2,4 @@
 /// <reference types="next/image-types/global" />
 
 // NOTE: This file should not be edited
-// see https://nextjs.org/docs/basic-features/typescript for more information.
+// see https://nextjs.org/docs/app/building-your-application/configuring/typescript for more information.