diff --git a/src/components/ProjectForm.tsx b/src/components/ProjectForm.tsx index f02ca8a..179e246 100644 --- a/src/components/ProjectForm.tsx +++ b/src/components/ProjectForm.tsx @@ -31,7 +31,7 @@ import { PopoverTrigger, } from "@/components/ui/popover"; import { cn } from "@/lib/utils"; -import { ChevronsUpDown, Check } from "lucide-react"; +import { ChevronsUpDown, Check, X } from "lucide-react"; type projectSchema = z.infer; type FieldType = ControllerRenderProps; @@ -55,7 +55,7 @@ const ProjectForm = ({ const [projectPitchFile, setProjectPitchFile] = useState(""); const [tag, setTag] = useState<{ id: number; value: string }[]>([]); const [open, setOpen] = useState(false); - const [selectedTag, setSelectedTag] = useState(""); + const [selectedTag, setSelectedTag] = useState([]); const handleFileChange = ( event: React.ChangeEvent, @@ -485,7 +485,7 @@ const ProjectForm = ({ {/* Tags */} (
@@ -500,29 +500,29 @@ const ProjectForm = ({ aria-expanded={open} className="w-96 justify-between" > - {selectedTag - ? tag.find( - (framework) => framework.value === selectedTag - )?.value - : "Select framework..."} + {selectedTag.length > 0 + ? selectedTag.join(", ") + : "Select tags..."} - + - No tag found. + No tags found. {tag.map((tag) => ( { - setSelectedTag( - currentValue === selectedTag - ? "" - : currentValue + setSelectedTag((prev) => + prev.includes(currentValue) + ? prev.filter( + (item) => item !== currentValue + ) + : [...prev, currentValue] ); setOpen(false); }} @@ -530,7 +530,7 @@ const ProjectForm = ({ - What is the deadline for your fundraising project? - Setting
a clear timeline can help motivate - potential investors. + Add 1 to 5 tags that describe your project. Tags help{" "} +
+ investors understand your focus.
+ + {/* display selected tags */} +
+ {selectedTag.map((tag) => ( +
+ {tag} + +
+ ))} +
@@ -555,14 +577,12 @@ const ProjectForm = ({
)} /> -
- -
+ diff --git a/src/types/schemas/application.schema.ts b/src/types/schemas/application.schema.ts index 1111349..509ab51 100644 --- a/src/types/schemas/application.schema.ts +++ b/src/types/schemas/application.schema.ts @@ -90,6 +90,10 @@ const projectFormSchema = z.object({ .refine((date) => date > new Date(), { message: "Deadline must be in the future.", }), + tag: z + .array(z.string()) + .min(1, "Please provide at least one tag.") + .max(5, "You can provide up to 5 tags."), }); const businessFormSchema = z.object({