4 multiples pdfs (#79)

* update: uploadthing to latest

* checkpoint: form, api/post/create and dropzone ready. BD and PostView have to be adapted.

* add: new column in Post with correct values

* feat: all scripts adapted to urls

Maybe it is time to do files instead of urls

* refactor: urls (string[]) to files (File[])

.gitignore

@@ -37,4 +37,3 @@ next-env.d.ts
 
 userbase.csv
 pscale_dump_apunts-dades_main_20240310_112108
-prisma/migrations

package.json

@@ -11,7 +11,8 @@
  "lint": "next lint",
  "postinstall": "prisma generate",
  "format": "prettier --write .",
- "prepare": "husky"
+ "prepare": "husky",
+ "post-files-from-content": "node scripts/post-files-from-content.js"
  },
  "prisma": {
  "seed": "node prisma/seed.js"
@@ -60,7 +61,7 @@
  "@types/node": "20.2.5",
  "@types/react": "18.2.7",
  "@types/react-dom": "18.2.4",
- "@uploadthing/react": "^4.1.3",
+ "@uploadthing/react": "^6.4.0",
  "@upstash/redis": "^1.21.0",
  "autoprefixer": "10.4.14",
  "axios": "^1.4.0",
@@ -83,7 +84,7 @@
  "react-dom": "^18.2.0",
  "react-dropzone": "^14.2.3",
  "react-hook-form": "^7.50.1",
- "react-pdf": "^7.7.0",
+ "react-pdf": "^7.7.1",
  "react-textarea-autosize": "^8.4.1",
  "readline-sync": "^1.4.10",
  "server-only": "^0.0.1",
@@ -93,7 +94,7 @@
  "tailwindcss-animate": "^1.0.5",
  "ts-node": "^9.1.1",
  "typescript": "5.0.4",
- "uploadthing": "^4.1.3",
+ "uploadthing": "^6.6.0",
  "yarn": "^1.22.21",
  "zod": "^3.22.4"
  },

prisma/schema.prisma

@@ -42,7 +42,7 @@ model User {
  username String? @unique
  generacio Int @default(2020)
  image String?
- isAdmin Boolean @default(false)
+ isAdmin  Boolean @default(false)
  accounts Account[]
  sessions Session[]
  posts Post[]
@@ -97,21 +97,22 @@ model Question {
 }
 
 model Post {
- id String @id @default(cuid())
- title String
- content String?
- createdAt DateTime @default(now())
- updatedAt DateTime @updatedAt
- subjectId String
- authorId String
- tipus TipusType
- year Int
+ id String @id @default(cuid())
+ title String
+ content String?
+ files Json @default(dbgenerated())
+ createdAt DateTime @default(now())
+ updatedAt DateTime @updatedAt
+ subjectId String
+ authorId String
+ tipus TipusType
+ year Int
+ isAnonymous Boolean @default(false)
  NonUploaderAuthorEmail String?
- isAnonymous Boolean @default(false)
- subject Subject @relation(fields: [subjectId], references: [id])
- author User @relation(fields: [authorId], references: [id])
- comments Comment[]
- votes PostVote[]
+ subject Subject @relation(fields: [subjectId], references: [id])
+ author User @relation(fields: [authorId], references: [id])
+ comments Comment[]
+ votes PostVote[]
 
  @@index([title])
 }

scripts/post-files-from-content.js

@@ -0,0 +1,39 @@
+const { PrismaClient } = require("@prisma/client")
+const { default: axios } = require("axios")
+
+const prisma = new PrismaClient()
+
+async function updateRecords() {
+ try {
+ const recordsToUpdate = await prisma.Post.findMany()
+
+ for (const record of recordsToUpdate) {
+ const response = await axios.get(record.content, {
+ responseType: "blob",
+ })
+ const fileObject = new File([response.data], "PDF Sense Nom")
+
+ await prisma.Post.update({
+ where: { id: record.id },
+ data: {
+ files: JSON.stringify([
+ {
+ name: fileObject.name,
+ size: fileObject.size,
+ type: fileObject.type,
+ url: record.content,
+ },
+ ]),
+ },
+ })
+ }
+
+ console.log("Records updated successfully.")
+ } catch (error) {
+ console.error("Error updating records:", error)
+ } finally {
+ await prisma.$disconnect()
+ }
+}
+
+updateRecords()

src/app/api/subject/post/create/route.ts

@@ -62,7 +62,16 @@ export async function POST(req: Request) {
  await db.post.create({
  data: {
  title: title,
- content: pdf,
+ files: JSON.stringify(
+ pdf.map((file) => {
+ return {
+ name: file.name,
+ size: file.size,
+ type: file.type,
+ url: file.url,
+ }
+ }),
+ ),
  subjectId: subject.id,
  authorId: authorId,
  tipus: tipus as TipusType,

src/app/api/subject/post/vote/route.ts

@@ -63,7 +63,6 @@ export async function PATCH(req: Request) {
  if (votesAmt >= CACHE_AFTER_UPVOTES) {
  const cachePayload: CachedPost = {
  authorName: post.author.name ?? "",
- content: post.content ?? "",
  id: post.id,
  title: post.title,
  currentVote: null,
@@ -99,7 +98,6 @@ export async function PATCH(req: Request) {
  if (votesAmt >= CACHE_AFTER_UPVOTES) {
  const cachePayload: CachedPost = {
  authorName: post.author.name ?? "",
- content: post.content ?? "",
  id: post.id,
  title: post.title,
  currentVote: voteType,
@@ -131,7 +129,6 @@ export async function PATCH(req: Request) {
  if (votesAmt >= CACHE_AFTER_UPVOTES) {
  const cachePayload: CachedPost = {
  authorName: post.author.name ?? "",
- content: post.content ?? "",
  id: post.id,
  title: post.title,
  currentVote: voteType,

src/app/api/uploadthing/core.ts

@@ -1,38 +1,25 @@
 import { createUploadthing, type FileRouter } from "uploadthing/next"
-import { UploadThingError } from "@uploadthing/shared"
+import { UploadThingError } from "uploadthing/server"
 import { getToken } from "next-auth/jwt"
 
 const f = createUploadthing()
 
-// FileRouter for your app, can contain multiple FileRoutes
 export const ourFileRouter = {
- // Define as many FileRoutes as you like, each with a unique routeSlug
  imageUploader: f({ image: { maxFileSize: "4MB" } })
- // Set permissions and file types for this FileRoute
- .middleware(async (req) => {
- // This code runs on your server before upload
+ .middleware(async ({ req }) => {
  const user = await getToken({ req })
-
- // If you throw, the user will not be able to upload
- if (!user)
- throw new UploadThingError({
- code: "FORBIDDEN",
- message: "Unauthorized",
- })
-
- // Whatever is returned here is accessible in onUploadComplete as `metadata`
+ if (!user) throw new UploadThingError("Unauthorized")
  return { userId: user.id }
  })
  .onUploadComplete(async ({}) => {}),
 
- // Another FileRoute (made by myself, not by the library)
  fileUploader: f({
- pdf: { maxFileCount: 1, maxFileSize: "128MB" },
- text: { maxFileCount: 5 },
+ pdf: { maxFileCount: 10, maxFileSize: "32MB" },
+ text: { maxFileCount: 10, maxFileSize: "32MB" },
  })
- .middleware(async (req) => {
+ .middleware(async ({ req }) => {
  const user = await getToken({ req })
- if (!user) throw new UploadThingError({ code: "FORBIDDEN" })
+ if (!user) throw new UploadThingError("Unauthorized")
  return { userId: user.id }
  })
  .onUploadComplete(async ({}) => {}),

src/app/api/uploadthing/route.ts

@@ -1,8 +1,7 @@
-import { createNextRouteHandler } from "uploadthing/next"
+import { createRouteHandler } from "uploadthing/next"
 
 import { ourFileRouter } from "./core"
 
-// Export routes for Next App Router
-export const { GET, POST } = createNextRouteHandler({
+export const { GET, POST } = createRouteHandler({
  router: ourFileRouter,
 })

src/components/Form.tsx

@@ -23,9 +23,10 @@ import { Checkbox } from "@/components/ui/checkbox"
 import { ApuntsPostCreationRequest } from "@/lib/validators/post"
 import { uploadFiles } from "@/lib/uploadthing"
 import Fireworks from "react-canvas-confetti/dist/presets/fireworks"
+import { MultiFileDropzone } from "@/components/MultiFileDropzone"
 
 const formSchema = z.object({
- pdf: z.any(),
+ pdf: z.array(z.any()),
  title: z.string({
  required_error: "Selecciona un títol",
  }),
@@ -43,6 +44,7 @@ const formSchema = z.object({
  required_error: "Selecciona un email",
  }),
 })
+type FormSchemaType = z.infer<typeof formSchema>
 
 export function ProfileForm({
  PreselectedSubject,
@@ -123,10 +125,12 @@ export function ProfileForm({
  form.setValue("authorEmail", "Uploader")
  }
  }, [form, isAdmin])
- async function onSubmit(data: ApuntsPostCreationRequest) {
- const [res] = await uploadFiles([data.pdf], "fileUploader")
+ async function onSubmit(data: FormSchemaType) {
+ const res = await uploadFiles("fileUploader", {
+ files: data.pdf,
+ })
  const payload: ApuntsPostCreationRequest = {
- pdf: res.fileUrl,
+ pdf: res,
  title: data.title,
  year: Number(data.year),
  assignatura: data.assignatura,
@@ -233,13 +237,10 @@ export function ProfileForm({
  <FormLabel>Fitxers PDF</FormLabel>
  <FormControl>
  <div className="grid w-full max-w-sm items-center gap-1.5">
- <Input
- id="pdf-file"
- type="file"
- onChange={(e) => {
- if (e.target.files) {
- field.onChange(e.target.files[0])
- }
+ <MultiFileDropzone
+ value={field.value}
+ onChange={(acceptedFiles) => {
+ field.onChange(acceptedFiles)
  }}
  />
  </div>