Update package.json and package-lock.json

This commit is contained in:
THIS ONE IS A LITTLE BIT TRICKY KRUB 2024-10-09 16:19:13 +07:00
parent c93b05ab45
commit dfefe603cf
3 changed files with 369 additions and 321 deletions

17
package-lock.json generated
View File

@ -38,6 +38,7 @@
"react": "^18", "react": "^18",
"react-countup": "^6.5.3", "react-countup": "^6.5.3",
"react-dom": "^18", "react-dom": "^18",
"react-hook-form": "^7.53.0",
"react-hot-toast": "^2.4.1", "react-hot-toast": "^2.4.1",
"react-markdown": "^9.0.1", "react-markdown": "^9.0.1",
"recharts": "^2.12.7", "recharts": "^2.12.7",
@ -6465,6 +6466,22 @@
"react": "^18.3.1" "react": "^18.3.1"
} }
}, },
"node_modules/react-hook-form": {
"version": "7.53.0",
"resolved": "https://registry.npmjs.org/react-hook-form/-/react-hook-form-7.53.0.tgz",
"integrity": "sha512-M1n3HhqCww6S2hxLxciEXy2oISPnAzxY7gvwVPrtlczTM/1dDadXgUxDpHMrMTblDOcm/AXtXxHwZ3jpg1mqKQ==",
"license": "MIT",
"engines": {
"node": ">=18.0.0"
},
"funding": {
"type": "opencollective",
"url": "https://opencollective.com/react-hook-form"
},
"peerDependencies": {
"react": "^16.8.0 || ^17 || ^18 || ^19"
}
},
"node_modules/react-hot-toast": { "node_modules/react-hot-toast": {
"version": "2.4.1", "version": "2.4.1",
"resolved": "https://registry.npmjs.org/react-hot-toast/-/react-hot-toast-2.4.1.tgz", "resolved": "https://registry.npmjs.org/react-hot-toast/-/react-hot-toast-2.4.1.tgz",

View File

@ -39,6 +39,7 @@
"react": "^18", "react": "^18",
"react-countup": "^6.5.3", "react-countup": "^6.5.3",
"react-dom": "^18", "react-dom": "^18",
"react-hook-form": "^7.53.0",
"react-hot-toast": "^2.4.1", "react-hot-toast": "^2.4.1",
"react-markdown": "^9.0.1", "react-markdown": "^9.0.1",
"recharts": "^2.12.7", "recharts": "^2.12.7",

View File

@ -14,10 +14,13 @@ import {
import { createSupabaseClient } from "@/lib/supabase/clientComponentClient"; import { createSupabaseClient } from "@/lib/supabase/clientComponentClient";
import { useEffect, useState } from "react"; import { useEffect, useState } from "react";
import { Textarea } from "@/components/ui/textarea"; import { Textarea } from "@/components/ui/textarea";
import { useForm } from "react-hook-form";
export default function Apply() { export default function Apply() {
let supabase = createSupabaseClient(); let supabase = createSupabaseClient();
const { register, handleSubmit, setValue } = useForm();
const [industry, setIndustry] = useState<string[]>([]); const [industry, setIndustry] = useState<string[]>([]);
const [selectedIndustry, setSelectedIndustry] = useState("");
const [isInUS, setIsInUS] = useState(""); const [isInUS, setIsInUS] = useState("");
const [isForSale, setIsForSale] = useState(""); const [isForSale, setIsForSale] = useState("");
const [isGenerating, setIsGenarting] = useState(""); const [isGenerating, setIsGenarting] = useState("");
@ -34,6 +37,13 @@ export default function Apply() {
"100K+", "100K+",
]; ];
const onSubmit = (data: any) => {
alert(JSON.stringify(data));
};
const handleSelectChange = (value: string) => {
setSelectedIndustry(value);
setValue("industry", value);
};
const fetchIndustry = async () => { const fetchIndustry = async () => {
let { data: BusinessType, error } = await supabase let { data: BusinessType, error } = await supabase
.from("BusinessType") .from("BusinessType")
@ -83,339 +93,359 @@ export default function Apply() {
</p> </p>
</div> </div>
</div> </div>
<div className="grid grid-flow-row auto-rows-max w-3/4 ml-48"> {/* form */}
<h1 className="text-3xl font-bold mt-10 ml-96">About your company</h1> <form action="" onSubmit={handleSubmit(onSubmit)}>
<p className="ml-96 mt-5 text-neutral-500"> <div className="grid grid-flow-row auto-rows-max w-3/4 ml-48">
All requested information in this section is required. <h1 className="text-3xl font-bold mt-10 ml-96">About your company</h1>
</p> <p className="ml-96 mt-5 text-neutral-500">
{/* form */} All requested information in this section is required.
{/* company name */}
<div className="ml-96 mt-5 space-y-10">
<div className="mt-10 space-y-5">
<Label htmlFor="companyName" className="font-bold text-lg">
Company name
</Label>
<div className="flex space-x-5">
<Input type="text" id="companyName" className="w-96" />
<span className="text-[12px] text-neutral-500 self-center">
This should be the name your company uses on your <br />
website and in the market.
</span>
</div>
</div>
{/* industry */}
<div className="mt-10 space-y-5">
<Label htmlFor="industry" className="font-bold text-lg mt-10">
Industry
</Label>
<div className="flex space-x-5">
<Select>
<SelectTrigger className="w-96">
<SelectValue placeholder="Select an industry" />
</SelectTrigger>
<SelectContent>
<SelectGroup>
<SelectLabel>Industry</SelectLabel>
{industry.map((i) => (
<SelectItem value={i}>{i}</SelectItem>
))}
</SelectGroup>
</SelectContent>
</Select>
<span className="text-[12px] text-neutral-500 self-center">
Choose the industry that best aligns with your business.
</span>
</div>
</div>
{/* How much money has your company raised to date? */}
<div className="space-y-5">
<Label htmlFor="companyName" className="font-bold text-lg">
How much money has your company <br /> raised to date?
</Label>
<div className="flex space-x-5">
<Input
type="text"
id="companyName"
className="w-96"
placeholder="$ 1,000,000"
/>
<span className="text-[12px] text-neutral-500 self-center">
The sum total of past financing, including angel or venture{" "}
<br />
capital, loans, grants, or token sales.
</span>
</div>
</div>
{/* Is your company incorporated in the United States? */}
<div className="space-y-5">
<Label htmlFor="companyName" className="font-bold text-lg">
Is your company incorporated in the <br />
United States?
</Label>
<div className="flex space-x-5">
<div className="flex space-x-2 w-96">
<Button
variant={isInUS === "Yes" ? "default" : "outline"}
onClick={() => setIsInUS("Yes")}
className="w-20 h-12 text-base"
>
Yes
</Button>
<Button
variant={isInUS === "No" ? "default" : "outline"}
onClick={() => setIsInUS("No")}
className="w-20 h-12 text-base"
>
No
</Button>
</div>
<span className="text-[12px] text-neutral-500 self-center">
Only companies that are incorporated or formed in the US are{" "}
<br />
eligible to raise via Reg CF. If your company is incorporated{" "}
<br />
outside the US, we still encourage you to apply.
</span>
</div>
</div>
{/* Is your product available (for sale) in market? */}
<div className="space-y-5">
<Label htmlFor="companyName" className="font-bold text-lg">
Is your product available (for sale) <br />
in market?
</Label>
<div className="flex space-x-5">
<div className="flex space-x-2 w-96">
<Button
variant={isForSale === "Yes" ? "default" : "outline"}
onClick={() => setIsForSale("Yes")}
className="w-20 h-12 text-base"
>
Yes
</Button>
<Button
variant={isForSale === "No" ? "default" : "outline"}
onClick={() => setIsForSale("No")}
className="w-20 h-12 text-base"
>
No
</Button>
</div>
<span className="text-[12px] text-neutral-500 self-center">
Only check this box if customers can access, use, or buy your{" "}
<br />
product today.
</span>
</div>
</div>
{/* Is your company generating revenue?*/}
<div className="space-y-5">
<Label htmlFor="companyName" className="font-bold text-lg">
Is your company generating revenue?
</Label>
<div className="flex space-x-5">
<div className="flex space-x-2 w-96">
<Button
variant={isGenerating === "Yes" ? "default" : "outline"}
onClick={() => setIsGenarting("Yes")}
className="w-20 h-12 text-base"
>
Yes
</Button>
<Button
variant={isGenerating === "No" ? "default" : "outline"}
onClick={() => setIsGenarting("No")}
className="w-20 h-12 text-base"
>
No
</Button>
</div>
<span className="text-[12px] text-neutral-500 self-center">
Only check this box if your company is making money. <br />
Please elaborate on revenue and other traction below.
</span>
</div>
</div>
{/* Pitch deck */}
<div className="space-y-5">
<Label htmlFor="companyName" className="font-bold text-lg">
Pitch deck
</Label>
<div className="flex space-x-2 w-96">
<Button
variant={businessPitch === "text" ? "default" : "outline"}
onClick={() => setBusinessPitch("text")}
className="w-32 h-12 text-base"
>
Paste URL
</Button>
<Button
variant={businessPitch === "file" ? "default" : "outline"}
onClick={() => setBusinessPitch("file")}
className="w-32 h-12 text-base"
>
Upload a file
</Button>
</div>
<div className="flex space-x-5">
<Input
type={businessPitch}
id="companyName"
className="w-96"
placeholder="https:// "
/>
<span className="text-[12px] text-neutral-500 self-center">
Your pitch deck and other application info will be used for{" "}
<br />
internal purposes only. <br />
Please make sure this document is publicly accessible. This can{" "}
<br />
be a DocSend, Box, Dropbox, Google Drive or other link.
</span>
</div>
</div>
{/* What's the rough size of your community? */}
<div className="mt-10 space-y-5">
<Label htmlFor="industry" className="font-bold text-lg mt-10">
What's the rough size of your <br /> community?
</Label>
<div className="flex space-x-5">
<Select>
<SelectTrigger className="w-96">
<SelectValue placeholder="Select" />
</SelectTrigger>
<SelectContent>
<SelectGroup>
<SelectLabel>Select</SelectLabel>
{communitySize.map((i) => (
<SelectItem value={i}>{i}</SelectItem>
))}
</SelectGroup>
</SelectContent>
</Select>
<span className="text-[12px] text-neutral-500 self-center">
Include your email list, social media following (i.e. Instagram,{" "}
<br /> Discord, Facebook, Twitter, TikTok). Wed like to
understand the <br /> rough size of your current audience.
</span>
</div>
</div>
</div>
</div>
{/* apply first project */}
<div className="grid auto-rows-max w-3/4 ml-48 bg-zinc-100 dark:bg-zinc-900 mt-10 pt-12 pb-12">
{/* header */}
<div className="ml-96">
<h1 className="text-3xl font-bold mt-10">
Begin Your First Fundraising Project
</h1>
<p className="mt-3 text-sm text-neutral-500">
Starting a fundraising project is mandatory for all businesses. This
step is crucial <br />
to begin your journey and unlock the necessary tools for raising
funds.
</p> </p>
{/* project's name */} {/* company name */}
<div className="mt-10 space-y-5"> <div className="ml-96 mt-5 space-y-10">
<Label htmlFor="projectName" className="font-bold text-lg"> <div className="mt-10 space-y-5">
Project name <Label htmlFor="companyName" className="font-bold text-lg">
</Label> Company name
<div className="flex space-x-5"> </Label>
<Input type="text" id="projectName" className="w-96" /> <div className="flex space-x-5">
<Input
type="text"
id="companyName"
className="w-96"
{...register("companyName")}
/>
<span className="text-[12px] text-neutral-500 self-center">
This should be the name your company uses on your <br />
website and in the market.
</span>
</div>
</div>
{/* industry */}
<div className="mt-10 space-y-5">
<Label htmlFor="industry" className="font-bold text-lg mt-10">
Industry
</Label>
<div className="flex space-x-5">
<Select onValueChange={(value) => handleSelectChange(value)}>
<SelectTrigger className="w-96">
<SelectValue placeholder="Select an industry" />
</SelectTrigger>
<SelectContent>
<SelectGroup>
<SelectLabel>Industry</SelectLabel>
{industry.map((i) => (
<SelectItem key={i} value={i}>
{i}
</SelectItem>
))}
</SelectGroup>
</SelectContent>
</Select>
<input
type="hidden"
{...register("industry")}
value={selectedIndustry}
/>
{/* {selectedIndustry} */}
<span className="text-[12px] text-neutral-500 self-center">
Choose the industry that best aligns with your business.
</span>
</div>
</div>
{/* How much money has your company raised to date? */}
<div className="space-y-5">
<Label htmlFor="companyName" className="font-bold text-lg">
How much money has your company <br /> raised to date?
</Label>
<div className="flex space-x-5">
<Input
type="text"
id="companyName"
className="w-96"
placeholder="$ 1,000,000"
{...register}
/>
<span className="text-[12px] text-neutral-500 self-center">
The sum total of past financing, including angel or venture{" "}
<br />
capital, loans, grants, or token sales.
</span>
</div>
</div>
{/* Is your company incorporated in the United States? */}
<div className="space-y-5">
<Label htmlFor="companyName" className="font-bold text-lg">
Is your company incorporated in the <br />
United States?
</Label>
<div className="flex space-x-5">
<div className="flex space-x-2 w-96">
<Button
variant={isInUS === "Yes" ? "default" : "outline"}
onClick={() => setIsInUS("Yes")}
className="w-20 h-12 text-base"
>
Yes
</Button>
<Button
variant={isInUS === "No" ? "default" : "outline"}
onClick={() => setIsInUS("No")}
className="w-20 h-12 text-base"
>
No
</Button>
</div>
<span className="text-[12px] text-neutral-500 self-center">
Only companies that are incorporated or formed in the US are{" "}
<br />
eligible to raise via Reg CF. If your company is incorporated{" "}
<br />
outside the US, we still encourage you to apply.
</span>
</div>
</div> </div>
</div>
{/* project type */} {/* Is your product available (for sale) in market? */}
<div className="mt-10 space-y-5"> <div className="space-y-5">
<Label htmlFor="industry" className="font-bold text-lg mt-10"> <Label htmlFor="companyName" className="font-bold text-lg">
Project type Is your product available (for sale) <br />
</Label> in market?
<div className="flex space-x-5"> </Label>
<Select> <div className="flex space-x-5">
<SelectTrigger className="w-96"> <div className="flex space-x-2 w-96">
<SelectValue placeholder="Select a Project type" /> <Button
</SelectTrigger> variant={isForSale === "Yes" ? "default" : "outline"}
<SelectContent> onClick={() => setIsForSale("Yes")}
<SelectGroup> className="w-20 h-12 text-base"
<SelectLabel>Project type</SelectLabel> >
{projectType.map((i) => ( Yes
<SelectItem value={i}>{i}</SelectItem> </Button>
))} <Button
</SelectGroup> variant={isForSale === "No" ? "default" : "outline"}
</SelectContent> onClick={() => setIsForSale("No")}
</Select> className="w-20 h-12 text-base"
<span className="text-[12px] text-neutral-500 self-center"> >
Please specify the primary purpose of the funds No
</span> </Button>
</div>
<span className="text-[12px] text-neutral-500 self-center">
Only check this box if customers can access, use, or buy your{" "}
<br />
product today.
</span>
</div>
</div> </div>
</div>
{/* short description */} {/* Is your company generating revenue?*/}
<div className="mt-10 space-y-5"> <div className="space-y-5">
<Label htmlFor="companyName" className="font-bold text-lg"> <Label htmlFor="companyName" className="font-bold text-lg">
Short description Is your company generating revenue?
</Label> </Label>
<div className="flex space-x-5"> <div className="flex space-x-5">
<Textarea id="shortDescription" className="w-96" /> <div className="flex space-x-2 w-96">
<span className="text-[12px] text-neutral-500 self-center"> <Button
Could you provide a brief description of your project <br /> in variant={isGenerating === "Yes" ? "default" : "outline"}
one or two sentences? onClick={() => setIsGenarting("Yes")}
</span> className="w-20 h-12 text-base"
>
Yes
</Button>
<Button
variant={isGenerating === "No" ? "default" : "outline"}
onClick={() => setIsGenarting("No")}
className="w-20 h-12 text-base"
>
No
</Button>
</div>
<span className="text-[12px] text-neutral-500 self-center">
Only check this box if your company is making money. <br />
Please elaborate on revenue and other traction below.
</span>
</div>
</div> </div>
</div>
{/* Pitch deck */} {/* Pitch deck */}
<div className="mt-10 space-y-5"> <div className="space-y-5">
<Label htmlFor="companyName" className="font-bold text-lg"> <Label htmlFor="companyName" className="font-bold text-lg">
Pitch deck Pitch deck
</Label> </Label>
<div className="flex space-x-2 w-96"> <div className="flex space-x-2 w-96">
<Button <Button
variant={projectPitch === "text" ? "default" : "outline"} variant={businessPitch === "text" ? "default" : "outline"}
onClick={() => setProjectPitch("text")} onClick={() => setBusinessPitch("text")}
className="w-32 h-12 text-base" className="w-32 h-12 text-base"
> >
Paste URL Paste URL
</Button> </Button>
<Button <Button
variant={projectPitch === "file" ? "default" : "outline"} variant={businessPitch === "file" ? "default" : "outline"}
onClick={() => setProjectPitch("file")} onClick={() => setBusinessPitch("file")}
className="w-32 h-12 text-base" className="w-32 h-12 text-base"
> >
Upload a file Upload a file
</Button> </Button>
</div>
<div className="flex space-x-5">
<Input
type={businessPitch}
id="companyName"
className="w-96"
placeholder="https:// "
/>
<span className="text-[12px] text-neutral-500 self-center">
Your pitch deck and other application info will be used for{" "}
<br />
internal purposes only. <br />
Please make sure this document is publicly accessible. This
can <br />
be a DocSend, Box, Dropbox, Google Drive or other link.
</span>
</div>
</div> </div>
<div className="flex space-x-5">
<Input {/* What's the rough size of your community? */}
type={projectPitch} <div className="mt-10 space-y-5">
id="companyName" <Label htmlFor="industry" className="font-bold text-lg mt-10">
className="w-96" What's the rough size of your <br /> community?
placeholder="https:// " </Label>
/> <div className="flex space-x-5">
<span className="text-[12px] text-neutral-500 self-center"> <Select>
Please upload a file or paste a link to your pitch, which should{" "} <SelectTrigger className="w-96">
<br /> <SelectValue placeholder="Select" />
cover key aspects of your project: what it will do, what </SelectTrigger>
investors <br /> can expect to gain, and any highlights that <SelectContent>
make it stand out. <SelectGroup>
</span> <SelectLabel>Select</SelectLabel>
{communitySize.map((i) => (
<SelectItem value={i}>{i}</SelectItem>
))}
</SelectGroup>
</SelectContent>
</Select>
<span className="text-[12px] text-neutral-500 self-center">
Include your email list, social media following (i.e.
Instagram, <br /> Discord, Facebook, Twitter, TikTok). Wed
like to understand the <br /> rough size of your current
audience.
</span>
</div>
</div> </div>
</div> </div>
</div> </div>
</div>
{/* Submit */} {/* apply first project */}
<center> <div className="grid auto-rows-max w-3/4 ml-48 bg-zinc-100 dark:bg-zinc-900 mt-10 pt-12 pb-12">
<Button className="mt-12 mb-20 h-10 text-base font-bold py-6 px-5"> {/* header */}
Submit application <div className="ml-96">
</Button> <h1 className="text-3xl font-bold mt-10">
</center> Begin Your First Fundraising Project
</h1>
<p className="mt-3 text-sm text-neutral-500">
Starting a fundraising project is mandatory for all businesses.
This step is crucial <br />
to begin your journey and unlock the necessary tools for raising
funds.
</p>
{/* project's name */}
<div className="mt-10 space-y-5">
<Label htmlFor="projectName" className="font-bold text-lg">
Project name
</Label>
<div className="flex space-x-5">
<Input type="text" id="projectName" className="w-96" />
</div>
</div>
{/* project type */}
<div className="mt-10 space-y-5">
<Label htmlFor="industry" className="font-bold text-lg mt-10">
Project type
</Label>
<div className="flex space-x-5">
<Select>
<SelectTrigger className="w-96">
<SelectValue placeholder="Select a Project type" />
</SelectTrigger>
<SelectContent>
<SelectGroup>
<SelectLabel>Project type</SelectLabel>
{projectType.map((i) => (
<SelectItem value={i}>{i}</SelectItem>
))}
</SelectGroup>
</SelectContent>
</Select>
<span className="text-[12px] text-neutral-500 self-center">
Please specify the primary purpose of the funds
</span>
</div>
</div>
{/* short description */}
<div className="mt-10 space-y-5">
<Label htmlFor="companyName" className="font-bold text-lg">
Short description
</Label>
<div className="flex space-x-5">
<Textarea id="shortDescription" className="w-96" />
<span className="text-[12px] text-neutral-500 self-center">
Could you provide a brief description of your project <br />{" "}
in one or two sentences?
</span>
</div>
</div>
{/* Pitch deck */}
<div className="mt-10 space-y-5">
<Label htmlFor="companyName" className="font-bold text-lg">
Pitch deck
</Label>
<div className="flex space-x-2 w-96">
<Button
variant={projectPitch === "text" ? "default" : "outline"}
onClick={() => setProjectPitch("text")}
className="w-32 h-12 text-base"
>
Paste URL
</Button>
<Button
variant={projectPitch === "file" ? "default" : "outline"}
onClick={() => setProjectPitch("file")}
className="w-32 h-12 text-base"
>
Upload a file
</Button>
</div>
<div className="flex space-x-5">
<Input
type={projectPitch}
id="companyName"
className="w-96"
placeholder="https:// "
/>
<span className="text-[12px] text-neutral-500 self-center">
Please upload a file or paste a link to your pitch, which
should <br />
cover key aspects of your project: what it will do, what
investors <br /> can expect to gain, and any highlights that
make it stand out.
</span>
</div>
</div>
</div>
</div>
{/* Submit */}
<center>
<Button className="mt-12 mb-20 h-10 text-base font-bold py-6 px-5">
Submit application
</Button>
</center>
</form>
</div> </div>
); );
} }
function setValue(arg0: string, value: string) {
throw new Error("Function not implemented.");
}