Add team number

package.json

@@ -15,6 +15,7 @@
     "@headlessui/react": "^1.7.19",
     "@heroicons/react": "^2.2.0",
     "@monaco-editor/react": "^4.6.0",
+    "@radix-ui/react-aspect-ratio": "^1.1.1",
     "@radix-ui/react-checkbox": "^1.1.3",
     "@radix-ui/react-dialog": "^1.1.3",
     "@radix-ui/react-select": "^2.1.3",

src/components/Footer.tsx

@@ -1,10 +1,17 @@
+import { useQRScoutState } from '@/store/store';
+import { Heart } from 'lucide-react';
 import { Logo } from './Logo';
 
 export function Footer() {
+  const teamNumber = useQRScoutState(state => state.formData.teamNumber);
   return (
     <footer>
-      <div className="mt-8 flex h-24 flex-col items-center justify-center p-2">
-        <Logo />
+      <div className="mt-8 flex flex-col items-center justify-center p-2 gap-2">
+        <div className="h-24 w-96">
+          <Logo />
+        </div>
+        <Heart className="text-primary size-8 fill-primary" />
+        <span className="text-2xl text-primary font-rhr-ns">{teamNumber}</span>
       </div>
     </footer>
   );

src/components/inputs/BaseInputProps.ts

@@ -190,7 +190,6 @@ export const configSchema = z.object({
   teamNumber: z
     .number()
     .describe('The team number of the team using this form.')
-    .default(2713),
   sections: z.array(sectionSchema),
 });
 

src/components/ui/aspect-ratio.tsx

@@ -0,0 +1,5 @@
+import * as AspectRatioPrimitive from "@radix-ui/react-aspect-ratio"
+
+const AspectRatio = AspectRatioPrimitive.Root
+
+export { AspectRatio }