add edit page button

src/components/admin/ControlBar.tsx

@@ -7,10 +7,11 @@ const AdminBarLayout = ({
 }) => {
   return (
     <div className="relative">
-      <div className="sticky left-0 right-0 top-[71px] z-10 mx-auto mb-8 mt-[15px] flex max-w-4xl flex-row rounded-xl border border-neutral-600 bg-red-300 drop-shadow-xl">
+      <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>
       {children}
     </div>

src/components/admin/common.tsx

@@ -0,0 +1,27 @@
+import Link from "next/link";
+
+const AdminActionLink = ({
+  label,
+  href,
+  symbol,
+}: {
+  label: string;
+  href: string;
+  symbol: JSX.Element | undefined;
+}) => {
+  return (
+    <Link
+      className="py-auto group my-auto h-full space-x-2 rounded-lg border border-neutral-400 bg-neutral-800 px-2 hover:border-neutral-800 hover:bg-white"
+      href={href}
+    >
+      <span className="my-auto inline-block h-fit align-middle text-sm leading-8 text-white group-hover:text-black">
+        {label}
+      </span>
+      <span className="inline-block align-middle text-white group-hover:text-black">
+        {symbol}
+      </span>
+    </Link>
+  );
+};
+
+export { AdminActionLink };