Reformat code

Remove custom font from opengraph-image.tsx

app/api/auth/[...nextauth]/route.ts

@@ -1,4 +1,4 @@
-import NextAuth, {AuthOptions as NextAuthOptions} from "next-auth";
+import NextAuth, { AuthOptions as NextAuthOptions } from "next-auth";
 import { PrismaAdapter } from "@next-auth/prisma-adapter";
 import prisma from "@/lib/prisma";
 import GoogleProvider from "next-auth/providers/google";
@@ -13,8 +13,8 @@ export const authOptions: NextAuthOptions = {
     }),
     GitHubProvider({
       clientId: process.env.GITHUB_ID as string,
-      clientSecret: process.env.GITHUB_SECRET as string
-    })
+      clientSecret: process.env.GITHUB_SECRET as string,
+    }),
   ],
   // callbacks: {
   //   jwt({ token, account, user }) {
@@ -52,7 +52,7 @@ export const authOptions: NextAuthOptions = {
     },
   },
   session: {
-    strategy: 'jwt',
+    strategy: "jwt",
   },
 };
 

app/api/quiz/[id]/route.ts

@@ -1,18 +1,21 @@
-import {NextRequest, NextResponse} from "next/server";
+import { NextRequest, NextResponse } from "next/server";
 
 import prisma from "@/lib/prisma";
 
-export async function GET(req: NextRequest, context: { params: { id: string } }) {
-    const id  = context.params.id;
+export async function GET(
+  req: NextRequest,
+  context: { params: { id: string } },
+) {
+  const id = context.params.id;
 
-    const quiz = await prisma.quiz.findUnique({
-        where: {
-            id
-        },
-        include: {
-            words: true
-        }
-    });
-    console.log("loaded quiz with id: " + id)
-    return NextResponse.json(quiz)
-}
+  const quiz = await prisma.quiz.findUnique({
+    where: {
+      id,
+    },
+    include: {
+      words: true,
+    },
+  });
+  console.log("loaded quiz with id: " + id);
+  return NextResponse.json(quiz);
+}

app/api/quiz/route.ts

@@ -19,49 +19,49 @@
 //     // });
 // }
 
-import {NextRequest, NextResponse} from "next/server";
+import { NextRequest, NextResponse } from "next/server";
 
 import prisma from "@/lib/prisma";
-import {getServerSession} from "next-auth/next";
-import {authOptions} from "@/app/api/auth/[...nextauth]/route";
+import { getServerSession } from "next-auth/next";
+import { authOptions } from "@/app/api/auth/[...nextauth]/route";
 
 // export const runtime = "edge";
 
 export async function POST(req: NextRequest) {
-    console.time("quiz")
+  console.time("quiz");
 
-    const { name, words } = await req.json();
-    const session = await getServerSession(authOptions) as any;
-    // console.log(session)
+  const { name, words } = await req.json();
+  const session = (await getServerSession(authOptions)) as any;
+  // console.log(session)
 
-    if (!session) {
-        return NextResponse.json("Unauthorized", {
-            status: 401
-        })
-    }
-
-    console.log(session.user.id)
-    const newQuiz = await prisma.quiz.create({
-        data: {
-            name,
-            words: {
-                create: words
-            },
-            user: {
-                connect: {
-                    id: session.user.id
-                }
-            }
-        }
+  if (!session) {
+    return NextResponse.json("Unauthorized", {
+      status: 401,
     });
+  }
+
+  console.log(session.user.id);
+  const newQuiz = await prisma.quiz.create({
+    data: {
+      name,
+      words: {
+        create: words,
+      },
+      user: {
+        connect: {
+          id: session.user.id,
+        },
+      },
+    },
+  });
 
-    console.timeEnd("quiz")
+  console.timeEnd("quiz");
 
-    return NextResponse.json(newQuiz)
-    // return NextResponse.json({})
+  return NextResponse.json(newQuiz);
+  // return NextResponse.json({})
 }
 
 export async function GET() {
-    const quizzes = await prisma.quiz.findMany();
-    return NextResponse.json(quizzes)
-}
+  const quizzes = await prisma.quiz.findMany();
+  return NextResponse.json(quizzes);
+}

app/globals.css

@@ -1,71 +1,71 @@
 @tailwind base;
 @tailwind components;
 @tailwind utilities;
- 
+
 @layer base {
   :root {
     --background: 0 0% 100%;
     --foreground: 222.2 84% 4.9%;
 
     --card: 0 0% 100%;
     --card-foreground: 222.2 84% 4.9%;
- 
+
     --popover: 0 0% 100%;
     --popover-foreground: 222.2 84% 4.9%;
- 
+
     --primary: 222.2 47.4% 11.2%;
     --primary-foreground: 210 40% 98%;
- 
+
     --secondary: 210 40% 96.1%;
     --secondary-foreground: 222.2 47.4% 11.2%;
- 
+
     --muted: 210 40% 96.1%;
     --muted-foreground: 215.4 16.3% 46.9%;
- 
+
     --accent: 210 40% 96.1%;
     --accent-foreground: 222.2 47.4% 11.2%;
- 
+
     --destructive: 0 84.2% 60.2%;
     --destructive-foreground: 210 40% 98%;
 
     --border: 214.3 31.8% 91.4%;
     --input: 214.3 31.8% 91.4%;
     --ring: 222.2 84% 4.9%;
- 
+
     --radius: 0.5rem;
   }
- 
+
   .dark {
     --background: 222.2 84% 4.9%;
     --foreground: 210 40% 98%;
- 
+
     --card: 222.2 84% 4.9%;
     --card-foreground: 210 40% 98%;
- 
+
     --popover: 222.2 84% 4.9%;
     --popover-foreground: 210 40% 98%;
- 
+
     --primary: 210 40% 98%;
     --primary-foreground: 222.2 47.4% 11.2%;
- 
+
     --secondary: 217.2 32.6% 17.5%;
     --secondary-foreground: 210 40% 98%;
- 
+
     --muted: 217.2 32.6% 17.5%;
     --muted-foreground: 215 20.2% 65.1%;
- 
+
     --accent: 217.2 32.6% 17.5%;
     --accent-foreground: 210 40% 98%;
- 
+
     --destructive: 0 62.8% 30.6%;
     --destructive-foreground: 210 40% 98%;
- 
+
     --border: 217.2 32.6% 17.5%;
     --input: 217.2 32.6% 17.5%;
     --ring: 212.7 26.8% 83.9%;
   }
 }
- 
+
 @layer base {
   * {
     @apply border-border;
@@ -83,4 +83,4 @@ body {
 
 html body {
   overflow: initial !important;
-}
+}

app/layout.tsx

@@ -1,49 +1,47 @@
 import "./globals.css";
-import {Analytics} from "@vercel/analytics/react";
+import { Analytics } from "@vercel/analytics/react";
 import Nav from "@/components/layout/nav";
 import React from "react";
-import {ThemeProvider} from "@/components/theme-provider";
-import {inter, sfPro} from "@/app/fonts";
-import {cx} from "class-variance-authority";
+import { ThemeProvider } from "@/components/theme-provider";
+import { inter, sfPro } from "@/app/fonts";
+import { cx } from "class-variance-authority";
 import { Toaster } from "@/components/ui/toaster";
 
 export const metadata = {
+  title: "NextQuiz",
+  description:
+    "NextQuiz is a quiz app built with Next.js, Prisma, and Tailwind CSS.",
+  twitter: {
+    card: "summary_large_image",
     title: "NextQuiz",
     description:
-        "NextQuiz is a quiz app built with Next.js, Prisma, and Tailwind CSS.",
-    twitter: {
-        card: "summary_large_image",
-        title: "NextQuiz",
-        description:
-            "NextQuiz is a quiz app built with Next.js, Prisma, and Tailwind CSS.",
-        creator: "@davide_marcoli",
-    },
-    metadataBase: new URL("https://next-quiz.davidemarcoli.dev"),
-    themeColor: "#000000",
+      "NextQuiz is a quiz app built with Next.js, Prisma, and Tailwind CSS.",
+    creator: "@davide_marcoli",
+  },
+  metadataBase: new URL("https://next-quiz.davidemarcoli.dev"),
+  themeColor: "#000000",
 };
 
 export default async function RootLayout({
-                                             children,
-                                         }: {
-    children: React.ReactNode;
+  children,
+}: {
+  children: React.ReactNode;
 }) {
-    return (
-        <>
-            <html lang="en">
-            <body className={cx(sfPro.variable, inter.variable)}>
-            <ThemeProvider attribute="class" defaultTheme="system" enableSystem>
-                {/*<Suspense fallback="...">*/}
-                {/* @ts-expect-error Server Component */}
-                <Nav/>
-                {/*</Suspense>*/}
-                <main className={"mt-16 mx-4"}>
-                    {children}
-                </main>
-                <Toaster />
-                <Analytics/>
-            </ThemeProvider>
-            </body>
-            </html>
-        </>
-    );
+  return (
+    <>
+      <html lang="en">
+        <body className={cx(sfPro.variable, inter.variable)}>
+          <ThemeProvider attribute="class" defaultTheme="system" enableSystem>
+            {/*<Suspense fallback="...">*/}
+            {/* @ts-expect-error Server Component */}
+            <Nav />
+            {/*</Suspense>*/}
+            <main className={"mx-4 mt-16"}>{children}</main>
+            <Toaster />
+            <Analytics />
+          </ThemeProvider>
+        </body>
+      </html>
+    </>
+  );
 }

app/opengraph-image.tsx

@@ -6,9 +6,9 @@ export const alt = "Next Quiz";
 export const contentType = "image/png";
 
 export default async function OG() {
-  const sfPro = await fetch(
-    new URL("./fonts/SF-Pro-Display-Medium.otf", import.meta.url),
-  ).then((res) => res.arrayBuffer());
+  // const sfPro = await fetch(
+  //   new URL("./fonts/SF-Pro-Display-Medium.otf", import.meta.url),
+  // ).then((res) => res.arrayBuffer());
 
   return new ImageResponse(
     (
@@ -42,19 +42,19 @@ export default async function OG() {
             letterSpacing: "-0.02em",
           }}
         >
-            Next Quiz
+          Next Quiz
         </h1>
       </div>
     ),
     {
       width: 1200,
       height: 630,
-      fonts: [
-        {
-          name: "SF Pro",
-          data: sfPro,
-        },
-      ],
+      // fonts: [
+      //   {
+      //     name: "SF Pro",
+      //     data: sfPro,
+      //   },
+      // ],
     },
   );
 }

app/page.tsx

@@ -1,12 +1,10 @@
 import ListQuiz from "@/app/quiz/list/page";
 
 export default async function Home() {
-
-
   return (
-      <>
-        {/* @ts-expect-error Server Component */}
-        <ListQuiz />
-      </>
+    <>
+      {/* @ts-expect-error Server Component */}
+      <ListQuiz />
+    </>
   );
 }