mirror of
https://github.com/Sosokker/B2D-Ventures.git
synced 2025-12-19 05:54:06 +01:00
301 lines
11 KiB
TypeScript
301 lines
11 KiB
TypeScript
"use client";
|
||
import { Button } from "@/components/ui/button";
|
||
import { Input } from "@/components/ui/input";
|
||
import { Label } from "@/components/ui/label";
|
||
import {
|
||
Select,
|
||
SelectContent,
|
||
SelectGroup,
|
||
SelectItem,
|
||
SelectLabel,
|
||
SelectTrigger,
|
||
SelectValue,
|
||
} from "@/components/ui/select";
|
||
import { createSupabaseClient } from "@/lib/supabase/clientComponentClient";
|
||
import { useEffect, useState } from "react";
|
||
|
||
export default function Apply() {
|
||
let supabase = createSupabaseClient();
|
||
const [industry, setIndustry] = useState<string[]>([]);
|
||
const [isInUS, setIsInUS] = useState("");
|
||
const [isForSale, setIsForSale] = useState("");
|
||
const [isGenerating, setIsGenarting] = useState("");
|
||
const [pitch, setPitch] = useState("");
|
||
const communitySize = [
|
||
"N/A",
|
||
"0-5K",
|
||
"5-10K",
|
||
"10-20K",
|
||
"20-50K",
|
||
"50-100K",
|
||
"100K+",
|
||
];
|
||
|
||
const fetchIndustry = async () => {
|
||
let { data: BusinessType, error } = await supabase
|
||
.from("BusinessType")
|
||
.select("value");
|
||
|
||
if (error) {
|
||
console.error(error);
|
||
} else {
|
||
if (BusinessType) {
|
||
console.table();
|
||
setIndustry(BusinessType.map((item) => item.value));
|
||
}
|
||
}
|
||
};
|
||
useEffect(() => {
|
||
fetchIndustry();
|
||
}, []);
|
||
return (
|
||
<div>
|
||
<div className="grid grid-flow-row auto-rows-max w-full h-52 md:h-92 bg-gray-100 dark:bg-gray-800 p-5">
|
||
<h1 className="text-2xl md:text-5xl font-medium md:font-bold justify-self-center md:mt-8">
|
||
Apply to raise on B2DVentures
|
||
</h1>
|
||
<div className="mt-5 justify-self-center">
|
||
<p className="text-sm md:text-base text-neutral-500">
|
||
All information submitted in this application is for internal use
|
||
only and is treated with the utmost{" "}
|
||
</p>
|
||
<p className="text-sm md:text-base text-neutral-500">
|
||
confidentiality. Companies may apply to raise with B2DVentures more
|
||
than once.
|
||
</p>
|
||
</div>
|
||
</div>
|
||
<div className="grid grid-flow-row auto-rows-max w-full ml-48">
|
||
<h1 className="text-3xl font-bold mt-10 ml-96">About your company</h1>
|
||
<p className="ml-96 mt-5 text-neutral-500">
|
||
All requested information in this section is required.
|
||
</p>
|
||
{/* form */}
|
||
|
||
{/* 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={pitch === "text" ? "default" : "outline"}
|
||
onClick={() => setPitch("text")}
|
||
className="w-32 h-12 text-base"
|
||
>
|
||
Paste URL
|
||
</Button>
|
||
<Button
|
||
variant={pitch === "file" ? "default" : "outline"}
|
||
onClick={() => setPitch("file")}
|
||
className="w-32 h-12 text-base"
|
||
>
|
||
Upload a file
|
||
</Button>
|
||
</div>
|
||
<div className="flex space-x-5">
|
||
<Input
|
||
type={pitch}
|
||
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). We’d like to
|
||
understand the <br /> rough size of your current audience.
|
||
</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>
|
||
</div>
|
||
);
|
||
}
|