ページを作成

app/(app)/speaking/main.tsx

@@ -0,0 +1,49 @@
+"use client";
+
+import { customSession } from "@/@types/customSession";
+import { fileType } from "@/@types/fileType";
+import { getFileInfo, getFileContent } from "@/googledrive";
+import { useDocumentTitle } from "@uidotdev/usehooks";
+import { useSession } from "next-auth/react";
+import { useState, useEffect } from "react";
+
+export default function Speaking({
+  fileId,
+  mode,
+}: {
+  fileId: string;
+  mode?: any;
+}) {
+  const [fileContent, setFileContent] = useState<fileType | undefined>();
+  const [title, setTitle] = useState("");
+  const [loading, setLoading] = useState(true);
+  const { data: session }: { data: customSession | null } =
+    useSession() as unknown as { data: customSession };
+  const token = session?.accessToken;
+
+  // 初期読み込み
+  useEffect(() => {
+    (async () => {
+      if (!token) return;
+      try {
+        await Promise.all([
+          setTitle((await getFileInfo(token, fileId)).name),
+          setFileContent(JSON.parse(await getFileContent(token, fileId))),
+        ]);
+        setLoading(false);
+      } catch (e: any) {
+        // 空ファイルでは "SyntaxError: Unexpected end of JSON input" を吐くが問題なし
+        if (e.message !== "Unexpected end of JSON input") console.error(e);
+      }
+    })();
+  }, [token, fileId]);
+  useDocumentTitle(
+    `${title
+      .split(".")
+      .slice(0, -1)
+      .join(".")} | スピーキング練習 | VocabPhrase | chakkun1121`
+  );
+  if (loading)
+    return <div className="text-center print-none select-none">loading...</div>;
+  return <></>;
+}

app/(app)/speaking/page.tsx

@@ -0,0 +1,21 @@
+import { redirect } from "next/navigation";
+import { Metadata } from "next";
+import Speaking from "./main";
+
+export default function Print({
+  searchParams: { fileId, mode },
+}: {
+  searchParams: {
+    fileId?: string;
+    mode?: "repeat" | "shadowing" | "ja2en" | "declamation";
+  };
+}) {
+  if (!fileId) redirect("/app");
+  return <Speaking fileId={fileId} mode={mode} />;
+}
+export const metadata: Metadata = {
+  title: "スピーキング練習ページ",
+  alternates: {
+    canonical: "/speaking",
+  },
+};