control bar shows conditionally based on if user is signed in

src/components/admin/ControlBar.tsx

@@ -1,3 +1,5 @@
+import { useSession } from "next-auth/react";
+
 const AdminBarLayout = ({
   actions,
   children,
@@ -5,14 +7,18 @@ const AdminBarLayout = ({
   actions: JSX.Element | JSX.Element[];
   children: JSX.Element | JSX.Element[];
 }) => {
+  const { data } = useSession();
+
   return (
     <div className="relative">
-      <div className="sticky left-0 right-0 top-[71px] z-10 mx-auto mb-6 mt-[15px] flex max-w-4xl flex-row justify-between rounded-xl border border-neutral-600 bg-red-300 drop-shadow-xl">
-        <h1 className="rounded-lg px-4 py-2 font-semibold text-black">
-          Admin Mode
-        </h1>
-        <div className="flex flex-row space-x-2 p-1">{actions}</div>
-      </div>
+      {data?.user ? (
+        <div className="sticky left-0 right-0 top-[71px] z-10 mx-auto mb-6 mt-[15px] flex max-w-4xl flex-row justify-between rounded-xl border border-neutral-600 bg-red-300 drop-shadow-xl">
+          <h1 className="rounded-lg px-4 py-2 font-semibold text-black">
+            Admin Mode
+          </h1>
+          <div className="flex flex-row space-x-2 p-1">{actions}</div>
+        </div>
+      ) : undefined}
       {children}
     </div>
   );

src/pages/resources/[id]/edit.tsx

@@ -0,0 +1,13 @@
+import Footer from "~/components/Footer";
+import Header from "~/components/Header";
+
+const EditResourcePage = () => {
+  return (
+    <>
+      <Header />
+      <Footer />
+    </>
+  );
+};
+
+export default EditResourcePage;

src/pages/resources/[id]/index.tsx

@@ -13,6 +13,7 @@ import Footer from "~/components/Footer";
 import Header from "~/components/Header";
 import { AdminBarLayout } from "~/components/admin/ControlBar";
 import { AdminActionLink } from "~/components/admin/common";
+import { useRouter } from "next/router";
 
 export const getStaticPaths = async () => {
   const resources = await prisma.auditoryResource.findMany({
@@ -127,6 +128,7 @@ const ResourceViewPage = (
 ) => {
   const { id } = props;
   const resourceQuery = api.auditoryResource.byId.useQuery({ id });
+  const router = useRouter();
 
   if (!resourceQuery.data) {
     return <></>;
@@ -141,7 +143,7 @@ const ResourceViewPage = (
             <AdminActionLink
               symbol={<PencilSquareIcon className="w-4" />}
               label="Edit Page"
-              href="/"
+              href={`${router.asPath}/edit`}
             />
           }
         >