Feat: Upload project on project owner dashboard #128
There are no files selected for viewing
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,7 +1,51 @@ | ||
| "use client"; | ||
|
|
||
| import FundProject from "@/components/dashboard/upload-project/FundProject"; | ||
| import SubmitNewProject from "@/components/dashboard/upload-project/SubmitNewProject"; | ||
| import SummaryAndUpload from "@/components/dashboard/upload-project/SummaryAndUpload"; | ||
| import React, { useState } from "react"; | ||
|
|
||
| export type TabType = "submit" | "fund" | "summary"; | ||
|
|
||
| function UploadProject() { | ||
| const [activeTab, setActiveTab] = useState<TabType>("submit"); | ||
|
|
||
| const tabs = [ | ||
| { name: "submit", title: "Submit New Project" }, | ||
| { name: "fund", title: "Fund Project" }, | ||
| { name: "summary", title: "Summary & Upload" }, | ||
| ]; | ||
|
|
||
| const activeIndex = tabs.findIndex((t) => t.name === activeTab); | ||
|
|
||
| return ( | ||
| <div className="flex flex-col gap-6"> | ||
| <div className="flex justify-center items-center gap-[21px]"> | ||
| {tabs.map((item, index) => ( | ||
| <div key={item.name} className="flex flex-col gap-[10px]"> | ||
| <div>{item.title}</div> | ||
| <div | ||
| className={`rounded-[100px] h-[6px] transition-colors duration-300 ${ | ||
| index <= activeIndex ? "bg-[#0073E6]" : "bg-[#1C1C1C]" | ||
| }`} | ||
| ></div> | ||
| </div> | ||
| ))} | ||
| </div> | ||
|
|
||
| <div> | ||
| {activeTab === tabs[0].name && ( | ||
| <SubmitNewProject setActiveTab={setActiveTab} /> | ||
| )} | ||
| {activeTab === tabs[1].name && ( | ||
| <FundProject setActiveTab={setActiveTab} /> | ||
| )} | ||
| {activeTab === tabs[2].name && ( | ||
| <SummaryAndUpload setActiveTab={setActiveTab} /> | ||
| )} | ||
| </div> | ||
| </div> | ||
| ); | ||
| } | ||
|
|
||
| export default UploadProject; |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,66 @@ | ||
| import type { TabType } from "@/app/dashboard/project-owner/upload-project/page"; | ||
|
|
||
| interface FundProjectProps { | ||
| setActiveTab: React.Dispatch<React.SetStateAction<TabType>>; | ||
| } | ||
|
|
||
| const FundProject = ({ setActiveTab }: FundProjectProps) => { | ||
| return ( | ||
| <div className="flex justify-center pb-32 sm:pb-10"> | ||
| <div className="sm:border-[1px] sm:border-[#1F1F1F] sm:rounded-[8px] p-6 w-full sm:max-w-[614px] flex flex-col gap-6"> | ||
| <div className="flex flex-col gap-3"> | ||
| <div className="text-[16px] text-[#E2E2E2]"> | ||
| Fund project for audit | ||
| </div> | ||
| <div className="text-[12px] text-[#6C6C6C]"> | ||
| Add funds to your bounty escrow account to pay for audit. | ||
| </div> | ||
| </div> | ||
| <div className="bg-[#101011] border-[1px] border-[#1F1F1F] p-6 rounded-[8px] flex flex-col gap-[10px]"> | ||
| <div className="text-[16px] text-[#E2E2E2]">Connect Wallet</div> | ||
| <div className="text-[12px] text-[#6C6C6C]"> | ||
| 0x4A7d5cB67eA4F6e4B7cC3B3aE3f8fD9bB2cF9a1B | ||
| </div> | ||
| </div> | ||
| <div className="flex flex-col gap-3"> | ||
| <div className="flex flex-col gap-[8px]"> | ||
| <label className="text-[16px] text-[#E2E2E2]">Amount (USD)</label> | ||
| <input | ||
| type="text" | ||
| name="amount" | ||
| placeholder="1000" | ||
| className="border-[1px] border-[#1F1F1F] rounded-[48px] py-[12px] px-[24px] bg-[#090909] placeholder:text-[#6C6C6C] text-[#E2E2E2]" | ||
| /> | ||
| <p className="text-[14px] text-[#6C6C6C]">Minimum deposit: $100</p> | ||
| </div> | ||
| <div className="bg-[#101011] p-6 flex flex-col gap-[10px] rounded-[8px]"> | ||
| <div className="text-[16px] text-[#E2E2E2]">Escrow Protection</div> | ||
| <div className="text-[16px] text-[#6C6C6C]"> | ||
| Funds are held securely in escrow and only released when valid | ||
| vulnerabilities are confirmed and bounties are awarded. | ||
| </div> | ||
| </div> | ||
| </div> | ||
| <div className="flex flex-col-reverse sm:flex-row sm:items-center gap-6 w-full"> | ||
| <div className="flex-1 rounded-[48px] p-[2px] bg-gradient-to-r from-[#212121] to-[#312F2F]"> | ||
| <button | ||
| onClick={() => setActiveTab("submit")} | ||
| className="w-full py-3 px-6 rounded-[48px] bg-[#1C1C1C] text-[#E2E2E2] text-[14px]" | ||
| > | ||
| Back | ||
| </button> | ||
| </div> | ||
| <div className="flex-1 rounded-[48px] p-[2px] bg-gradient-to-r from-[#10273E] to-[#2A67A4]"> | ||
| <button | ||
| onClick={() => setActiveTab("summary")} | ||
| className="w-full py-3 px-6 rounded-[48px] bg-gradient-to-r from-[#1D74F9] to-[#092650] text-[#E2E2E2] text-[14px]" | ||
| > | ||
| Next | ||
| </button> | ||
| </div> | ||
| </div> | ||
| </div> | ||
| </div> | ||
| ); | ||
| }; | ||
| export default FundProject; |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,132 @@ | ||
| import { ChevronDown, CalendarDays } from "lucide-react"; | ||
| import type { TabType } from "@/app/dashboard/project-owner/upload-project/page"; | ||
|
|
||
| interface SubmitNewProjectProps { | ||
| setActiveTab: React.Dispatch<React.SetStateAction<TabType>>; | ||
| } | ||
|
|
||
| const SubmitNewProject = ({ setActiveTab }: SubmitNewProjectProps) => { | ||
| return ( | ||
| <div className="flex justify-center pb-32 sm:pb-10"> | ||
| <div className="sm:border-[1px] sm:border-[#1F1F1F] sm:rounded-[8px] p-6 w-full sm:max-w-[614px] flex flex-col gap-6"> | ||
| <div className="font-medium text-[18px] text-[#E2E2E2]"> | ||
| Submit New Project for Audit | ||
| </div> | ||
| <div className="flex flex-col gap-6"> | ||
| <div className="flex flex-col gap-[10px]"> | ||
| <label className="text-[16px] text-[#E2E2E2]">Project Name</label> | ||
| <input | ||
| type="text" | ||
| name="projectName" | ||
| placeholder="Enter project name" | ||
| className="border-[1px] border-[#1F1F1F] rounded-[48px] py-[12px] px-[24px] bg-[#090909] placeholder:text-[#6C6C6C] text-[#E2E2E2]" | ||
| /> | ||
| </div> | ||
| <div className="flex flex-col gap-[10px]"> | ||
| <label className="text-[16px] text-[#E2E2E2]">Description</label> | ||
| <textarea | ||
| name="description" | ||
| placeholder="Describe your project and its security requirements" | ||
| className="border-[1px] border-[#1F1F1F] rounded-[8px] py-[12px] px-[24px] h-[119px] bg-[#090909] placeholder:text-[#6C6C6C] text-[#E2E2E2]" | ||
| /> | ||
| </div> | ||
| <div className="flex flex-col sm:flex-row items-center gap-6"> | ||
| <div className="flex flex-col gap-[10px] w-full"> | ||
| <label className="text-[16px] text-[#E2E2E2]">Project Type</label> | ||
| <div className="relative"> | ||
| <input | ||
| type="text" | ||
| name="projectType" | ||
| placeholder="Select project type" | ||
| className="w-full border-[1px] border-[#1F1F1F] rounded-[48px] py-[12px] px-[24px] bg-[#090909] placeholder:text-[#6C6C6C] text-[#E2E2E2]" | ||
| /> | ||
| <ChevronDown | ||
| className="absolute right-4 top-1/2 -translate-y-1/2 text-[#6C6C6C] pointer-events-none" | ||
| size={20} | ||
| /> | ||
| </div> | ||
| </div> | ||
| <div className="flex flex-col gap-[10px] w-full"> | ||
| <label className="text-[16px] text-[#E2E2E2]"> | ||
| Project Deadline | ||
| </label> | ||
| <div className="relative"> | ||
| <input | ||
| type="text" | ||
| name="projectDeadline" | ||
| placeholder="Pick date" | ||
| className="w-full border-[1px] border-[#1F1F1F] rounded-[48px] py-[12px] px-[24px] bg-[#090909] placeholder:text-[#6C6C6C] text-[#E2E2E2]" | ||
| /> | ||
|
Contributor
There was a problem hiding this comment. The calendar feature should be displaying all months and days, Use a library for it |
||
| <CalendarDays | ||
| className="absolute right-4 top-1/2 -translate-y-1/2 text-[#6C6C6C] pointer-events-none" | ||
| size={20} | ||
| /> | ||
| </div> | ||
| </div> | ||
| </div> | ||
| <div className="flex flex-col sm:flex-row items-center gap-6"> | ||
| <div className="flex flex-col gap-[10px] w-full"> | ||
| <label className="text-[16px] text-[#E2E2E2]"> | ||
| Repository URL | ||
| </label> | ||
| <div className="relative"> | ||
| <input | ||
| type="text" | ||
| name="repoUrl" | ||
| placeholder="Select repo" | ||
| className="w-full border-[1px] border-[#1F1F1F] rounded-[48px] py-[12px] px-[24px] bg-[#090909] placeholder:text-[#6C6C6C] text-[#E2E2E2]" | ||
| /> | ||
| <ChevronDown | ||
| className="absolute right-4 top-1/2 -translate-y-1/2 text-[#6C6C6C] pointer-events-none" | ||
| size={20} | ||
| /> | ||
| </div> | ||
| </div> | ||
| <div className="flex flex-col gap-[10px] w-full"> | ||
| <label className="text-[16px] text-[#E2E2E2]">Priority</label> | ||
| <div className="relative"> | ||
|
Contributor
There was a problem hiding this comment. Implement the priority dropdwon |
||
| <input | ||
| type="text" | ||
| name="priority" | ||
| placeholder="Select priority" | ||
| className="w-full border-[1px] border-[#1F1F1F] rounded-[48px] py-[12px] px-[24px] bg-[#090909] placeholder:text-[#6C6C6C] text-[#E2E2E2]" | ||
| /> | ||
| <ChevronDown | ||
| className="absolute right-4 top-1/2 -translate-y-1/2 text-[#6C6C6C] pointer-events-none" | ||
| size={20} | ||
| /> | ||
| </div> | ||
| </div> | ||
| </div> | ||
| <div className="flex flex-col gap-[10px]"> | ||
| <label className="text-[16px] text-[#E2E2E2]"> | ||
| Contract Address | ||
| </label> | ||
| <input | ||
| type="text" | ||
| name="contractAddress" | ||
| placeholder="https://yourproject.com" | ||
| className="border-[1px] border-[#1F1F1F] rounded-[48px] py-[12px] px-[24px] bg-[#090909] placeholder:text-[#6C6C6C] text-[#E2E2E2]" | ||
| /> | ||
| </div> | ||
| </div> | ||
| <div className="flex flex-col-reverse sm:flex-row sm:items-center gap-6 w-full"> | ||
| <div className="flex-1 rounded-[48px] p-[2px] bg-gradient-to-r from-[#212121] to-[#312F2F]"> | ||
| <button className="w-full py-3 px-6 rounded-[48px] bg-[#1C1C1C] text-[#E2E2E2] text-[14px]"> | ||
| Cancel | ||
| </button> | ||
| </div> | ||
| <div className="flex-1 rounded-[48px] p-[2px] bg-gradient-to-r from-[#10273E] to-[#2A67A4]"> | ||
| <button | ||
| onClick={() => setActiveTab("fund")} | ||
| className="w-full py-3 px-6 rounded-[48px] bg-gradient-to-r from-[#1D74F9] to-[#092650] text-[#E2E2E2] text-[14px]" | ||
| > | ||
| Next | ||
| </button> | ||
| </div> | ||
| </div> | ||
| </div> | ||
| </div> | ||
| ); | ||
| }; | ||
| export default SubmitNewProject; | ||
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,111 @@ | ||
| import type { TabType } from "@/app/dashboard/project-owner/upload-project/page"; | ||
|
|
||
| interface SummaryAndUploadProps { | ||
| setActiveTab: React.Dispatch<React.SetStateAction<TabType>>; | ||
| } | ||
|
|
||
| const SummaryAndUpload = ({ setActiveTab }: SummaryAndUploadProps) => { | ||
| return ( | ||
| <div className="flex justify-center pb-32 sm:pb-10"> | ||
| <div className="sm:border-[1px] sm:border-[#1F1F1F] sm:rounded-[8px] p-6 w-full sm:max-w-[808px] flex flex-col gap-6"> | ||
| <div className="text-[18px] text-[#E2E2E2]">Summary</div> | ||
| <div className="flex flex-col gap-6"> | ||
| <div className="hidden sm:flex sm:items-center sm:justify-between"> | ||
| <div className="flex flex-col gap-[10px]"> | ||
| <div className="text-[16px] text-[#E2E2E2]">Project Name</div> | ||
| <div className="text-[14px] text-[#6C6C6C]"> | ||
| Smart contract audit | ||
| </div> | ||
| </div> | ||
| <div className="bg-[#10273E] rounded-[48px] py-[14px] px-3 text-[#0073E6]"> | ||
|
|
||
| Priority: Low | ||
| </div> | ||
| <div className="bg-[#1C1C1C] border-[1px] border-[#1F1F1F] rounded-[8px] py-[14px] px-6 text-[#6C6C6C] text-[14px]"> | ||
| Bounty Amount |{" "} | ||
| <span className="text-[18px] text-[#E2E2E2]">$1200</span> | ||
| </div> | ||
| </div> | ||
| <div className="flex flex-col gap-[10px]"> | ||
| <div className="flex items-center justify-between"> | ||
| <div className="flex flex-col gap-[10px]"> | ||
| <div className="text-[16px] text-[#E2E2E2]">Project Name</div> | ||
| <div className="text-[14px] text-[#6C6C6C]"> | ||
| Smart contract audit | ||
| </div> | ||
| </div> | ||
| <div className="bg-[#10273E] rounded-[48px] py-[14px] px-3 text-[#0073E6]"> | ||
|
|
||
| Priority: Low | ||
| </div> | ||
| </div> | ||
| <div className="text-center bg-[#1C1C1C] border-[1px] border-[#1F1F1F] rounded-[8px] py-[14px] px-6 text-[#6C6C6C] text-[14px]"> | ||
| Bounty Amount |{" "} | ||
| <span className="text-[18px] text-[#E2E2E2]">$1200</span> | ||
| </div> | ||
| </div> | ||
| <div className="flex flex-col gap-[10px]"> | ||
| <div className="text-[16px] text-[#E2E2E2]">Description</div> | ||
| <div className="text-[14px] text-[#6C6C6C]"> | ||
| Smart Contract Audit is a planned, thorough evaluation of a smart | ||
| contract’s codebase, designed to equip researchers with a clear | ||
| framework for assessing its security, functionality, and | ||
| efficiency within the Mindblitz ecosystem or related blockchain | ||
| applications. The audit, to be conducted by specialized security | ||
| experts, will utilize automated analysis tools and in-depth manual | ||
| code review to uncover potential vulnerabilities, logical errors, | ||
| or inefficiencies that could lead to exploits or operational | ||
| issues. Researchers will focus on verifying the contract’s | ||
| alignment with its specified requirements, compliance with | ||
| blockchain industry best practices, and robustness against common | ||
| attack vectors, such as reentrancy, integer overflows, or | ||
| unauthorized access. The process will result in a detailed report | ||
| that identifies any issues, evaluates their severity, and provides | ||
| actionable recommendations for remediation, enabling researchers | ||
| to ensure the smart contract’s reliability, security, and | ||
| trustworthiness prior to its deployment in decentralized systems. | ||
| </div> | ||
| </div> | ||
| <div className="flex items-center gap-6"> | ||
| <div className="flex flex-col gap-[10px] w-full"> | ||
| <div className="text-[16px] text-[#E2E2E2]">Project Type</div> | ||
| <div className="text-[14px] text-[#6C6C6C]">Smart contract</div> | ||
| </div> | ||
| <div className="flex flex-col gap-[10px] w-full"> | ||
| <div className="text-[16px] text-[#E2E2E2]">Project Deadline</div> | ||
| <div className="text-[14px] text-[#6C6C6C]">17 - Aug - 2025</div> | ||
| </div> | ||
| </div> | ||
| <div className="flex flex-col sm:flex-row sm:items-center gap-6"> | ||
| <div className="flex flex-col gap-[10px] w-full"> | ||
| <div className="text-[16px] text-[#E2E2E2]">Repository URL</div> | ||
| <div className="text-[14px] text-[#6C6C6C]"> | ||
| https://github.com/smartcontract/repository | ||
| </div> | ||
| </div> | ||
| <div className="flex flex-col gap-[10px] w-full"> | ||
| <div className="text-[16px] text-[#E2E2E2]">Contract Address</div> | ||
| <div className="text-[14px] text-[#6C6C6C]"> | ||
| 0x1234567890abcdef1234567890abcdef12345678 | ||
| </div> | ||
| </div> | ||
| </div> | ||
| </div> | ||
| <div className="flex flex-col-reverse sm:flex-row sm:items-center gap-6 w-full"> | ||
| <div className="flex-1 rounded-[48px] p-[2px] bg-gradient-to-r from-[#212121] to-[#312F2F]"> | ||
| <button | ||
| onClick={() => setActiveTab("fund")} | ||
| className="w-full py-3 px-6 rounded-[48px] bg-[#1C1C1C] text-[#E2E2E2] text-[14px]" | ||
| > | ||
| Back | ||
| </button> | ||
| </div> | ||
| <div className="flex-1 rounded-[48px] p-[2px] bg-gradient-to-r from-[#10273E] to-[#2A67A4]"> | ||
| <button className="w-full py-3 px-6 rounded-[48px] bg-gradient-to-r from-[#1D74F9] to-[#092650] text-[#E2E2E2] text-[14px]"> | ||
| Upload | ||
| </button> | ||
| </div> | ||
| </div> | ||
| </div> | ||
| </div> | ||
| ); | ||
| }; | ||
| export default SummaryAndUpload; | ||
Oops, something went wrong.
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Pls the project type has a dropdow, Implement all the features of the dropdown https://www.figma.com/design/4z0dI5kfO5QTQVhmtKz7xP/Forti-Chain-Design-Team-File?node-id=766-1743&t=HL0B2xY77gO7M0X0-0