Merge pull request #186 from h8570rg/develop

Prd

.env.example

@@ -1,3 +1,4 @@
+NEXT_PUBLIC_SERVICE_ENV=local
 NEXT_PUBLIC_SERVICE_NAME=janreco
 NEXT_PUBLIC_SUPABASE_URL=
 NEXT_PUBLIC_SUPABASE_ANON_KEY=

.gitignore

@@ -8,4 +8,7 @@ tsconfig.tsbuildinfo
 **/public/sw.js
 **/public/sw.js.map
 **/public/workbox-*.js
-**/public/workbox-*.js.map
+**/public/workbox-*.js.map
+
+lib/migration/dist
+lib/migration/old-data.json

app/(auth)/(routes)/login/(components)/SocialProviders/index.tsx

@@ -3,17 +3,29 @@
 import classNames from "classnames";
 import { Button } from "@/components/Button";
 import { GoogleIcon } from "@/components/SocialProviderIcon";
+import { getIsWebview } from "@/lib/utils/userAgent";
 import { signInWithGoogle } from "../LoginForm/actions";
 
 export function SocialProviders({ className }: { className?: string }) {
+  const handleGoogleClick = () => {
+    const isWebview = getIsWebview();
+    if (isWebview) {
+      window.alert(
+        "アプリ内ブラウザではGoogleログインを利用できません。他のブラウザでお試しください。",
+      );
+      return;
+    }
+    signInWithGoogle();
+  };
+
   return (
     <ul className={classNames("space-y-2", className)}>
       <li className="w-full">
         <Button
           fullWidth
           className="flex items-center justify-center gap-3"
           variant="bordered"
-          onClick={() => signInWithGoogle()}
+          onClick={handleGoogleClick}
         >
           <GoogleIcon className="w-5" />
           <span>Google でログイン</span>
@@ -23,7 +35,7 @@ export function SocialProviders({ className }: { className?: string }) {
         <Button
           fullWidth
           variant="bordered"
-          onClick={() => alert("Coming soon!")} // TODO: 実装
+          onClick={() => alert("開発中です、しばらくお待ちください")}
         >
           <span>ログインせずに始める</span>
         </Button>

app/layout.tsx

@@ -8,10 +8,19 @@ import { NextUIProvider } from "./nextUiProvider";
 
 export const metadata: Metadata = {
   title: {
-    template: "%s | Janreco",
-    default: "Janreco",
+    template:
+      process.env.NEXT_PUBLIC_SERVICE_ENV !== "development"
+        ? "%s | Janreco"
+        : "[開発環境] %s | Janreco",
+    default:
+      process.env.NEXT_PUBLIC_SERVICE_ENV !== "development"
+        ? "Janreco"
+        : "[開発環境] Janreco",
   },
-  description: "麻雀成績管理アプリ",
+  description:
+    process.env.NEXT_PUBLIC_SERVICE_ENV !== "development"
+      ? "麻雀成績管理アプリ"
+      : "[開発環境] 麻雀成績管理アプリ",
 };
 
 export default async function RootLayout({

components/Logo/index.tsx

@@ -4,6 +4,9 @@ function Logo({ className }: { className?: string }) {
   const serviceName = process.env.NEXT_PUBLIC_SERVICE_NAME;
   return (
     <div className={classNames("font-righteous", className)}>
+      {process.env.NEXT_PUBLIC_SERVICE_ENV === "development" && (
+        <span className="text-warning">{`[開発環境] `}</span>
+      )}
       {serviceName[0].toUpperCase() + serviceName.slice(1)}
     </div>
   );

global.d.ts

@@ -1,6 +1,7 @@
 declare global {
   namespace NodeJS {
     interface ProcessEnv {
+      NEXT_PUBLIC_SERVICE_ENV: "local" | "development" | "production";
       NEXT_PUBLIC_VERCEL_URL: string | undefined;
       NEXT_PUBLIC_SITE_URL: string | undefined;
       NEXT_PUBLIC_SERVICE_NAME: string;

lib/migration/README.md

@@ -0,0 +1,84 @@
+# mj-app-pwa からのデータ移管手順
+
+## 概要
+
+このドキュメントでは、旧サービス（mj-app-pwa）から新サービスへのデータ移管方法を説明します。
+
+- 旧サービスURL: https://mj-app-pwa.web.app
+- 旧サービスリポジトリ: https://github.com/h8570rg/mjapp
+
+## 手順
+
+### 1. Firebase Console にアクセス
+
+Firebase Consoleに以下のURLからアクセスします：
+https://console.firebase.google.com/u/0/project/mj-app-pwa/settings/serviceaccounts/adminsdk?hl=ja
+
+### 2. 秘密鍵の生成
+
+1. 「新しい秘密鍵の生成」をクリックし、JSONファイルをダウンロードします。
+2. ダウンロードしたファイルを作業ディレクトリに`credentials.json`という名前で保存します。
+
+### 3. Firestore データのエクスポート
+
+コマンドラインで以下のコマンドを実行し、データをエクスポートします：
+
+```bash
+npx -p node-firestore-import-export firestore-export -a credentials.json -b old-data.json
+```
+
+生成された`old-data.json`ファイルを`lib/migration`ディレクトリ直下に配置してください：
+
+```
+lib/migration
+├── README.md
+├── index.ts
+├── old-data.json
+```
+
+### 4. データ移管
+
+#### 4.1 変数の準備
+
+以下の情報を準備します：
+- Supabase URL
+- Service Role Key
+- 移管前ユーザーID
+- 移管後ユーザーID
+
+##### Supabase URL と Service Role Key の取得
+
+- 開発環境: https://supabase.com/dashboard/project/ggkmppnjhrwzdsamzqbp/settings/api
+- 本番環境: https://supabase.com/dashboard/project/owagpoywxhbsckytdtoj/settings/api
+
+ローカル環境の場合、以下のコマンドで情報を取得します：
+
+```bash
+npm run supabase:start
+```
+
+##### ユーザーID の取得
+
+- 移管前ユーザーID: 
+  https://console.firebase.google.com/u/0/project/mj-app-pwa/firestore/databases/-default-/data/~2Fusers~2F1JfzwtMcu5SImqkNE8dKcq8sWxD2?hl=ja
+
+- 移管後ユーザーID:
+  - ローカル環境: http://localhost:54323/project/default/editor
+  - 開発環境: https://supabase.com/dashboard/project/ggkmppnjhrwzdsamzqbp/editor
+  - 本番環境: https://supabase.com/dashboard/project/owagpoywxhbsckytdtoj/editor
+
+#### 4.2 データ移行の実行
+
+以下のコマンドを実行し、データを新サービスに移行します：
+
+```bash
+SUPABASE_URL=<API URL> SERVICE_ROLE_KEY=<service_role key> npm run migration
+```
+
+コマンド実行後、移管前ユーザーIDと移管後ユーザーIDを入力するプロンプトが表示されるので、準備した情報を入力してください。
+
+
+## 注意事項
+
+- service_role key は他者に漏洩しないよう注意してください。
+- 複数回実行するとデータが重複して登録されるため、移行処理は1回のみ実行してください。