Admin dashboard links

apps/web/src/routes/_protected/community.tsx → apps/web/src/routes/_main/community.tsx

@@ -1,6 +1,6 @@
 import { createFileRoute } from "@tanstack/react-router";
 
-export const Route = createFileRoute("/_protected/community")({
+export const Route = createFileRoute("/_main/community")({
   component: RouteComponent,
 });
 

apps/web/src/routes/_protected/layout.tsx → apps/web/src/routes/_main/layout.tsx

@@ -4,15 +4,17 @@ import {
   Outlet,
   redirect,
   useLocation,
+  useRouter,
 } from "@tanstack/react-router";
 import TablerLayoutCollage from "~icons/tabler/layout-collage";
 import TablerBooks from "~icons/tabler/books";
 import TablerSocial from "~icons/tabler/social";
 import { AppShell } from "@/components/AppShell/AppShell";
+import { Link } from "react-aria-components";
 
 // This layout component performs authentication checks before the user can access protected pages
-export const Route = createFileRoute("/_protected")({
-  beforeLoad: async ({ context }) => {
+export const Route = createFileRoute("/_main")({
+  beforeLoad: async ({ context, location }) => {
     const { user, error } = await context.userQuery.promise;
 
     // Unauthenticated, return to login page
@@ -44,18 +46,30 @@ export const Route = createFileRoute("/_protected")({
 });
 
 function RouteComponent() {
+  const { user } = Route.useRouteContext();
   const pathname = useLocation({ select: (loc) => loc.pathname });
+  const router = useRouter();
 
   return (
     <AppShell>
       <AppShell.Header>
         <div className="w-full px-4 flex flex-row justify-between h-full items-center">
           <h1 className=" text-2xl font-bold">SwampHacks</h1>
 
-          <img
-            src="https://i.pinimg.com/736x/8b/d2/f6/8bd2f653f38322972e404925ab67294a.jpg"
-            className="h-5/8 aspect-square rounded-full"
-          />
+          <div className="flex items-center h-full flex-row gap-6">
+            {user?.role === "superuser" && (
+              <Link
+                onClick={() => router.navigate({ to: "/admin" })}
+                className="text-sm text-blue-500 select-none cursor-pointer hover:underline"
+              >
+                To Admin Portal
+              </Link>
+            )}
+            <img
+              src="https://i.pinimg.com/736x/8b/d2/f6/8bd2f653f38322972e404925ab67294a.jpg"
+              className="h-5/8 aspect-square rounded-full"
+            />
+          </div>
         </div>
       </AppShell.Header>
 

apps/web/src/routes/_protected/portal.tsx → apps/web/src/routes/_main/portal.tsx

@@ -2,7 +2,7 @@ import { Button } from "@/components/ui/Button";
 import { auth } from "@/lib/authClient";
 import { createFileRoute } from "@tanstack/react-router";
 
-export const Route = createFileRoute("/_protected/portal")({
+export const Route = createFileRoute("/_main/portal")({
   component: RouteComponent,
 });
 

apps/web/src/routes/_protected/resources/programming.tsx → apps/web/src/routes/_main/resources/programming.tsx

@@ -1,6 +1,6 @@
 import { createFileRoute } from "@tanstack/react-router";
 
-export const Route = createFileRoute("/_protected/resources/programming")({
+export const Route = createFileRoute("/_main/resources/programming")({
   component: RouteComponent,
 });
 

apps/web/src/routes/_protected/resources/sponsors.tsx → apps/web/src/routes/_main/resources/sponsors.tsx

@@ -1,6 +1,6 @@
 import { createFileRoute } from "@tanstack/react-router";
 
-export const Route = createFileRoute("/_protected/resources/sponsors")({
+export const Route = createFileRoute("/_main/resources/sponsors")({
   component: RouteComponent,
 });
 

apps/web/src/routes/admin/layout.tsx

@@ -12,10 +12,10 @@ import TablerCalendarSearch from "~icons/tabler/calendar-search";
 import TablerUsers from "~icons/tabler/users";
 import TablerListDetails from "~icons/tabler/list-details";
 import TablerSettings2 from "~icons/tabler/settings-2";
-import { Button } from "@/components/ui/Button";
+import { Link } from "react-aria-components";
 
 export const Route = createFileRoute("/admin")({
-  beforeLoad: async ({ context }) => {
+  beforeLoad: async ({ context, location }) => {
     const { user, error } = await context.userQuery.promise;
 
     if (!user && !user) {
@@ -63,13 +63,13 @@ function RouteComponent() {
         <div className="w-full px-4 flex flex-row justify-between h-full items-center">
           <h1 className=" text-2xl font-bold">Admin Portal</h1>
 
-          <div className="h-full flex items-center gap-4">
-            <Button
-              color="danger"
-              onPress={() => router.navigate({ to: "/portal" })}
+          <div className="flex items-center h-full flex-row gap-6">
+            <Link
+              onClick={() => router.navigate({ to: "/portal" })}
+              className="text-sm text-blue-500 select-none cursor-pointer hover:underline"
             >
-              Back
-            </Button>
+              Back to User Portal
+            </Link>
             <img
               src="https://i.pinimg.com/736x/8b/d2/f6/8bd2f653f38322972e404925ab67294a.jpg"
               className="h-5/8 aspect-square rounded-full"