Work on ecommerce image upload

app/ecommerce/api/uploadthing/core.ts

@@ -1,24 +1,18 @@
 import { createUploadthing, type FileRouter } from "uploadthing/next";
-import { UploadThingError } from "uploadthing/server";
 import { z } from "zod";
 
 const f = createUploadthing();
 
-const auth = (req: Request) => ({ id: "fakeId" }); // Fake auth function
-
 // This runs on the server but because it is all in one repository we get the type safety in the frontend
 export const ourFileRouter = {
   imageUploader: f({ image: { maxFileSize: "4MB" } })
     .input(z.object({ configId: z.string().optional() }))
-    .middleware(async ({ req }) => {
-      const user = await auth(req);
-
-      if (!user) throw new UploadThingError("Unauthorized");
-
-      return { userId: user.id };
+    .middleware(async ({ input }) => {
+      return { input }
     })
     .onUploadComplete(async ({ metadata, file }) => {
-      return { uploadedBy: metadata.userId };
+      const { configId } = metadata.input;
+      return { configId };
     }),
 } satisfies FileRouter;
 

app/ecommerce/configure/upload/page.tsx

@@ -6,14 +6,22 @@ import Dropzone, { FileRejection } from "react-dropzone";
 import { Image, Loader2, MousePointerSquareDashed } from "lucide-react";
 import { Progress } from "../../components/progress";
 import { useUploadThing } from "../../lib/uploadthing";
+import { useRouter } from "next/navigation";
 
 const Page = () => {
     const [isDragOver, setIsDragOver] = useState<boolean>(false);
     const [uploadProgress, setUploadProgress] = useState<number>(0);
+    const router = useRouter();
 
     const {} = useUploadThing("imageUploader", {
         onClientUploadComplete: ([data]) => {
-
+            const configId = data.serverData.configId;
+            startTransition(() => {
+                router.push(`/configure/design?id=${configId}`)
+            })
+        },
+        onUploadProgress(p) {
+            setUploadProgress(p);
         }
     })