Fixes broken accordion ref

Fixes broken poppable ref
adds Schema page
Fixes schema creation not including game system id

lib/accordion/index.tsx

@@ -6,17 +6,21 @@ interface IProps {
   title?: ReactNode;
 }
 
-export const Accordion: FC<PropsWithChildren<IProps>> = (
-  { children, expandOnHover, expanded, title },
-) => {
+export const Accordion: FC<PropsWithChildren<IProps>> = ({
+  children,
+  expandOnHover,
+  expanded,
+  title,
+}) => {
   const [open, setOpen] = useState(false);
 
   return (
     <div
       data-expanded={open || expanded}
       data-expandonhover={expandOnHover}
-      className={(expandOnHover ? "group/hover" : "group/controlled") +
-        " group"}
+      className={
+        (expandOnHover ? "group/hover" : "group/controlled") + " group"
+      }
       onClick={() => !title && !expandOnHover && setOpen(!open)}
     >
       {!!title && (
@@ -24,9 +28,7 @@ export const Accordion: FC<PropsWithChildren<IProps>> = (
           className="flex justify-between cursor-pointer"
           onClick={() => !expandOnHover && setOpen(!open)}
         >
-          <div className="accordion-title">
-            {title}
-          </div>
+          <div className="accordion-title">{title}</div>
           <div
             className={`
               group-hover/hover:-rotate-180
@@ -41,10 +43,8 @@ export const Accordion: FC<PropsWithChildren<IProps>> = (
               scale-y-50
             `}
           >
-            <span className="block w-2 h-2 rotate-45 border-r-2 border-b-2 place-self-center">
-            </span>
-            <span className="block w-2 h-2 rotate-45 border-r-2 border-b-2 place-self-center">
-            </span>
+            <span className="block w-2 h-2 rotate-45 border-r-2 border-b-2 place-self-center"></span>
+            <span className="block w-2 h-2 rotate-45 border-r-2 border-b-2 place-self-center"></span>
           </div>
         </div>
       )}
@@ -64,15 +64,15 @@ export const AccordionContent: FC<PropsWithChildren> = ({ children }) => {
     }
   }, []);
 
-  const Child = () => (
-    <div className="absolute bottom-0 w-full" ref={updateRef}>
-      {children}
-    </div>
-  );
-
   return (
     <div className="relative overflow-hidden">
-      {<Child />}
+      <div
+        key={"accordion-content"}
+        className="absolute bottom-0 w-full"
+        ref={updateRef}
+      >
+        {children}
+      </div>
       <span
         style={{ ["--v-height" as never]: height + "px" }}
         className="w-0 block h-0 group-hover/hover:h-variable group-data-[expanded]/controlled:h-variable transition-all duration-700"