first commit

app/dashboard/page.tsx

@@ -0,0 +1,47 @@
+import { auth, clerkClient, useClerk } from "@clerk/nextjs";
+import { redirect, useRouter } from "next/navigation";
+import { OrgDetails, SessionDetails, UserDetails } from "./details";
+import Link from "next/link";
+
+export default async function DashboardPage() {
+  const { userId } = auth();
+  const router = useRouter();
+  const { signOut } = useClerk();
+
+  if (!userId) {
+    redirect("/");
+  }
+
+  const user = await clerkClient.users.getUser(userId);
+
+  return (
+    <div className="px-8 py-12 sm:py-16 md:px-20">
+      {user && (
+        <>
+          <h1 className="text-3xl font-semibold text-black">
+            👋 Hi, {user.firstName || `Stranger`}
+          </h1>
+          <button onClick={() => signOut(() => router.push("/"))}>
+            Sign out
+          </button>
+          <div className="grid gap-4 mt-8 lg:grid-cols-3">
+            <UserDetails />
+            <SessionDetails />
+            <OrgDetails />
+          </div>
+          <h2 className="mt-16 mb-4 text-3xl font-semibold text-black">
+            What's next?
+          </h2>
+          Read the{" "}
+          <Link
+            className="font-medium text-primary-600 hover:underline"
+            href="https://clerk.com/docs?utm_source=vercel-template&utm_medium=template_repos&utm_campaign=nextjs_template"
+            target="_blank"
+          >
+            Clerk Docs -&gt;
+          </Link>
+        </>
+      )}
+    </div>
+  );
+}