From 6e68051cb317470df5e1187664c5ad4df79c7cc3 Mon Sep 17 00:00:00 2001
From: Pau Matas <61761147+PauMatas@users.noreply.github.com>
Date: Thu, 4 Apr 2024 17:24:03 +0200
Subject: [PATCH] =?UTF-8?q?No=20avisa=20quan=20un=20fitxer=20=C3=A9s=20mas?=
 =?UTF-8?q?sa=20gran=20(#82)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 next.config.js                  |  9 ++++++++-
 src/app/api/uploadthing/core.ts |  8 ++++++--
 src/components/Form.tsx         | 32 ++++++++++++++++++++++++++------
 src/components/ui/Textarea.tsx  |  4 ++--
 src/config.ts                   |  3 +++
 5 files changed, 45 insertions(+), 11 deletions(-)

diff --git a/next.config.js b/next.config.js
index 569946b..d85bf1f 100644
--- a/next.config.js
+++ b/next.config.js
@@ -1,7 +1,14 @@
 /** @type {import('next').NextConfig} */
 const nextConfig = {
   images: {
-    domains: ["uploadthing.com", "lh3.googleusercontent.com"],
+    remotePatterns: [
+      {
+        hostname: "*.googleusercontent.com",
+      },
+      {
+        hostname: "uploadthing.com",
+      },
+    ],
   },
   experimental: {
     appDir: true,
diff --git a/src/app/api/uploadthing/core.ts b/src/app/api/uploadthing/core.ts
index fc6f42e..c95f7bb 100644
--- a/src/app/api/uploadthing/core.ts
+++ b/src/app/api/uploadthing/core.ts
@@ -1,6 +1,7 @@
 import { createUploadthing, type FileRouter } from "uploadthing/next"
 import { UploadThingError } from "uploadthing/server"
 import { getToken } from "next-auth/jwt"
+import { MAX_FILE_COUNT, MAX_FILE_SIZE_MB } from "@/config"
 
 const f = createUploadthing()
 
@@ -14,8 +15,11 @@ export const ourFileRouter = {
     .onUploadComplete(async ({}) => {}),
 
   fileUploader: f({
-    pdf: { maxFileCount: 10, maxFileSize: "32MB" },
-    text: { maxFileCount: 10, maxFileSize: "32MB" },
+    pdf: { maxFileCount: MAX_FILE_COUNT, maxFileSize: `${MAX_FILE_SIZE_MB}MB` },
+    text: {
+      maxFileCount: MAX_FILE_COUNT,
+      maxFileSize: `${MAX_FILE_SIZE_MB}MB`,
+    },
   })
     .middleware(async ({ req }) => {
       const user = await getToken({ req })
diff --git a/src/components/Form.tsx b/src/components/Form.tsx
index d784d8a..838b616 100644
--- a/src/components/Form.tsx
+++ b/src/components/Form.tsx
@@ -25,6 +25,7 @@ import { uploadFiles } from "@/lib/uploadthing"
 import Fireworks from "react-canvas-confetti/dist/presets/fireworks"
 import { MultiFileDropzone } from "@/components/MultiFileDropzone"
 import { Textarea } from "./ui/Textarea"
+import { MAX_FILE_COUNT, MAX_FILE_SIZE_MB } from "@/config"
 
 const formSchema = z.object({
   pdf: z.array(z.any()),
@@ -223,11 +224,26 @@ export function ProfileForm({
                 <FormItem>
                   <FormLabel>Fitxers PDF</FormLabel>
                   <FormControl>
-                    <div className="grid w-full max-w-sm items-center gap-1.5">
+                    <div className="w-full max-w-sm items-center gap-1.5">
                       <MultiFileDropzone
                         value={field.value}
                         onChange={(acceptedFiles) => {
-                          field.onChange(acceptedFiles)
+                          if (
+                            acceptedFiles.length > MAX_FILE_COUNT ||
+                            acceptedFiles.some(
+                              (file) => file.size >= MAX_FILE_SIZE_MB * 10 ** 6,
+                            )
+                          ) {
+                            toast({
+                              variant: "destructive",
+                              title: "Fitxers no vàlids",
+                              description:
+                                "Només pots pujar fins a 10 fitxers de menys de 32MB cada un.",
+                            })
+                            field.onChange([])
+                          } else {
+                            field.onChange(acceptedFiles)
+                          }
                         }}
                       />
                     </div>
@@ -250,7 +266,7 @@ export function ProfileForm({
                       <Input
                         placeholder="WhoIsGraf?"
                         {...field}
-                        className="mb-0"
+                        className="my-2"
                       />
                     </FormControl>
                     <FormMessage />
@@ -265,7 +281,7 @@ export function ProfileForm({
                     <FormControl>
                       <Textarea
                         placeholder="Descripció (opcional)"
-                        className="resize-none"
+                        className="resize-none my-2"
                         {...field}
                       />
                     </FormControl>
@@ -372,10 +388,14 @@ export function ProfileForm({
                 <FormItem>
                   <FormLabel>Email</FormLabel>
                   <FormControl>
-                    <Input placeholder="Gràcies per ajudar" {...field} />
+                    <Input placeholder="Uploader" {...field} />
                   </FormControl>
                   <FormDescription>
-                    Email de l&apos;autor/a dels apunts
+                    Aquest camp t&apos;apareix ja que ets admin i tens permís
+                    per a compartir apunts en nom d&apos;algú altre. Escriu
+                    &quot;Uploader&quot; si els comparteixes en nom teu.
+                    <br />
+                    Gràcies per ajudar!
                   </FormDescription>
                   <FormMessage />
                 </FormItem>
diff --git a/src/components/ui/Textarea.tsx b/src/components/ui/Textarea.tsx
index 9f9a6dc..227ca55 100644
--- a/src/components/ui/Textarea.tsx
+++ b/src/components/ui/Textarea.tsx
@@ -11,13 +11,13 @@ const Textarea = React.forwardRef<HTMLTextAreaElement, TextareaProps>(
       <textarea
         className={cn(
           "flex min-h-[80px] w-full rounded-md border border-input bg-background px-3 py-2 text-sm ring-offset-background placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50",
-          className
+          className,
         )}
         ref={ref}
         {...props}
       />
     )
-  }
+  },
 )
 Textarea.displayName = "Textarea"
 
diff --git a/src/config.ts b/src/config.ts
index cd179dc..ae7bd45 100644
--- a/src/config.ts
+++ b/src/config.ts
@@ -1,2 +1,5 @@
 export const INFINITE_SCROLL_PAGINATION_RESULTS = 4
 export const GCED_START = 2017
+
+export const MAX_FILE_COUNT = 10
+export const MAX_FILE_SIZE_MB = 32