From f4db985695f498ae40ff22d32d5b2e9321cd684f Mon Sep 17 00:00:00 2001 From: Citali Date: Sun, 6 Jul 2025 10:52:05 +0200 Subject: [PATCH] modify commission ordering form --- prisma/schema.prisma | 85 +------------------ src/components/commissions/CommissionCard.tsx | 6 +- .../commissions/CommissionOrderForm.tsx | 20 +++-- src/components/commissions/FileDropzone.tsx | 65 +++++++++++--- 4 files changed, 73 insertions(+), 103 deletions(-) diff --git a/prisma/schema.prisma b/prisma/schema.prisma index dc6855f..f0f93f7 100644 --- a/prisma/schema.prisma +++ b/prisma/schema.prisma @@ -34,7 +34,7 @@ model CommissionOption { updatedAt DateTime @updatedAt sortIndex Int @default(0) - name String @unique + name String description String? @@ -47,7 +47,7 @@ model CommissionExtra { updatedAt DateTime @updatedAt sortIndex Int @default(0) - name String @unique + name String description String? @@ -91,84 +91,3 @@ model CommissionTypeExtra { @@unique([typeId, extraId]) } - -// model User { -// id String @id @default(cuid()) -// email String @unique -// name String? -// role Role @default(ADMIN) -// createdAt DateTime @default(now()) -// } - -// enum Role { -// ADMIN -// ARTIST -// } - -// model CommissionType { -// id String @id @default(cuid()) -// title String -// description String? -// basePrice Float -// deliveryEst String? // e.g. "2 weeks" -// tags String[] // e.g. shaded, sketch, full-body -// active Boolean @default(true) -// createdAt DateTime @default(now()) -// CommissionRequest CommissionRequest[] -// } - -// model CommissionRequest { -// id String @id @default(cuid()) -// name String -// email String -// message String -// typeId String -// status RequestStatus @default(PENDING) -// createdAt DateTime @default(now()) - -// type CommissionType @relation(fields: [typeId], references: [id]) -// } - -// enum RequestStatus { -// PENDING -// ACCEPTED -// IN_PROGRESS -// DONE -// REJECTED -// } - -// model Artwork { -// id String @id @default(cuid()) -// title String -// imageUrl String -// description String? -// tags String[] -// formats String[] -// isPublic Boolean @default(true) -// groupId String? -// createdAt DateTime @default(now()) - -// group PresentationGroup? @relation(fields: [groupId], references: [id]) -// } - -// model PresentationGroup { -// id String @id @default(cuid()) -// name String -// description String? -// createdAt DateTime @default(now()) -// Artwork Artwork[] -// } - -// model Preferences { -// id String @id @default(cuid()) -// commissionOpen Boolean @default(true) -// defaultDelivery String? // e.g. "7 days" -// autoReplyMessage String? -// notifyByEmail Boolean @default(true) -// } - -// model TOS { -// id String @id @default(cuid()) -// content String // Markdown or rich text -// createdAt DateTime @default(now()) -// } diff --git a/src/components/commissions/CommissionCard.tsx b/src/components/commissions/CommissionCard.tsx index 76ab9ff..d7a9dc0 100644 --- a/src/components/commissions/CommissionCard.tsx +++ b/src/components/commissions/CommissionCard.tsx @@ -3,7 +3,7 @@ import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card" import { CommissionExtra, CommissionOption, CommissionType, CommissionTypeExtra, CommissionTypeOption } from "@/generated/prisma" // import { useState } from "react" -import { Badge } from "../ui/badge" +// import { Badge } from "../ui/badge" type CommissionTypeWithItems = CommissionType & { options: (CommissionTypeOption & { @@ -85,13 +85,13 @@ export function CommissionCard({ commission }: { commission: CommissionTypeWithI -
+ {/*
{commission.extras.map((extra) => ( {extra.extra?.name} ))} -
+
*/} diff --git a/src/components/commissions/CommissionOrderForm.tsx b/src/components/commissions/CommissionOrderForm.tsx index 232b8b1..c13b018 100644 --- a/src/components/commissions/CommissionOrderForm.tsx +++ b/src/components/commissions/CommissionOrderForm.tsx @@ -77,7 +77,6 @@ export function CommissionOrderForm({ types }: Props) { async function onSubmit(values: z.infer) { console.log("Submit:", { ...values, files }) - // TODO: send to server } return ( @@ -220,12 +219,23 @@ export function CommissionOrderForm({ types }: Props) { )} /> -
+ Reference Images - setFiles(f)} /> -
+ +
+ + {files.length > 0 && ( +
    + {files.map((file, i) => ( +
  • {file.name}
    • + ))} +
+ )} +
+ + -
+
Estimated Price: €{price.toFixed(2)}
diff --git a/src/components/commissions/FileDropzone.tsx b/src/components/commissions/FileDropzone.tsx index 257731d..e0d2f14 100644 --- a/src/components/commissions/FileDropzone.tsx +++ b/src/components/commissions/FileDropzone.tsx @@ -1,24 +1,65 @@ -// components/form/FileDropzone.tsx "use client" -import { useCallback } from "react" + +import { cn } from "@/lib/utils" +import { useCallback, useRef, useState } from "react" export function FileDropzone({ onFilesSelected, }: { onFilesSelected: (files: File[]) => void }) { - const handleChange = useCallback((e: React.ChangeEvent) => { - if (e.target.files) { - onFilesSelected(Array.from(e.target.files)) + const [isDragging, setIsDragging] = useState(false) + const inputRef = useRef(null) + + const handleFiles = (files: FileList | null) => { + if (files) { + onFilesSelected(Array.from(files)) } - }, [onFilesSelected]) + } + + const handleDrop = (e: React.DragEvent) => { + e.preventDefault() + setIsDragging(false) + handleFiles(e.dataTransfer.files) + } + + const handleDragOver = (e: React.DragEvent) => { + e.preventDefault() + setIsDragging(true) + } + + const handleDragLeave = () => { + setIsDragging(false) + } + + const handleChange = useCallback( + (e: React.ChangeEvent) => { + handleFiles(e.target.files) + }, + [onFilesSelected] + ) return ( - +
inputRef.current?.click()} + onDrop={handleDrop} + onDragOver={handleDragOver} + onDragLeave={handleDragLeave} + className={cn( + "w-full border-2 border-dashed rounded-md p-6 text-center cursor-pointer transition-colors", + isDragging ? "border-primary bg-muted" : "border-muted-foreground/30" + )} + > + +

+ Drag & drop images here or click to upload +

+
) }