add proper carousel to store page

uses the VueCarousel library to add an actual carousel to the store page
for the images. uses responsive styles

server/api/v1/auth/signup/simple.post.ts

@@ -1,18 +1,69 @@
-import { AuthMec } from "@prisma/client";
+import { AuthMec, Invitation } from "@prisma/client";
 import { Readable } from "stream";
 import prisma from "~/server/internal/db/database";
 import { createHash } from "~/server/internal/security/simple";
 import { v4 as uuidv4 } from "uuid";
+import { KeyOfType } from "~/server/internal/utils/types";
+
+// Only really a simple test, in case people mistype their emails
+const mailRegex = /^\S+@\S+\.\S+$/g;
 
 export default defineEventHandler(async (h3) => {
   const body = await readBody(h3);
 
-  const username = body.username;
-  const password = body.password;
-  if (username === undefined || password === undefined)
+  const invitationId = body.invitation;
+  if (!invitationId)
     throw createError({
-      statusCode: 403,
-      statusMessage: "Username or password missing from request.",
+      statusCode: 401,
+      statusMessage: "Invalid or expired invitation.",
+    });
+
+  const invitation = await prisma.invitation.findUnique({
+    where: { id: invitationId },
+  });
+  if (!invitation)
+    throw createError({
+      statusCode: 401,
+      statusMessage: "Invalid or expired invitation.",
+    });
+
+  const useInvitationOrBodyRequirement = (
+    field: keyof Invitation,
+    check: (v: string) => boolean
+  ) => {
+    if (invitation[field]) {
+      return invitation[field].toString();
+    }
+
+    const v: string = body[field]?.toString();
+    const valid = check(v);
+    return valid ? v : undefined;
+  };
+
+  const username = useInvitationOrBodyRequirement(
+    "username",
+    (e) => e.length > 5
+  );
+  const email = useInvitationOrBodyRequirement("email", (e) =>
+    mailRegex.test(e)
+  );
+  const password = body.password;
+  if (username === undefined)
+    throw createError({
+      statusCode: 400,
+      statusMessage: "Username is invalid. Must be more than 5 characters.",
+    });
+
+  if (email === undefined)
+    throw createError({
+      statusCode: 400,
+      statusMessage: "Invalid email. Must follow the format you@example.com",
+    });
+
+  if (!password)
+    throw createError({
+      statusCode: 400,
+      statusMessage: "Password empty or missing.",
     });
 
   const existing = await prisma.user.count({ where: { username: username } });
@@ -32,7 +83,7 @@ export default defineEventHandler(async (h3) => {
         responseType: "stream",
       }),
     {},
-    [`anonymous:read`, `${userId}:write`],
+    [`anonymous:read`, `${userId}:write`]
   );
   const user = await prisma.user.create({
     data: {