refactor: Fix formatting in middleware.ts, route.ts, loading.tsx, and…

… use-system-theme.ts

.devcontainer/devcontainer.json

@@ -3,16 +3,16 @@
 {
   "name": "Node.js & TypeScript",
   // Or use a Dockerfile or Docker Compose file. More info: https://containers.dev/guide/dockerfile
-  "image": "mcr.microsoft.com/devcontainers/typescript-node:1-22-bookworm",
+  "image": "mcr.microsoft.com/devcontainers/typescript-node:1-22-bookworm"
 
   // Features to add to the dev container. More info: https://containers.dev/features.
   // "features": {},
 
   // Use 'forwardPorts' to make a list of ports inside the container available locally.
-  "forwardPorts": [3000],
+  //"forwardPorts": [3000]
 
   // Use 'postCreateCommand' to run commands after the container is created.
-  "postCreateCommand": "npm install"
+  //"postCreateCommand": "npm install"
 
   // Configure tool-specific properties.
   // "customizations": {},

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

@@ -1,7 +1,7 @@
-import NextAuth from "next-auth";
-
-import options from "@/config/auth";
-
-const handler = NextAuth(options);
-
-export { handler as GET, handler as POST };
+import NextAuth from "next-auth";
+
+import options from "@/config/auth";
+
+const handler = NextAuth(options);
+
+export { handler as GET, handler as POST };

src/app/loading.tsx

@@ -1,13 +1,13 @@
-import { CircularProgress } from "@nextui-org/react";
-
-export default function Loading() {
-  return (
-    <CircularProgress
-      className="mx-auto mt-4"
-      classNames={{
-        svg: "w-36 h-36",
-      }}
-      aria-label="Loading page"
-    />
-  );
-}
+import { CircularProgress } from "@nextui-org/react";
+
+export default function Loading() {
+  return (
+    <CircularProgress
+      className="mx-auto mt-4"
+      classNames={{
+        svg: "w-36 h-36",
+      }}
+      aria-label="Loading page"
+    />
+  );
+}

src/app/not-found.tsx

@@ -1,15 +1,15 @@
-import { Card, CardBody } from "@nextui-org/react";
-import { IconFileUnknown } from "@tabler/icons-react";
-
-export default function NotFound() {
-  return (
-    <Card className="mx-auto mt-4 max-w-md">
-      <CardBody>
-        <p className="flex items-center justify-center gap-2 text-2xl">
-          <IconFileUnknown />
-          404 | Page Not Found
-        </p>
-      </CardBody>
-    </Card>
-  );
-}
+import { Card, CardBody } from "@nextui-org/react";
+import { IconFileUnknown } from "@tabler/icons-react";
+
+export default function NotFound() {
+  return (
+    <Card className="mx-auto mt-4 max-w-md">
+      <CardBody>
+        <p className="flex items-center justify-center gap-2 text-2xl">
+          <IconFileUnknown />
+          404 | Page Not Found
+        </p>
+      </CardBody>
+    </Card>
+  );
+}

src/app/profile/page.tsx

@@ -1,23 +1,23 @@
-import { Card, CardBody, User } from "@nextui-org/react";
-import { getServerSession } from "next-auth";
-
-import options from "@/config/auth";
-
-export default async function Profile() {
-  const session = await getServerSession(options);
-
-  return (
-    <Card className="mx-auto mt-4 max-w-md">
-      <CardBody>
-        <User
-          name={session?.user?.name}
-          description={session?.user?.email}
-          avatarProps={{
-            showFallback: !session?.user?.image,
-            src: session?.user?.image || "",
-          }}
-        />
-      </CardBody>
-    </Card>
-  );
-}
+import { Card, CardBody, User } from "@nextui-org/react";
+import { getServerSession } from "next-auth";
+
+import options from "@/config/auth";
+
+export default async function Profile() {
+  const session = await getServerSession(options);
+
+  return (
+    <Card className="mx-auto mt-4 max-w-md">
+      <CardBody>
+        <User
+          name={session?.user?.name}
+          description={session?.user?.email}
+          avatarProps={{
+            showFallback: !session?.user?.image,
+            src: session?.user?.image || "",
+          }}
+        />
+      </CardBody>
+    </Card>
+  );
+}

src/components/app-navbar/auth-button.tsx

@@ -1,63 +1,63 @@
-"use client";
-
-import {
-  Avatar,
-  Button,
-  CircularProgress,
-  Dropdown,
-  DropdownItem,
-  DropdownMenu,
-  DropdownTrigger,
-} from "@nextui-org/react";
-import { IconBrandGoogle } from "@tabler/icons-react";
-import { signIn, signOut, useSession } from "next-auth/react";
-
-export default function AuthButton({ minimal = true }: { minimal?: boolean }) {
-  const { data, status } = useSession();
-  if (status === "loading") {
-    return <CircularProgress />;
-  }
-  if (status === "authenticated") {
-    const signOutClick = () => signOut({ callbackUrl: "/" });
-    if (minimal) {
-      return (
-        <Button onClick={signOutClick} color="success" variant="ghost">
-          <IconBrandGoogle />
-          Sign Out
-        </Button>
-      );
-    }
-    return (
-      <Dropdown placement="bottom-end">
-        <DropdownTrigger>
-          <Avatar
-            isBordered
-            as="button"
-            className="transition-transform"
-            showFallback={!data.user?.image}
-            src={data.user?.image || ""}
-          />
-        </DropdownTrigger>
-        <DropdownMenu aria-label="Profile Actions" variant="flat">
-          <DropdownItem key="profile" className="h-14 gap-2">
-            <p className="font-semibold">Signed in as</p>
-            <p className="font-semibold">{data.user?.email}</p>
-          </DropdownItem>
-          <DropdownItem key="logout" color="danger" onClick={signOutClick}>
-            Sign Out
-          </DropdownItem>
-        </DropdownMenu>
-      </Dropdown>
-    );
-  }
-  return (
-    <Button
-      onClick={() => signIn("google", { callbackUrl: "/profile" })}
-      color="danger"
-      variant="ghost"
-    >
-      <IconBrandGoogle />
-      Sign In
-    </Button>
-  );
-}
+"use client";
+
+import {
+  Avatar,
+  Button,
+  CircularProgress,
+  Dropdown,
+  DropdownItem,
+  DropdownMenu,
+  DropdownTrigger,
+} from "@nextui-org/react";
+import { IconBrandGoogle } from "@tabler/icons-react";
+import { signIn, signOut, useSession } from "next-auth/react";
+
+export default function AuthButton({ minimal = true }: { minimal?: boolean }) {
+  const { data, status } = useSession();
+  if (status === "loading") {
+    return <CircularProgress />;
+  }
+  if (status === "authenticated") {
+    const signOutClick = () => signOut({ callbackUrl: "/" });
+    if (minimal) {
+      return (
+        <Button onClick={signOutClick} color="success" variant="ghost">
+          <IconBrandGoogle />
+          Sign Out
+        </Button>
+      );
+    }
+    return (
+      <Dropdown placement="bottom-end">
+        <DropdownTrigger>
+          <Avatar
+            isBordered
+            as="button"
+            className="transition-transform"
+            showFallback={!data.user?.image}
+            src={data.user?.image || ""}
+          />
+        </DropdownTrigger>
+        <DropdownMenu aria-label="Profile Actions" variant="flat">
+          <DropdownItem key="profile" className="h-14 gap-2">
+            <p className="font-semibold">Signed in as</p>
+            <p className="font-semibold">{data.user?.email}</p>
+          </DropdownItem>
+          <DropdownItem key="logout" color="danger" onClick={signOutClick}>
+            Sign Out
+          </DropdownItem>
+        </DropdownMenu>
+      </Dropdown>
+    );
+  }
+  return (
+    <Button
+      onClick={() => signIn("google", { callbackUrl: "/profile" })}
+      color="danger"
+      variant="ghost"
+    >
+      <IconBrandGoogle />
+      Sign In
+    </Button>
+  );
+}