From caccb1397b3d9720693b120374a773f1d84512b4 Mon Sep 17 00:00:00 2001 From: RafaDSan Date: Mon, 15 Jul 2024 13:16:43 -0300 Subject: [PATCH 001/139] feat: README updated on how to run the dapp --- README.md | 55 +++++++++++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 55 insertions(+) diff --git a/README.md b/README.md index 0ebb4ef6..fd032582 100644 --- a/README.md +++ b/README.md @@ -1 +1,56 @@ ## Getting Started with GAP frontend + +## Pre-Requisites + +- [node.js](https://nodejs.org/en/download/package-manager) installed (>=18.17.0) +- typescript installed (developed on v5.3.3) +- [yarn](https://classic.yarnpkg.com/lang/en/docs/install/#windows-stable) +- Web3 Wallet installed in your browser + +## Installation + +### Forkin the repository + +Fork this repository by: + +1. Clicking in the arrow aside from the `fork` +2. Unmark the option `Copy the main branch only` +3. Click `Create fork` + +### Cloning the repository + +Open the VsCode or other IDE editor, and enter the following command in the cmd: + +```bash +git clone https://github.com/YourUserName/gap-app-v2.git +``` + +### Instaling dependencies + +Install all package dependencies by running: + +```bash +yarn install +``` + +### Configure the `.env.example` file + +1. Copy the `.env.example` file and paste it in the root directory +2. Remove the `.example` from the `.env.example` file name +3. Add your API keys in the `.env` file +4. Creating the keys to fulfill the `.env` file + 1. **ALCHEMY_KEY:** Follow [this](https://docs.alchemy.com/docs/alchemy-quickstart-guide) tutorial of the Alchemy Docs and fill the following keys: `NEXT_PUBLIC_ALCHEMY_KEY`(use base sepolia for this one), `NEXT_PUBLIC_RPC_OPTIMISM`, `NEXT_PUBLIC_RPC_ARBITRUM`, `NEXT_PUBLIC_RPC_SEPOLIA` and `NEXT_PUBLIC_RPC_OPTIMISM_SEPOLIA` + 2. **PROJECT_ID:** Create your account in [this](https://walletconnect.com/) link and follow the instructions to generate a key + 3. **NEXT_PUBLIC_MIXPANEL_KEY:** Create your account in [this](https://mixpanel.com/login/) and follow [this](https://www.storylane.io/tutorials/how-to-get-mixpanel-project-token) tutorial + +### Running the application + +First, run the development server: + +```bash +yarn run dev +``` + +Open http://localhost:3000 with your browser. + +@blockful_io From 655119aca37c7ad845d661fc26b2919ccd331af9 Mon Sep 17 00:00:00 2001 From: "heronlancellot.eth" Date: Tue, 23 Jul 2024 17:08:40 -0300 Subject: [PATCH 002/139] feat: add review tab --- .../Pages/Project/ProjectGrantsPage.tsx | 7 + components/Pages/Project/Review/index.tsx | 164 ++++++++++++++++++ 2 files changed, 171 insertions(+) create mode 100644 components/Pages/Project/Review/index.tsx diff --git a/components/Pages/Project/ProjectGrantsPage.tsx b/components/Pages/Project/ProjectGrantsPage.tsx index c74da1a4..2ff5f402 100644 --- a/components/Pages/Project/ProjectGrantsPage.tsx +++ b/components/Pages/Project/ProjectGrantsPage.tsx @@ -56,6 +56,7 @@ import { PAGES } from "@/utilities/pages"; import { IGrantResponse } from "@show-karma/karma-gap-sdk/core/class/karma-indexer/api/types"; import { gapIndexerApi } from "@/utilities/gapIndexerApi"; import { GrantsGenieDialog } from "@/components/Dialogs/GrantGenieDialog"; +import { ReviewSection } from "@/components/Pages/Project/Review/"; interface Tab { name: string; @@ -187,6 +188,11 @@ export const ProjectGrantsPage = () => { tabName: "review-this-grant", current: false, }, + { + name: "Review", + tabName: "review", + current: false, + }, ]; if (hasQuestions) { @@ -469,6 +475,7 @@ export const ProjectGrantsPage = () => { )} + {currentTab === "review" && } {/* */} {currentTab === "create-grant" && project?.uid && } {currentTab === "edit-grant" && project?.uid && grant && ( diff --git a/components/Pages/Project/Review/index.tsx b/components/Pages/Project/Review/index.tsx new file mode 100644 index 00000000..2a9238de --- /dev/null +++ b/components/Pages/Project/Review/index.tsx @@ -0,0 +1,164 @@ +"use client"; +/* eslint-disable @next/next/no-img-element */ +import { useEffect, useState } from "react"; +import { additionalQuestion } from "@/utilities/tabs"; +import { useProjectStore } from "@/store"; +import { getReviewsOf, getAnonReviewsOf } from "@/utilities/sdk"; +import { IGrantResponse } from "@show-karma/karma-gap-sdk/core/class/karma-indexer/api/types"; +import { StarIcon } from "@/components/Icons"; +import { Spinner } from "@/components/Utilities/Spinner"; +import { Button } from "@/components/Utilities/Button"; +import { CardReview } from "./CardReview"; + +interface GrantAllReviewsProps { + grant: IGrantResponse | undefined; +} + +type Review = { + answers: { + query: string; + rating: number; + answer: string; + questionId: number; + }[]; + publicAddress: string; + createdAt: string; +}; +type AnonReview = { + answers: { + query: string; + rating: number; + answer: string; + questionId: number; + createdAt: string; + }[]; + nullifier: string; + createdAt: string; +}; + +export const ReviewSection = ({ grant }: GrantAllReviewsProps) => { + const isProjectLoading = useProjectStore((state) => state.loading); + if (isProjectLoading || !grant) { +
+ +
; + } + const project = useProjectStore((state) => state.project); + const [isFetching, setIsFetching] = useState(false); + const [isFetchingAnon, setIsFetchingAnon] = useState(false); + const [allReviews, setAllReviews] = useState([]); + const [allAnonReviews, setAllAnonReviews] = useState([]); + const [reviews, setReviews] = useState([]); + const [anonReviews, setAnonReviews] = useState([]); + const [page, setPage] = useState(1); + const [pageAnon, setPageAnon] = useState(1); + const pageLimit = 10; + + useEffect(() => { + if (!grant) return; + + const getReviews = async () => { + setIsFetching(true); + if (!grant) return; + try { + const data: Review[] = await getReviewsOf(grant.uid); + const orderedData = data.map((review) => ({ + ...review, + answers: [ + ...review.answers.filter( + (answer) => !additionalQuestion(answer.questionId, answer.query) + ), + ...review.answers.filter((answer) => + additionalQuestion(answer.questionId, answer.query) + ), + ], + })); + const sortByDate = (a: Review, b: Review) => + new Date(b.createdAt).getTime() - new Date(a.createdAt).getTime(); + const sortedData = orderedData.sort(sortByDate); + setAllReviews(sortedData); + const slicedData = sortedData.slice(0, pageLimit); + + setReviews(slicedData); + } catch (error) { + console.log(error); + setReviews([]); + } finally { + setIsFetching(false); + } + }; + + const getReviewsAnon = async () => { + setIsFetchingAnon(true); + if (!grant) return; + try { + const data: AnonReview[] = await getAnonReviewsOf(grant.uid); + const orderedData = data.map((review) => ({ + ...review, + + answers: [ + ...review.answers.filter( + (answer) => !additionalQuestion(answer.questionId, answer.query) + ), + ...review.answers.filter((answer) => + additionalQuestion(answer.questionId, answer.query) + ), + ], + })); + const sortByDate = (a: AnonReview, b: AnonReview) => + new Date(b.createdAt).getTime() - new Date(a.createdAt).getTime(); + const sortedData = orderedData.sort(sortByDate); + setAllAnonReviews(sortedData); + const slicedData = sortedData.slice(0, pageLimit); + + setAnonReviews(slicedData); + } catch (error) { + console.log(error); + setAnonReviews([]); + } finally { + setIsFetchingAnon(false); + } + }; + + getReviews(); + getReviewsAnon(); + }, [grant]); + + useEffect(() => { + const slicedData = allReviews.slice( + (page - 1) * pageLimit, + page * pageLimit + ); + setReviews(slicedData); + + const slicedAnonData = allAnonReviews.slice( + (pageAnon - 1) * pageLimit, + pageAnon * pageLimit + ); + setAnonReviews(slicedAnonData); + }, [page]); + + return ( +
+
+
+
+

+ All reviews of {grant?.details?.data?.title} +

+ +
+ + +
+
+
+ ); +}; From b2afa835e3299abcd6d2720c010aebfc4b8b0e49 Mon Sep 17 00:00:00 2001 From: "heronlancellot.eth" Date: Tue, 23 Jul 2024 17:11:34 -0300 Subject: [PATCH 003/139] feat: initial card-review to render --- .../Pages/Project/Review/CardReview.tsx | 21 +++++++++++++++++++ 1 file changed, 21 insertions(+) create mode 100644 components/Pages/Project/Review/CardReview.tsx diff --git a/components/Pages/Project/Review/CardReview.tsx b/components/Pages/Project/Review/CardReview.tsx new file mode 100644 index 00000000..dfaff7c7 --- /dev/null +++ b/components/Pages/Project/Review/CardReview.tsx @@ -0,0 +1,21 @@ +import { StarIcon } from "@/components/Icons"; +import { DynamicStars } from "@/components/Utilities/DynamicStars"; + +export const CardReview = () => { + return ( +
+ + + { + rating || 0; + }} + /> +
.. Case Submit a review
+ 21/07/2024 Estrela 4,5 (Pontuacao) + +
+ ); +}; From 38c3d6e4d9d73ff5c2691e2e0657c352ef498f5e Mon Sep 17 00:00:00 2001 From: heronlancellot Date: Thu, 25 Jul 2024 12:44:52 -0300 Subject: [PATCH 004/139] feat: add star-review --- components/Icons/StarReview.tsx | 31 +++++++++++++++++++++++++++++++ 1 file changed, 31 insertions(+) create mode 100644 components/Icons/StarReview.tsx diff --git a/components/Icons/StarReview.tsx b/components/Icons/StarReview.tsx new file mode 100644 index 00000000..06d35a70 --- /dev/null +++ b/components/Icons/StarReview.tsx @@ -0,0 +1,31 @@ +import { cn } from "@/utilities/tailwind"; +import type { SVGProps } from "react"; + +export const StarReviewIcon = ( + props: SVGProps, + pathProps?: React.SVGProps +) => { + return ( + + + + ); +}; From 84cc50bdf0de43e07cf8fa80c0bdbe51861deaea Mon Sep 17 00:00:00 2001 From: heronlancellot Date: Thu, 25 Jul 2024 14:49:53 -0300 Subject: [PATCH 005/139] feat: add navbar initial style --- .../Pages/Project/Review/CardReview.tsx | 141 ++++++++++++++++-- .../Project/Review/CardReviewSummary.tsx | 64 ++++++++ .../Pages/Project/Review/NavbarReview.tsx | 14 ++ components/Pages/Project/Review/index.tsx | 5 +- 4 files changed, 210 insertions(+), 14 deletions(-) create mode 100644 components/Pages/Project/Review/CardReviewSummary.tsx create mode 100644 components/Pages/Project/Review/NavbarReview.tsx diff --git a/components/Pages/Project/Review/CardReview.tsx b/components/Pages/Project/Review/CardReview.tsx index dfaff7c7..67f85b7c 100644 --- a/components/Pages/Project/Review/CardReview.tsx +++ b/components/Pages/Project/Review/CardReview.tsx @@ -1,21 +1,136 @@ +"use client"; + import { StarIcon } from "@/components/Icons"; +import { Button } from "@/components/Utilities/Button"; import { DynamicStars } from "@/components/Utilities/DynamicStars"; +import React from "react"; export const CardReview = () => { + interface BadgeListProps { + icon: React.FC; + description: string; + score: React.ReactNode; + } + + const badgeList: BadgeListProps[] = [ + { + icon: StarIcon, + description: + "Clear Goals: Recognizes programs with well-defined goals. Every grant program has a goal, such as governance, impact, or education. Are these goals well explained so you can build a project aligned with them?", + score: ( + { + rating || 0; + }} + /> + ), + }, + { + icon: StarIcon, + description: + "Smooth Application: Awards a seamless application process. Are they using a tech that facilitates the application process? Did they get back to you after the application, or was it just a poor form?", + score: ( + { + rating || 0; + }} + /> + ), + }, + { + icon: StarIcon, + description: + "Fair rounds: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla sem urna, sodales vel placerat sed, elementum a orci. Duis sit amet neque rutrum, suscipit enim tempus, dignissim erat. Etiam interdum dignissim pretium.", + score: ( + { + rating || 0; + }} + /> + ), + }, + { + icon: StarIcon, + description: + "Easy Tech: Awards programs with easily implementable technology. How hard is the tech? Are the docs easy to use or find?", + score: ( + { + rating || 0; + }} + /> + ), + }, + { + icon: StarIcon, + description: + "Supportive Team: Highlights programs with highly supportive teams. Whether technical or not, if you receive very helpful support after applying for a grant, issue this badge. – Post-Grant Support: Highlights strong post-grant support. How much do they help you after the application? Do they suggest related projects, possible connections, or interested people?", + score: ( + { + rating || 0; + }} + /> + ), + }, + { + icon: StarIcon, + description: + "Great Reviewers: Recognizes top-quality grant reviewers. They are impartial, select well-written projects, set clear goals, and explain the application process well.", + score: ( + { + rating || 0; + }} + /> + ), + }, + { + icon: StarIcon, + description: + "Fast Disbursement: Commends quick fund disbursement processes. Did they complete the payment as soon as you completed the milestones? If yes, issue this badge.", + score: ( + { + rating || 0; + }} + /> + ), + }, + ]; + return ( -
- - - { - rating || 0; - }} - /> -
.. Case Submit a review
- 21/07/2024 Estrela 4,5 (Pontuacao) - +
+
+ {badgeList.map((badge, index) => ( +
+
+
+ +
+
{badge.description}
+
{badge.score}
+
+
+ ))} +
+
+ +
); }; diff --git a/components/Pages/Project/Review/CardReviewSummary.tsx b/components/Pages/Project/Review/CardReviewSummary.tsx new file mode 100644 index 00000000..f8f6f5a8 --- /dev/null +++ b/components/Pages/Project/Review/CardReviewSummary.tsx @@ -0,0 +1,64 @@ +"use client"; +import { StarReviewIcon } from "@/components/Icons/StarReview"; +import { useState } from "react"; +import { CardReview } from "./CardReview"; + +export const CardReviewSummary = () => { + const [isStarSelected, setIsStarSelected] = useState(false); + + interface MiniReviewSummaryProps { + date: string; + icon: React.ReactNode; + score: number; + } + + const MiniReviewSummary: MiniReviewSummaryProps[] = [ + { + date: "18/07/2024", + icon: , + score: 4.6, + }, + { + date: "18/07/2024", + icon: , + score: 4.6, + }, + { + date: "18/07/2024", + icon: , + score: 4.6, + }, + { + date: "18/07/2024", + icon: , + score: 4.6, + }, + ]; + + return ( + <> +
+
+ {MiniReviewSummary.map( + (miniReview: MiniReviewSummaryProps, index: number) => ( + <> +
{ + setIsStarSelected(!isStarSelected); + }} + > +

{miniReview.date}

+ {miniReview.icon} +

{miniReview.score}

+
+ + ) + )} +
+
{isStarSelected && }
+
+ + ); +}; diff --git a/components/Pages/Project/Review/NavbarReview.tsx b/components/Pages/Project/Review/NavbarReview.tsx new file mode 100644 index 00000000..ec9797e0 --- /dev/null +++ b/components/Pages/Project/Review/NavbarReview.tsx @@ -0,0 +1,14 @@ +"use client"; +import { CardReviewSummary } from "./CardReviewSummary"; + +export const NavbarReview = () => { + return ( +
+
+
+ +
+
+
+ ); +}; diff --git a/components/Pages/Project/Review/index.tsx b/components/Pages/Project/Review/index.tsx index 2a9238de..267a5dae 100644 --- a/components/Pages/Project/Review/index.tsx +++ b/components/Pages/Project/Review/index.tsx @@ -9,6 +9,7 @@ import { StarIcon } from "@/components/Icons"; import { Spinner } from "@/components/Utilities/Spinner"; import { Button } from "@/components/Utilities/Button"; import { CardReview } from "./CardReview"; +import { NavbarReview } from "./NavbarReview"; interface GrantAllReviewsProps { grant: IGrantResponse | undefined; @@ -156,7 +157,9 @@ export const ReviewSection = ({ grant }: GrantAllReviewsProps) => {
- + + + {/* */} From cefe394406131e4d1f7e39a690acbb632b63e869 Mon Sep 17 00:00:00 2001 From: "heronlancellot.eth" Date: Fri, 26 Jul 2024 19:10:35 -0300 Subject: [PATCH 006/139] feat: add border-r to mini-review --- .../Pages/Project/Review/CardReviewSummary.tsx | 16 ++++++++++------ 1 file changed, 10 insertions(+), 6 deletions(-) diff --git a/components/Pages/Project/Review/CardReviewSummary.tsx b/components/Pages/Project/Review/CardReviewSummary.tsx index f8f6f5a8..ba2898e5 100644 --- a/components/Pages/Project/Review/CardReviewSummary.tsx +++ b/components/Pages/Project/Review/CardReviewSummary.tsx @@ -14,22 +14,22 @@ export const CardReviewSummary = () => { const MiniReviewSummary: MiniReviewSummaryProps[] = [ { - date: "18/07/2024", + date: "24 July, 2024", icon: , score: 4.6, }, { - date: "18/07/2024", + date: "24 July, 2024", icon: , score: 4.6, }, { - date: "18/07/2024", + date: "24 July, 2024", icon: , score: 4.6, }, { - date: "18/07/2024", + date: "24 July, 2024", icon: , score: 4.6, }, @@ -38,13 +38,17 @@ export const CardReviewSummary = () => { return ( <>
-
+
{MiniReviewSummary.map( (miniReview: MiniReviewSummaryProps, index: number) => ( <>
{ setIsStarSelected(!isStarSelected); }} From 26c41581d20684c892eb8042f92749a48d5ca78e Mon Sep 17 00:00:00 2001 From: "heronlancellot.eth" Date: Fri, 26 Jul 2024 21:28:32 -0300 Subject: [PATCH 007/139] feat: add badgeIcon & update CardReview with badgeIcon --- components/Icons/Badge.tsx | 806 ++++++++++++++++++ .../Pages/Project/Review/CardReview.tsx | 22 +- 2 files changed, 816 insertions(+), 12 deletions(-) create mode 100644 components/Icons/Badge.tsx diff --git a/components/Icons/Badge.tsx b/components/Icons/Badge.tsx new file mode 100644 index 00000000..ff8108c3 --- /dev/null +++ b/components/Icons/Badge.tsx @@ -0,0 +1,806 @@ +import type { SVGProps } from "react"; + +export enum BadgeName { + CLEAR_GOALS = "Clear Goals", + SMOOTH_APPLICATION = "Smooth Application", + FAIR_ROUNDS = "Fair Rounds", + EASY_TEACH = "Easy Tech", + SUPPORTIVE_TEAM = "Supportive Team", + GREAT_REVIEWERS = "Great Reviewers", + FAST_DISBURSEMENT = "Fast Disbursement", +} + +export const BadgeIcon = ({ + badgeName, + props, +}: { + badgeName: BadgeName; + props?: SVGProps; +}) => { + const BadeIconName: Record = { + [BadgeName.CLEAR_GOALS]: ( + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + ), + [BadgeName.EASY_TEACH]: ( + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + ), + [BadgeName.FAIR_ROUNDS]: ( + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + ), + [BadgeName.FAST_DISBURSEMENT]: ( + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + ), + [BadgeName.GREAT_REVIEWERS]: ( + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + ), + [BadgeName.SMOOTH_APPLICATION]: ( + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + ), + [BadgeName.SUPPORTIVE_TEAM]: ( + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + ), + }; + return BadeIconName[badgeName]; +}; diff --git a/components/Pages/Project/Review/CardReview.tsx b/components/Pages/Project/Review/CardReview.tsx index 67f85b7c..fde891b3 100644 --- a/components/Pages/Project/Review/CardReview.tsx +++ b/components/Pages/Project/Review/CardReview.tsx @@ -1,20 +1,20 @@ "use client"; -import { StarIcon } from "@/components/Icons"; +import { BadgeIcon, BadgeName } from "@/components/Icons/Badge"; import { Button } from "@/components/Utilities/Button"; import { DynamicStars } from "@/components/Utilities/DynamicStars"; import React from "react"; export const CardReview = () => { interface BadgeListProps { - icon: React.FC; + icon: React.JSX.Element; description: string; score: React.ReactNode; } const badgeList: BadgeListProps[] = [ { - icon: StarIcon, + icon: , description: "Clear Goals: Recognizes programs with well-defined goals. Every grant program has a goal, such as governance, impact, or education. Are these goals well explained so you can build a project aligned with them?", score: ( @@ -28,7 +28,7 @@ export const CardReview = () => { ), }, { - icon: StarIcon, + icon: , description: "Smooth Application: Awards a seamless application process. Are they using a tech that facilitates the application process? Did they get back to you after the application, or was it just a poor form?", score: ( @@ -42,7 +42,7 @@ export const CardReview = () => { ), }, { - icon: StarIcon, + icon: , description: "Fair rounds: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla sem urna, sodales vel placerat sed, elementum a orci. Duis sit amet neque rutrum, suscipit enim tempus, dignissim erat. Etiam interdum dignissim pretium.", score: ( @@ -56,7 +56,7 @@ export const CardReview = () => { ), }, { - icon: StarIcon, + icon: , description: "Easy Tech: Awards programs with easily implementable technology. How hard is the tech? Are the docs easy to use or find?", score: ( @@ -70,7 +70,7 @@ export const CardReview = () => { ), }, { - icon: StarIcon, + icon: , description: "Supportive Team: Highlights programs with highly supportive teams. Whether technical or not, if you receive very helpful support after applying for a grant, issue this badge. – Post-Grant Support: Highlights strong post-grant support. How much do they help you after the application? Do they suggest related projects, possible connections, or interested people?", score: ( @@ -84,7 +84,7 @@ export const CardReview = () => { ), }, { - icon: StarIcon, + icon: , description: "Great Reviewers: Recognizes top-quality grant reviewers. They are impartial, select well-written projects, set clear goals, and explain the application process well.", score: ( @@ -98,7 +98,7 @@ export const CardReview = () => { ), }, { - icon: StarIcon, + icon: , description: "Fast Disbursement: Commends quick fund disbursement processes. Did they complete the payment as soon as you completed the milestones? If yes, issue this badge.", score: ( @@ -119,9 +119,7 @@ export const CardReview = () => { {badgeList.map((badge, index) => (
-
- -
+
{badge.icon}
{badge.description}
{badge.score}
From 3cf309a5dcca9351d4168fa938c087ef17d92288 Mon Sep 17 00:00:00 2001 From: "heronlancellot.eth" Date: Sat, 27 Jul 2024 02:12:43 -0300 Subject: [PATCH 008/139] update: mocked-data to use dynamic data to render the badges --- .../Pages/Project/Review/CardReview.tsx | 200 ++++++++---------- .../Project/Review/CardReviewSummary.tsx | 60 +++--- 2 files changed, 124 insertions(+), 136 deletions(-) diff --git a/components/Pages/Project/Review/CardReview.tsx b/components/Pages/Project/Review/CardReview.tsx index fde891b3..99d10a62 100644 --- a/components/Pages/Project/Review/CardReview.tsx +++ b/components/Pages/Project/Review/CardReview.tsx @@ -5,118 +5,106 @@ import { Button } from "@/components/Utilities/Button"; import { DynamicStars } from "@/components/Utilities/DynamicStars"; import React from "react"; -export const CardReview = () => { - interface BadgeListProps { - icon: React.JSX.Element; - description: string; - score: React.ReactNode; - } +interface CardReviewDataProps { + id: number; +} - const badgeList: BadgeListProps[] = [ - { - icon: , - description: - "Clear Goals: Recognizes programs with well-defined goals. Every grant program has a goal, such as governance, impact, or education. Are these goals well explained so you can build a project aligned with them?", - score: ( - { - rating || 0; - }} - /> - ), - }, - { - icon: , - description: - "Smooth Application: Awards a seamless application process. Are they using a tech that facilitates the application process? Did they get back to you after the application, or was it just a poor form?", - score: ( - { - rating || 0; - }} - /> - ), - }, - { - icon: , - description: - "Fair rounds: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla sem urna, sodales vel placerat sed, elementum a orci. Duis sit amet neque rutrum, suscipit enim tempus, dignissim erat. Etiam interdum dignissim pretium.", - score: ( - { - rating || 0; - }} - /> - ), - }, - { - icon: , - description: - "Easy Tech: Awards programs with easily implementable technology. How hard is the tech? Are the docs easy to use or find?", - score: ( - { - rating || 0; - }} - /> - ), - }, - { - icon: , - description: - "Supportive Team: Highlights programs with highly supportive teams. Whether technical or not, if you receive very helpful support after applying for a grant, issue this badge. – Post-Grant Support: Highlights strong post-grant support. How much do they help you after the application? Do they suggest related projects, possible connections, or interested people?", - score: ( - { - rating || 0; - }} - /> - ), - }, - { - icon: , - description: - "Great Reviewers: Recognizes top-quality grant reviewers. They are impartial, select well-written projects, set clear goals, and explain the application process well.", - score: ( - { - rating || 0; - }} - /> - ), - }, - { - icon: , - description: - "Fast Disbursement: Commends quick fund disbursement processes. Did they complete the payment as soon as you completed the milestones? If yes, issue this badge.", - score: ( - { - rating || 0; - }} - /> - ), - }, +interface BadgeListProps { + icon: React.ReactNode; + description: string; + score: React.ReactNode; +} + +export const CardReview = (data: CardReviewDataProps) => { + const badgeList: BadgeListProps[][] = [ + [ + { + icon: , + description: + "Clear Goals: Recognizes programs with well-defined goals. Every grant program has a goal, such as governance, impact, or education. Are these goals well explained so you can build a project aligned with them?", + score: {}} />, + }, + { + icon: , + description: + "Smooth Application: Awards a seamless application process. Are they using a tech that facilitates the application process? Did they get back to you after the application, or was it just a poor form?", + score: {}} />, + }, + { + icon: , + description: + "Fair rounds: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla sem urna, sodales vel placerat sed, elementum a orci. Duis sit amet neque rutrum, suscipit enim tempus, dignissim erat. Etiam interdum dignissim pretium.", + score: {}} />, + }, + { + icon: , + description: + "Easy Tech: Awards programs with easily implementable technology. How hard is the tech? Are the docs easy to use or find?", + score: {}} />, + }, + { + icon: , + description: + "Supportive Team: Highlights programs with highly supportive teams. Whether technical or not, if you receive very helpful support after applying for a grant, issue this badge. – Post-Grant Support: Highlights strong post-grant support. How much do they help you after the application? Do they suggest related projects, possible connections, or interested people?", + score: {}} />, + }, + { + icon: , + description: + "Great Reviewers: Recognizes top-quality grant reviewers. They are impartial, select well-written projects, set clear goals, and explain the application process well.", + score: {}} />, + }, + { + icon: , + description: + "Fast Disbursement: Commends quick fund disbursement processes. Did they complete the payment as soon as you completed the milestones? If yes, issue this badge.", + score: {}} />, + }, + ], + [ + { + icon: , + description: + "Clear Goals: Recognizes programs with well-defined goals. Every grant program has a goal, such as governance, impact, or education. Are these goals well explained so you can build a project aligned with them?", + score: {}} />, + }, + { + icon: , + description: + "Smooth Application: Awards a seamless application process. Are they using a tech that facilitates the application process? Did they get back to you after the application, or was it just a poor form?", + score: {}} />, + }, + { + icon: , + description: + "Smooth Application: Awards a seamless application process. Are they using a tech that facilitates the application process? Did they get back to you after the application, or was it just a poor form?", + score: {}} />, + }, + ], + [ + { + icon: , + description: + "Clear Goals: Recognizes programs with well-defined goals. Every grant program has a goal, such as governance, impact, or education. Are these goals well explained so you can build a project aligned with them?", + score: {}} />, + }, + ], + [ + { + icon: , + description: + "Smooth Application: Awards a seamless application process. Are they using a tech that facilitates the application process? Did they get back to you after the application, or was it just a poor form?", + score: {}} />, + }, + ], ]; + const selectedBadgeList = badgeList[data.id] || []; + return (
- {badgeList.map((badge, index) => ( + {selectedBadgeList.map((badge: BadgeListProps, index: number) => (
{badge.icon}
diff --git a/components/Pages/Project/Review/CardReviewSummary.tsx b/components/Pages/Project/Review/CardReviewSummary.tsx index ba2898e5..12a55455 100644 --- a/components/Pages/Project/Review/CardReviewSummary.tsx +++ b/components/Pages/Project/Review/CardReviewSummary.tsx @@ -4,34 +4,34 @@ import { useState } from "react"; import { CardReview } from "./CardReview"; export const CardReviewSummary = () => { - const [isStarSelected, setIsStarSelected] = useState(false); + const [isStarSelected, setIsStarSelected] = useState(null); // ID interface MiniReviewSummaryProps { + id: number; date: string; - icon: React.ReactNode; score: number; } const MiniReviewSummary: MiniReviewSummaryProps[] = [ { + id: 1, date: "24 July, 2024", - icon: , score: 4.6, }, { - date: "24 July, 2024", - icon: , - score: 4.6, + id: 2, + date: "25 July, 2024", + score: 4.4, }, { - date: "24 July, 2024", - icon: , - score: 4.6, + id: 3, + date: "26 July, 2024", + score: 4.1, }, { - date: "24 July, 2024", - icon: , - score: 4.6, + id: 4, + date: "27 July, 2024", + score: 4.9, }, ]; @@ -41,27 +41,27 @@ export const CardReviewSummary = () => {
{MiniReviewSummary.map( (miniReview: MiniReviewSummaryProps, index: number) => ( - <> -
{ - setIsStarSelected(!isStarSelected); - }} - > -

{miniReview.date}

- {miniReview.icon} -

{miniReview.score}

-
- +
{ + setIsStarSelected(miniReview.id); + }} + > +

{miniReview.date}

+ +

{miniReview.score}

+
) )}
-
{isStarSelected && }
+
+ {isStarSelected !== null && } +
); From 2d016d261ad00a8ee3c10a46765ec2de576f3d1e Mon Sep 17 00:00:00 2001 From: "heronlancellot.eth" Date: Sat, 27 Jul 2024 11:16:54 -0300 Subject: [PATCH 009/139] update: index star-id --- components/Pages/Project/Review/CardReviewSummary.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/components/Pages/Project/Review/CardReviewSummary.tsx b/components/Pages/Project/Review/CardReviewSummary.tsx index 12a55455..6cab8b6a 100644 --- a/components/Pages/Project/Review/CardReviewSummary.tsx +++ b/components/Pages/Project/Review/CardReviewSummary.tsx @@ -49,7 +49,7 @@ export const CardReviewSummary = () => { : "border-r border-b-zinc-300" }`} onClick={() => { - setIsStarSelected(miniReview.id); + setIsStarSelected(index); }} >

{miniReview.date}

@@ -60,7 +60,7 @@ export const CardReviewSummary = () => { )}
- {isStarSelected !== null && } + {isStarSelected !== null && }
From 3e344e4d630a062422781683dbb45f13a6f8b5bd Mon Sep 17 00:00:00 2001 From: "heronlancellot.eth" Date: Sat, 27 Jul 2024 16:01:00 -0300 Subject: [PATCH 010/139] update: badge-icon --- components/Icons/Badge.tsx | 64 ++++++++++++++++----------------- components/Icons/StarReview.tsx | 4 +-- 2 files changed, 34 insertions(+), 34 deletions(-) diff --git a/components/Icons/Badge.tsx b/components/Icons/Badge.tsx index ff8108c3..f9dfb792 100644 --- a/components/Icons/Badge.tsx +++ b/components/Icons/Badge.tsx @@ -42,9 +42,9 @@ export const BadgeIcon = ({ fill="#EFF6FF" stroke="#C7D9FB" /> - - - + + + - + - - - + + + - + - - - + + + - + - + @@ -382,9 +382,9 @@ export const BadgeIcon = ({ width="70.353" height="77.524" filterUnits="userSpaceOnUse" - color-interpolation-filters="sRGB" + colorInterpolationFilters="sRGB" > - + - - + + - + - - + + - + - + - - - + + + - + Date: Mon, 29 Jul 2024 15:51:25 -0300 Subject: [PATCH 011/139] fix: enable click only in path-svg --- components/Icons/StarReview.tsx | 12 ++++++++---- .../Pages/Project/Review/CardReviewSummary.tsx | 17 +++++++++++++---- 2 files changed, 21 insertions(+), 8 deletions(-) diff --git a/components/Icons/StarReview.tsx b/components/Icons/StarReview.tsx index 316981b3..d2c17b8e 100644 --- a/components/Icons/StarReview.tsx +++ b/components/Icons/StarReview.tsx @@ -1,10 +1,13 @@ import { cn } from "@/utilities/tailwind"; import type { SVGProps } from "react"; -export const StarReviewIcon = ( - props: SVGProps, - pathProps?: React.SVGProps -) => { +export const StarReviewIcon = ({ + props, + pathProps, +}: { + props: SVGProps; + pathProps?: React.SVGProps; +}) => { return ( { ? "" : "border-r border-b-zinc-300" }`} - onClick={() => { - setIsStarSelected(index); - }} >

{miniReview.date}

- + { + setIsStarSelected(index); + }, + }} + />

{miniReview.score}

) From a7cf2555a962eb3ce2104673bc2f0d1a51ae063e Mon Sep 17 00:00:00 2001 From: "heronlancellot.eth" Date: Mon, 29 Jul 2024 16:08:12 -0300 Subject: [PATCH 012/139] feat: add chevronDown when user select the star --- components/Pages/Project/Review/CardReviewSummary.tsx | 8 +++++++- 1 file changed, 7 insertions(+), 1 deletion(-) diff --git a/components/Pages/Project/Review/CardReviewSummary.tsx b/components/Pages/Project/Review/CardReviewSummary.tsx index fabe2923..29d22ba6 100644 --- a/components/Pages/Project/Review/CardReviewSummary.tsx +++ b/components/Pages/Project/Review/CardReviewSummary.tsx @@ -2,6 +2,7 @@ import { StarReviewIcon } from "@/components/Icons/StarReview"; import { useState } from "react"; import { CardReview } from "./CardReview"; +import { ChevronDown } from "@/components/Icons"; export const CardReviewSummary = () => { const [isStarSelected, setIsStarSelected] = useState(null); // ID @@ -64,11 +65,16 @@ export const CardReviewSummary = () => { }} />

{miniReview.score}

+ {isStarSelected === index && ( +
+ +
+ )}
) )}
-
+
{isStarSelected !== null && }
From e473bfe3de5d9a4c3a9b3f716bceea07324fb178 Mon Sep 17 00:00:00 2001 From: "heronlancellot.eth" Date: Mon, 29 Jul 2024 16:17:21 -0300 Subject: [PATCH 013/139] update: code legibility --- .../Project/Review/CardReviewSummary.tsx | 77 +++++++++---------- 1 file changed, 37 insertions(+), 40 deletions(-) diff --git a/components/Pages/Project/Review/CardReviewSummary.tsx b/components/Pages/Project/Review/CardReviewSummary.tsx index 29d22ba6..4cc8cccb 100644 --- a/components/Pages/Project/Review/CardReviewSummary.tsx +++ b/components/Pages/Project/Review/CardReviewSummary.tsx @@ -37,47 +37,44 @@ export const CardReviewSummary = () => { ]; return ( - <> +
+
+ {MiniReviewSummary.map( + (miniReview: MiniReviewSummaryProps, index: number) => ( +
+

{miniReview.date}

+ { + setIsStarSelected(index); + }, + }} + /> +

{miniReview.score}

+ {isStarSelected === index && ( +
+ +
+ )} +
+ ) + )} +
-
- {MiniReviewSummary.map( - (miniReview: MiniReviewSummaryProps, index: number) => ( -
-

{miniReview.date}

- { - setIsStarSelected(index); - }, - }} - /> -

{miniReview.score}

- {isStarSelected === index && ( -
- -
- )} -
- ) - )} -
-
- {isStarSelected !== null && } -
+ {isStarSelected !== null && }
- +
); }; From 26c7bd0140a8b0a057c0812efcc7083377ac636b Mon Sep 17 00:00:00 2001 From: "heronlancellot.eth" Date: Mon, 29 Jul 2024 16:38:29 -0300 Subject: [PATCH 014/139] fix: remove cursor-pointer in NavbarReview --- components/Pages/Project/Review/NavbarReview.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/components/Pages/Project/Review/NavbarReview.tsx b/components/Pages/Project/Review/NavbarReview.tsx index ec9797e0..df140ac6 100644 --- a/components/Pages/Project/Review/NavbarReview.tsx +++ b/components/Pages/Project/Review/NavbarReview.tsx @@ -5,7 +5,7 @@ export const NavbarReview = () => { return (
-
+
From b84d85deb0d89dac04551c395d6b83a8b60bb671 Mon Sep 17 00:00:00 2001 From: "heronlancellot.eth" Date: Mon, 29 Jul 2024 19:49:37 -0300 Subject: [PATCH 015/139] update: navbar-review with date in unix-timestamp sorted --- .../Project/Review/CardReviewSummary.tsx | 45 ++++++++++++++----- .../Pages/Project/Review/NavbarReview.tsx | 4 +- 2 files changed, 37 insertions(+), 12 deletions(-) diff --git a/components/Pages/Project/Review/CardReviewSummary.tsx b/components/Pages/Project/Review/CardReviewSummary.tsx index 4cc8cccb..d046d9a3 100644 --- a/components/Pages/Project/Review/CardReviewSummary.tsx +++ b/components/Pages/Project/Review/CardReviewSummary.tsx @@ -3,52 +3,75 @@ import { StarReviewIcon } from "@/components/Icons/StarReview"; import { useState } from "react"; import { CardReview } from "./CardReview"; import { ChevronDown } from "@/components/Icons"; +import { formatDate } from "@/utilities/formatDate"; export const CardReviewSummary = () => { const [isStarSelected, setIsStarSelected] = useState(null); // ID interface MiniReviewSummaryProps { id: number; - date: string; + date: number; // UNIX Timestamp score: number; } const MiniReviewSummary: MiniReviewSummaryProps[] = [ { id: 1, - date: "24 July, 2024", + date: 1727136000, // 24 July, 2024 in Unix timestamp score: 4.6, }, { id: 2, - date: "25 July, 2024", + date: 1727222400, // 25 July, 2024 in Unix timestamp score: 4.4, }, { id: 3, - date: "26 July, 2024", + date: 1727308800, // 26 July, 2024 in Unix timestamp score: 4.1, }, { id: 4, - date: "27 July, 2024", + date: 1727395200, // 27 July, 2024 in Unix timestamp + score: 4.9, + }, + { + id: 5, + date: 1727395200, // 27 July, 2024 in Unix timestamp + score: 4.9, + }, + { + id: 6, + date: 1727395200, // 27 July, 2024 in Unix timestamp + score: 4.9, + }, + { + id: 7, + date: 1727395200, // 27 July, 2024 in Unix timestamp + score: 4.9, + }, + { + id: 8, + date: 1727395200, // 27 July, 2024 in Unix timestamp score: 4.9, }, ]; return (
-
- {MiniReviewSummary.map( +
+ {MiniReviewSummary.sort((a, b) => b.date - a.date).map( (miniReview: MiniReviewSummaryProps, index: number) => (
-

{miniReview.date}

+

+ {formatDate(new Date(miniReview.date * 1000))} +

{ pathProps={{ className: "cursor-pointer", onClick: () => { - setIsStarSelected(index); + setIsStarSelected((prev) => + prev === index ? null : index + ); }, }} /> diff --git a/components/Pages/Project/Review/NavbarReview.tsx b/components/Pages/Project/Review/NavbarReview.tsx index df140ac6..0c53fe20 100644 --- a/components/Pages/Project/Review/NavbarReview.tsx +++ b/components/Pages/Project/Review/NavbarReview.tsx @@ -4,8 +4,8 @@ import { CardReviewSummary } from "./CardReviewSummary"; export const NavbarReview = () => { return (
-
-
+
+
From 1b163ac46c234ae1bbee31a5e154e66b93c5f7ad Mon Sep 17 00:00:00 2001 From: "heronlancellot.eth" Date: Mon, 29 Jul 2024 19:59:37 -0300 Subject: [PATCH 016/139] update: onClick action nav-bar todo to create a new review --- components/Pages/Project/Review/index.tsx | 13 ++++++++----- 1 file changed, 8 insertions(+), 5 deletions(-) diff --git a/components/Pages/Project/Review/index.tsx b/components/Pages/Project/Review/index.tsx index 267a5dae..63e4f527 100644 --- a/components/Pages/Project/Review/index.tsx +++ b/components/Pages/Project/Review/index.tsx @@ -8,8 +8,9 @@ import { IGrantResponse } from "@show-karma/karma-gap-sdk/core/class/karma-index import { StarIcon } from "@/components/Icons"; import { Spinner } from "@/components/Utilities/Spinner"; import { Button } from "@/components/Utilities/Button"; -import { CardReview } from "./CardReview"; -import { NavbarReview } from "./NavbarReview"; +import { NavbarReview } from "@/components/Pages/Project/Review/NavbarReview"; +// import { useConnectModal } from "@rainbow-me/rainbowkit"; +// import { useAccount } from "wagmi"; interface GrantAllReviewsProps { grant: IGrantResponse | undefined; @@ -54,6 +55,8 @@ export const ReviewSection = ({ grant }: GrantAllReviewsProps) => { const [page, setPage] = useState(1); const [pageAnon, setPageAnon] = useState(1); const pageLimit = 10; + // const { openConnectModal } = useConnectModal(); + // const { isConnected, address } = useAccount(); useEffect(() => { if (!grant) return; @@ -149,7 +152,9 @@ export const ReviewSection = ({ grant }: GrantAllReviewsProps) => {
- - {/* */}
From bb09ef5add954bda9101823d9b488ec8f87fcc35 Mon Sep 17 00:00:00 2001 From: "heronlancellot.eth" Date: Mon, 29 Jul 2024 20:13:00 -0300 Subject: [PATCH 017/139] fix: code legibility --- components/Pages/Project/Review/CardReview.tsx | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/components/Pages/Project/Review/CardReview.tsx b/components/Pages/Project/Review/CardReview.tsx index 99d10a62..37b0b025 100644 --- a/components/Pages/Project/Review/CardReview.tsx +++ b/components/Pages/Project/Review/CardReview.tsx @@ -107,9 +107,9 @@ export const CardReview = (data: CardReviewDataProps) => { {selectedBadgeList.map((badge: BadgeListProps, index: number) => (
-
{badge.icon}
-
{badge.description}
-
{badge.score}
+
{badge.icon}
+
{badge.description}
+
{badge.score}
))} From b6f8a3e060cc895a16d8443cd5c155813145586d Mon Sep 17 00:00:00 2001 From: "heronlancellot.eth" Date: Tue, 30 Jul 2024 13:47:50 -0300 Subject: [PATCH 018/139] update: review-icon props --- components/Icons/StarReview.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/components/Icons/StarReview.tsx b/components/Icons/StarReview.tsx index d2c17b8e..7d0923be 100644 --- a/components/Icons/StarReview.tsx +++ b/components/Icons/StarReview.tsx @@ -5,7 +5,7 @@ export const StarReviewIcon = ({ props, pathProps, }: { - props: SVGProps; + props?: SVGProps; pathProps?: React.SVGProps; }) => { return ( From dd20985fb2277c03f897e0d7c42e4de3f753ab5a Mon Sep 17 00:00:00 2001 From: "heronlancellot.eth" Date: Tue, 30 Jul 2024 14:42:53 -0300 Subject: [PATCH 019/139] feat: add dynamic-stars-review & update: component data --- .../Pages/Project/Review/CardReview.tsx | 215 ++++++++++++++++-- .../Project/Review/CardReviewSummary.tsx | 48 ++-- .../Project/Review/DynamicStarsReview.tsx | 56 +++++ components/Pages/Project/Review/index.tsx | 4 +- 4 files changed, 275 insertions(+), 48 deletions(-) create mode 100644 components/Pages/Project/Review/DynamicStarsReview.tsx diff --git a/components/Pages/Project/Review/CardReview.tsx b/components/Pages/Project/Review/CardReview.tsx index 37b0b025..768355a0 100644 --- a/components/Pages/Project/Review/CardReview.tsx +++ b/components/Pages/Project/Review/CardReview.tsx @@ -2,63 +2,109 @@ import { BadgeIcon, BadgeName } from "@/components/Icons/Badge"; import { Button } from "@/components/Utilities/Button"; -import { DynamicStars } from "@/components/Utilities/DynamicStars"; -import React from "react"; +import React, { useState } from "react"; +import { DynamicStarsReview } from "./DynamicStarsReview"; interface CardReviewDataProps { id: number; + editableReview: boolean; + // newReview?: boolean; } interface BadgeListProps { icon: React.ReactNode; description: string; - score: React.ReactNode; + score: number; } export const CardReview = (data: CardReviewDataProps) => { - const badgeList: BadgeListProps[][] = [ + // const defaultInitialBadgeList: BadgeListProps[] = [ + // { + // icon: , + // description: + // "Clear Goals: Recognizes programs with well-defined goals. Every grant program has a goal, such as governance, impact, or education. Are these goals well explained so you can build a project aligned with them?", + // score: 0, + // }, + // { + // icon: , + // description: + // "Smooth Application: Awards a seamless application process. Are they using a tech that facilitates the application process? Did they get back to you after the application, or was it just a poor form?", + // score: 0, + // }, + // { + // icon: , + // description: + // "Fair rounds: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla sem urna, sodales vel placerat sed, elementum a orci. Duis sit amet neque rutrum, suscipit enim tempus, dignissim erat. Etiam interdum dignissim pretium.", + // score: 0, + // }, + // { + // icon: , + // description: + // "Easy Tech: Awards programs with easily implementable technology. How hard is the tech? Are the docs easy to use or find?", + // score: 0, + // }, + // { + // icon: , + // description: + // "Supportive Team: Highlights programs with highly supportive teams. Whether technical or not, if you receive very helpful support after applying for a grant, issue this badge. – Post-Grant Support: Highlights strong post-grant support. How much do they help you after the application? Do they suggest related projects, possible connections, or interested people?", + // score: 0, + // }, + // { + // icon: , + // description: + // "Great Reviewers: Recognizes top-quality grant reviewers. They are impartial, select well-written projects, set clear goals, and explain the application process well.", + // score: 0, + // }, + // { + // icon: , + // description: + // "Fast Disbursement: Commends quick fund disbursement processes. Did they complete the payment as soon as you completed the milestones? If yes, issue this badge.", + // score: 0, + // }, + // ]; + const initialBadgeList: BadgeListProps[][] = [ [ { icon: , description: "Clear Goals: Recognizes programs with well-defined goals. Every grant program has a goal, such as governance, impact, or education. Are these goals well explained so you can build a project aligned with them?", - score: {}} />, + score: 5, }, { icon: , description: "Smooth Application: Awards a seamless application process. Are they using a tech that facilitates the application process? Did they get back to you after the application, or was it just a poor form?", - score: {}} />, + score: 4, }, { icon: , description: "Fair rounds: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla sem urna, sodales vel placerat sed, elementum a orci. Duis sit amet neque rutrum, suscipit enim tempus, dignissim erat. Etiam interdum dignissim pretium.", - score: {}} />, + score: 4, }, { icon: , description: "Easy Tech: Awards programs with easily implementable technology. How hard is the tech? Are the docs easy to use or find?", - score: {}} />, + score: 4, }, { icon: , description: "Supportive Team: Highlights programs with highly supportive teams. Whether technical or not, if you receive very helpful support after applying for a grant, issue this badge. – Post-Grant Support: Highlights strong post-grant support. How much do they help you after the application? Do they suggest related projects, possible connections, or interested people?", - score: {}} />, + score: 4, }, { icon: , description: "Great Reviewers: Recognizes top-quality grant reviewers. They are impartial, select well-written projects, set clear goals, and explain the application process well.", - score: {}} />, + score: 4, }, { icon: , description: "Fast Disbursement: Commends quick fund disbursement processes. Did they complete the payment as soon as you completed the milestones? If yes, issue this badge.", - score: {}} />, + score: 4, }, ], [ @@ -66,19 +112,43 @@ export const CardReview = (data: CardReviewDataProps) => { icon: , description: "Clear Goals: Recognizes programs with well-defined goals. Every grant program has a goal, such as governance, impact, or education. Are these goals well explained so you can build a project aligned with them?", - score: {}} />, + score: 4, }, { icon: , description: "Smooth Application: Awards a seamless application process. Are they using a tech that facilitates the application process? Did they get back to you after the application, or was it just a poor form?", - score: {}} />, + score: 4, }, { - icon: , + icon: , description: - "Smooth Application: Awards a seamless application process. Are they using a tech that facilitates the application process? Did they get back to you after the application, or was it just a poor form?", - score: {}} />, + "Fair rounds: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla sem urna, sodales vel placerat sed, elementum a orci. Duis sit amet neque rutrum, suscipit enim tempus, dignissim erat. Etiam interdum dignissim pretium.", + score: 4, + }, + { + icon: , + description: + "Easy Tech: Awards programs with easily implementable technology. How hard is the tech? Are the docs easy to use or find?", + score: 4, + }, + { + icon: , + description: + "Supportive Team: Highlights programs with highly supportive teams. Whether technical or not, if you receive very helpful support after applying for a grant, issue this badge. – Post-Grant Support: Highlights strong post-grant support. How much do they help you after the application? Do they suggest related projects, possible connections, or interested people?", + score: 4, + }, + { + icon: , + description: + "Great Reviewers: Recognizes top-quality grant reviewers. They are impartial, select well-written projects, set clear goals, and explain the application process well.", + score: 4, + }, + { + icon: , + description: + "Fast Disbursement: Commends quick fund disbursement processes. Did they complete the payment as soon as you completed the milestones? If yes, issue this badge.", + score: 4, }, ], [ @@ -86,21 +156,112 @@ export const CardReview = (data: CardReviewDataProps) => { icon: , description: "Clear Goals: Recognizes programs with well-defined goals. Every grant program has a goal, such as governance, impact, or education. Are these goals well explained so you can build a project aligned with them?", - score: {}} />, + score: 4, + }, + { + icon: , + description: + "Smooth Application: Awards a seamless application process. Are they using a tech that facilitates the application process? Did they get back to you after the application, or was it just a poor form?", + score: 4, + }, + { + icon: , + description: + "Fair rounds: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla sem urna, sodales vel placerat sed, elementum a orci. Duis sit amet neque rutrum, suscipit enim tempus, dignissim erat. Etiam interdum dignissim pretium.", + score: 4, + }, + { + icon: , + description: + "Easy Tech: Awards programs with easily implementable technology. How hard is the tech? Are the docs easy to use or find?", + score: 4, + }, + { + icon: , + description: + "Supportive Team: Highlights programs with highly supportive teams. Whether technical or not, if you receive very helpful support after applying for a grant, issue this badge. – Post-Grant Support: Highlights strong post-grant support. How much do they help you after the application? Do they suggest related projects, possible connections, or interested people?", + score: 4, + }, + { + icon: , + description: + "Great Reviewers: Recognizes top-quality grant reviewers. They are impartial, select well-written projects, set clear goals, and explain the application process well.", + score: 4, + }, + { + icon: , + description: + "Fast Disbursement: Commends quick fund disbursement processes. Did they complete the payment as soon as you completed the milestones? If yes, issue this badge.", + score: 4, }, ], [ + { + icon: , + description: + "Clear Goals: Recognizes programs with well-defined goals. Every grant program has a goal, such as governance, impact, or education. Are these goals well explained so you can build a project aligned with them?", + score: 4, + }, { icon: , description: "Smooth Application: Awards a seamless application process. Are they using a tech that facilitates the application process? Did they get back to you after the application, or was it just a poor form?", - score: {}} />, + score: 4, + }, + { + icon: , + description: + "Fair rounds: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla sem urna, sodales vel placerat sed, elementum a orci. Duis sit amet neque rutrum, suscipit enim tempus, dignissim erat. Etiam interdum dignissim pretium.", + score: 4, + }, + { + icon: , + description: + "Easy Tech: Awards programs with easily implementable technology. How hard is the tech? Are the docs easy to use or find?", + score: 4, + }, + { + icon: , + description: + "Supportive Team: Highlights programs with highly supportive teams. Whether technical or not, if you receive very helpful support after applying for a grant, issue this badge. – Post-Grant Support: Highlights strong post-grant support. How much do they help you after the application? Do they suggest related projects, possible connections, or interested people?", + score: 4, + }, + { + icon: , + description: + "Great Reviewers: Recognizes top-quality grant reviewers. They are impartial, select well-written projects, set clear goals, and explain the application process well.", + score: 4, + }, + { + icon: , + description: + "Fast Disbursement: Commends quick fund disbursement processes. Did they complete the payment as soon as you completed the milestones? If yes, issue this badge.", + score: 4, }, ], ]; + const [badgeList, setBadgeList] = + useState(initialBadgeList); + + // const [newReview, setNewReview] = useState( + // defaultInitialBadgeList + // ); + const selectedBadgeList = badgeList[data.id] || []; + const handleSetRating = (index: number, rating: number) => { + const updatedBadgeList = [...badgeList]; + const updatedBadges = [...updatedBadgeList[data.id]]; + + if (updatedBadges[index]) { + updatedBadges[index] = { ...updatedBadges[index], score: rating }; + } + + updatedBadgeList[data.id] = updatedBadges; + setBadgeList(updatedBadgeList); + }; + return (
@@ -109,7 +270,23 @@ export const CardReview = (data: CardReviewDataProps) => {
{badge.icon}
{badge.description}
-
{badge.score}
+
+ {data.editableReview ? ( + handleSetRating(index, rating)} + editableReview={true} + /> + ) : ( + {}} + editableReview={false} + /> + )} +
))} diff --git a/components/Pages/Project/Review/CardReviewSummary.tsx b/components/Pages/Project/Review/CardReviewSummary.tsx index d046d9a3..01b7d749 100644 --- a/components/Pages/Project/Review/CardReviewSummary.tsx +++ b/components/Pages/Project/Review/CardReviewSummary.tsx @@ -11,49 +11,29 @@ export const CardReviewSummary = () => { interface MiniReviewSummaryProps { id: number; date: number; // UNIX Timestamp - score: number; + scoreMedia: number; } const MiniReviewSummary: MiniReviewSummaryProps[] = [ { id: 1, date: 1727136000, // 24 July, 2024 in Unix timestamp - score: 4.6, + scoreMedia: 4.6, }, { id: 2, date: 1727222400, // 25 July, 2024 in Unix timestamp - score: 4.4, + scoreMedia: 4.4, }, { id: 3, date: 1727308800, // 26 July, 2024 in Unix timestamp - score: 4.1, + scoreMedia: 4.1, }, { id: 4, date: 1727395200, // 27 July, 2024 in Unix timestamp - score: 4.9, - }, - { - id: 5, - date: 1727395200, // 27 July, 2024 in Unix timestamp - score: 4.9, - }, - { - id: 6, - date: 1727395200, // 27 July, 2024 in Unix timestamp - score: 4.9, - }, - { - id: 7, - date: 1727395200, // 27 July, 2024 in Unix timestamp - score: 4.9, - }, - { - id: 8, - date: 1727395200, // 27 July, 2024 in Unix timestamp - score: 4.9, + scoreMedia: 4.9, }, ]; @@ -87,7 +67,7 @@ export const CardReviewSummary = () => { }, }} /> -

{miniReview.score}

+

{miniReview.scoreMedia}

{isStarSelected === index && (
@@ -98,7 +78,21 @@ export const CardReviewSummary = () => { )}
- {isStarSelected !== null && } + {isStarSelected !== null && ( + + )} + {/* + // : ( + // + // ) */}
); diff --git a/components/Pages/Project/Review/DynamicStarsReview.tsx b/components/Pages/Project/Review/DynamicStarsReview.tsx new file mode 100644 index 00000000..96c8ffc8 --- /dev/null +++ b/components/Pages/Project/Review/DynamicStarsReview.tsx @@ -0,0 +1,56 @@ +"use client"; +import React, { useState } from "react"; +import { StarReviewIcon } from "@/components/Icons/StarReview"; + +interface DynamicStarsReviewProps { + totalStars: number; + rating: number; + setRating: (rating: number) => void; + editableReview: boolean; +} + +export const DynamicStarsReview = ({ + totalStars, + rating, + setRating, + editableReview, +}: DynamicStarsReviewProps) => { + const [hover, setHover] = useState(null); + + const handleStarClick = (index: number) => { + if (editableReview) { + setRating(index); + } + }; + + return ( +
+ {[...Array(totalStars)].map((_, index) => { + const currentRating = index + 1; + const isHoveredOrRated = currentRating <= (hover || rating || 0); + + return ( + handleStarClick(currentRating) + : undefined, + style: { + fill: isHoveredOrRated ? "#004EEB" : "none", + stroke: isHoveredOrRated ? "#004EEB" : "#98A2B3", + }, + onMouseEnter: editableReview + ? () => setHover(currentRating) + : undefined, + onMouseLeave: editableReview ? () => setHover(null) : undefined, + }} + /> + ); + })} +
+ ); +}; diff --git a/components/Pages/Project/Review/index.tsx b/components/Pages/Project/Review/index.tsx index 63e4f527..445d9e9d 100644 --- a/components/Pages/Project/Review/index.tsx +++ b/components/Pages/Project/Review/index.tsx @@ -153,8 +153,8 @@ export const ReviewSection = ({ grant }: GrantAllReviewsProps) => { +
+
+ ); +}; From 84af8c0820b1eddbac3fbc8819694b9b672ccf1d Mon Sep 17 00:00:00 2001 From: heronlancellot Date: Fri, 9 Aug 2024 13:02:51 -0300 Subject: [PATCH 036/139] update: index with new fluxe --- components/Pages/Project/Review/index.tsx | 76 ++++++++++++++++------- 1 file changed, 55 insertions(+), 21 deletions(-) diff --git a/components/Pages/Project/Review/index.tsx b/components/Pages/Project/Review/index.tsx index 445d9e9d..b2da920e 100644 --- a/components/Pages/Project/Review/index.tsx +++ b/components/Pages/Project/Review/index.tsx @@ -9,8 +9,10 @@ import { StarIcon } from "@/components/Icons"; import { Spinner } from "@/components/Utilities/Spinner"; import { Button } from "@/components/Utilities/Button"; import { NavbarReview } from "@/components/Pages/Project/Review/NavbarReview"; -// import { useConnectModal } from "@rainbow-me/rainbowkit"; -// import { useAccount } from "wagmi"; +import { useConnectModal } from "@rainbow-me/rainbowkit"; +import { useAccount } from "wagmi"; +import { CardNewReview } from "./CardNewReview"; +import { XMarkIcon } from "@heroicons/react/24/solid"; interface GrantAllReviewsProps { grant: IGrantResponse | undefined; @@ -55,8 +57,9 @@ export const ReviewSection = ({ grant }: GrantAllReviewsProps) => { const [page, setPage] = useState(1); const [pageAnon, setPageAnon] = useState(1); const pageLimit = 10; - // const { openConnectModal } = useConnectModal(); - // const { isConnected, address } = useAccount(); + const { openConnectModal } = useConnectModal(); + const { isConnected } = useAccount(); + const [isOpenReview, setIsOpenReview] = useState(false); useEffect(() => { if (!grant) return; @@ -146,23 +149,54 @@ export const ReviewSection = ({ grant }: GrantAllReviewsProps) => {
-
-

- All reviews of {grant?.details?.data?.title} -

- -
- - + {isOpenReview ? ( + <> + {isConnected ? ( + <> +
+

Write a new review

+ +
+ + {/* id = data.lenght + 1 ( last one created)*/} + + ) : ( +
+

+ Please connect your wallet +

+ +
+ )} + + ) : ( + <> +
+

+ All reviews of {grant?.details?.data?.title} +

+ +
+ + + )}
From 3b8764f27c90280b5f84a3f854b69f9e4b851181 Mon Sep 17 00:00:00 2001 From: heronlancellot Date: Fri, 9 Aug 2024 13:03:17 -0300 Subject: [PATCH 037/139] refactor: navbar-review more legible --- components/Pages/Project/Review/NavbarReview.tsx | 14 +------------- 1 file changed, 1 insertion(+), 13 deletions(-) diff --git a/components/Pages/Project/Review/NavbarReview.tsx b/components/Pages/Project/Review/NavbarReview.tsx index 79e19da9..5058a97b 100644 --- a/components/Pages/Project/Review/NavbarReview.tsx +++ b/components/Pages/Project/Review/NavbarReview.tsx @@ -100,20 +100,8 @@ export const NavbarReview = () => {
{isStarSelected !== null && ( - + )} - {/* - // : ( - // - // ) */}
); From 43c88e3c723d713c7ea68dcf142d59f895663e28 Mon Sep 17 00:00:00 2001 From: heronlancellot Date: Mon, 12 Aug 2024 10:21:26 -0300 Subject: [PATCH 038/139] feat: add review store data using zustand --- store/review.ts | 375 ++++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 375 insertions(+) create mode 100644 store/review.ts diff --git a/store/review.ts b/store/review.ts new file mode 100644 index 00000000..29dbd027 --- /dev/null +++ b/store/review.ts @@ -0,0 +1,375 @@ +import { BadgeName } from "@/components/Icons/Badge"; +import { BadgeListProps } from "@/components/Pages/Project/Review/CardReview"; +import { create } from "zustand"; + +interface ReviewStore { + newReview: BadgeListProps[]; + setNewReview: (newReview: BadgeListProps[]) => void; + badgeList: BadgeListProps[][]; + setBadgeList: (badgeList: BadgeListProps[][]) => void; +} + +const defaultInitialNewReviewList: BadgeListProps[] = [ + { + name: BadgeName.CLEAR_GOALS, + description: + "Clear Goals: Recognizes programs with well-defined goals. Every grant program has a goal, such as governance, impact, or education. Are these goals well explained so you can build a project aligned with them?", + score: 0, + }, + { + name: BadgeName.SMOOTH_APPLICATION, + description: + "Smooth Application: Awards a seamless application process. Are they using a tech that facilitates the application process? Did they get back to you after the application, ou foi apenas um formulário genérico?", + score: 0, + }, + { + name: BadgeName.FAIR_ROUNDS, + description: + "Fair rounds: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla sem urna, sodales vel placerat sed, elementum a orci. Duis sit amet neque rutrum, suscipit enim tempus, dignissim erat. Etiam interdum dignissim pretium.", + score: 0, + }, + { + name: BadgeName.EASY_TEACH, + description: + "Easy Tech: Awards programs with easily implementable technology. How hard is the tech? Are the docs easy to use or find?", + score: 0, + }, + { + name: BadgeName.SUPPORTIVE_TEAM, + description: + "Supportive Team: Highlights programs with highly supportive teams. Whether technical or not, if you receive very helpful support after applying for a grant, issue this badge. – Post-Grant Support: Highlights strong post-grant support. How much do they help you after the application? Do they suggest related projects, possible connections, or interested people?", + score: 0, + }, + { + name: BadgeName.GREAT_REVIEWERS, + description: + "Great Reviewers: Recognizes top-quality grant reviewers. They are impartial, select well-written projects, set clear goals, and explain the application process well.", + score: 0, + }, + { + name: BadgeName.FAST_DISBURSEMENT, + description: + "Fast Disbursement: Commends quick fund disbursement processes. Did they complete the payment as soon as you completed the milestones? If yes, issue this badge.", + score: 0, + }, +]; + +const initialBadgeList: BadgeListProps[][] = [ + [ + { + name: BadgeName.CLEAR_GOALS, + description: + "Clear Goals: Recognizes programs with well-defined goals. Every grant program has a goal, such as governance, impact, or education. Are these goals well explained so you can build a project aligned with them?", + score: 5, + }, + { + name: BadgeName.SMOOTH_APPLICATION, + description: + "Smooth Application: Awards a seamless application process. Are they using a tech that facilitates the application process? Did they get back to you after the application, or was it just a poor form?", + score: 4, + }, + { + name: BadgeName.FAIR_ROUNDS, + description: + "Fair rounds: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla sem urna, sodales vel placerat sed, elementum a orci. Duis sit amet neque rutrum, suscipit enim tempus, dignissim erat. Etiam interdum dignissim pretium.", + score: 4, + }, + { + name: BadgeName.EASY_TEACH, + description: + "Easy Tech: Awards programs with easily implementable technology. How hard is the tech? Are the docs easy to use or find?", + score: 4, + }, + { + name: BadgeName.SUPPORTIVE_TEAM, + description: + "Supportive Team: Highlights programs with highly supportive teams. Whether technical or not, if you receive very helpful support after applying for a grant, issue this badge. – Post-Grant Support: Highlights strong post-grant support. How much do they help you after the application? Do they suggest related projects, possible connections, or interested people?", + score: 4, + }, + { + name: BadgeName.GREAT_REVIEWERS, + description: + "Great Reviewers: Recognizes top-quality grant reviewers. They are impartial, select well-written projects, set clear goals, and explain the application process well.", + score: 4, + }, + { + name: BadgeName.FAST_DISBURSEMENT, + description: + "Fast Disbursement: Commends quick fund disbursement processes. Did they complete the payment as soon as you completed the milestones? If yes, issue this badge.", + score: 4, + }, + ], + [ + { + name: BadgeName.CLEAR_GOALS, + description: + "Clear Goals: Recognizes programs with well-defined goals. Every grant program has a goal, such as governance, impact, or education. Are these goals well explained so you can build a project aligned with them?", + score: 2, + }, + { + name: BadgeName.SMOOTH_APPLICATION, + description: + "Smooth Application: Awards a seamless application process. Are they using a tech that facilitates the application process? Did they get back to you after the application, or was it just a poor form?", + score: 3, + }, + { + name: BadgeName.FAIR_ROUNDS, + description: + "Fair rounds: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla sem urna, sodales vel placerat sed, elementum a orci. Duis sit amet neque rutrum, suscipit enim tempus, dignissim erat. Etiam interdum dignissim pretium.", + score: 5, + }, + { + name: BadgeName.EASY_TEACH, + description: + "Easy Tech: Awards programs with easily implementable technology. How hard is the tech? Are the docs easy to use or find?", + score: 1, + }, + { + name: BadgeName.SUPPORTIVE_TEAM, + description: + "Supportive Team: Highlights programs with highly supportive teams. Whether technical or not, if you receive very helpful support after applying for a grant, issue this badge. – Post-Grant Support: Highlights strong post-grant support. How much do they help you after the application? Do they suggest related projects, possible connections, or interested people?", + score: 1, + }, + { + name: BadgeName.GREAT_REVIEWERS, + description: + "Great Reviewers: Recognizes top-quality grant reviewers. They are impartial, select well-written projects, set clear goals, and explain the application process well.", + score: 2, + }, + { + name: BadgeName.FAST_DISBURSEMENT, + description: + "Fast Disbursement: Commends quick fund disbursement processes. Did they complete the payment as soon as you completed the milestones? If yes, issue this badge.", + score: 3, + }, + ], + [ + { + name: BadgeName.CLEAR_GOALS, + description: + "Clear Goals: Recognizes programs with well-defined goals. Every grant program has a goal, such as governance, impact, or education. Are these goals well explained so you can build a project aligned with them?", + score: 4, + }, + { + name: BadgeName.SMOOTH_APPLICATION, + description: + "Smooth Application: Awards a seamless application process. Are they using a tech that facilitates the application process? Did they get back to you after the application, or was it just a poor form?", + score: 4, + }, + { + name: BadgeName.FAIR_ROUNDS, + description: + "Fair rounds: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla sem urna, sodales vel placerat sed, elementum a orci. Duis sit amet neque rutrum, suscipit enim tempus, dignissim erat. Etiam interdum dignissim pretium.", + score: 2, + }, + { + name: BadgeName.EASY_TEACH, + description: + "Easy Tech: Awards programs with easily implementable technology. How hard is the tech? Are the docs easy to use or find?", + score: 3, + }, + { + name: BadgeName.SUPPORTIVE_TEAM, + description: + "Supportive Team: Highlights programs with highly supportive teams. Whether technical or not, if you receive very helpful support after applying for a grant, issue this badge. – Post-Grant Support: Highlights strong post-grant support. How much do they help you after the application? Do they suggest related projects, possible connections, or interested people?", + score: 5, + }, + { + name: BadgeName.GREAT_REVIEWERS, + description: + "Great Reviewers: Recognizes top-quality grant reviewers. They are impartial, select well-written projects, set clear goals, and explain the application process well.", + score: 2, + }, + { + name: BadgeName.FAST_DISBURSEMENT, + description: + "Fast Disbursement: Commends quick fund disbursement processes. Did they complete the payment as soon as you completed the milestones? If yes, issue this badge.", + score: 1, + }, + ], + [ + { + name: BadgeName.CLEAR_GOALS, + description: + "Clear Goals: Recognizes programs with well-defined goals. Every grant program has a goal, such as governance, impact, or education. Are these goals well explained so you can build a project aligned with them?", + score: 2, + }, + { + name: BadgeName.SMOOTH_APPLICATION, + description: + "Smooth Application: Awards a seamless application process. Are they using a tech that facilitates the application process? Did they get back to you after the application, or was it just a poor form?", + score: 2, + }, + { + name: BadgeName.FAIR_ROUNDS, + description: + "Fair rounds: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla sem urna, sodales vel placerat sed, elementum a orci. Duis sit amet neque rutrum, suscipit enim tempus, dignissim erat. Etiam interdum dignissim pretium.", + score: 3, + }, + { + name: BadgeName.EASY_TEACH, + description: + "Easy Tech: Awards programs with easily implementable technology. How hard is the tech? Are the docs easy to use or find?", + score: 1, + }, + { + name: BadgeName.SUPPORTIVE_TEAM, + description: + "Supportive Team: Highlights programs with highly supportive teams. Whether technical or not, if you receive very helpful support after applying for a grant, issue this badge. – Post-Grant Support: Highlights strong post-grant support. How much do they help you after the application? Do they suggest related projects, possible connections, or interested people?", + score: 1, + }, + { + name: BadgeName.GREAT_REVIEWERS, + description: + "Great Reviewers: Recognizes top-quality grant reviewers. They are impartial, select well-written projects, set clear goals, and explain the application process well.", + score: 2, + }, + { + name: BadgeName.FAST_DISBURSEMENT, + description: + "Fast Disbursement: Commends quick fund disbursement processes. Did they complete the payment as soon as you completed the milestones? If yes, issue this badge.", + score: 1, + }, + ], + [ + { + name: BadgeName.CLEAR_GOALS, + description: + "Clear Goals: Recognizes programs with well-defined goals. Every grant program has a goal, such as governance, impact, or education. Are these goals well explained so you can build a project aligned with them?", + score: 1, + }, + { + name: BadgeName.SMOOTH_APPLICATION, + description: + "Smooth Application: Awards a seamless application process. Are they using a tech that facilitates the application process? Did they get back to you after the application, or was it just a poor form?", + score: 2, + }, + { + name: BadgeName.FAIR_ROUNDS, + description: + "Fair rounds: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla sem urna, sodales vel placerat sed, elementum a orci. Duis sit amet neque rutrum, suscipit enim tempus, dignissim erat. Etiam interdum dignissim pretium.", + score: 2, + }, + { + name: BadgeName.EASY_TEACH, + description: + "Easy Tech: Awards programs with easily implementable technology. How hard is the tech? Are the docs easy to use or find?", + score: 3, + }, + { + name: BadgeName.SUPPORTIVE_TEAM, + description: + "Supportive Team: Highlights programs with highly supportive teams. Whether technical or not, if you receive very helpful support after applying for a grant, issue this badge. – Post-Grant Support: Highlights strong post-grant support. How much do they help you after the application? Do they suggest related projects, possible connections, or interested people?", + score: 5, + }, + { + name: BadgeName.GREAT_REVIEWERS, + description: + "Great Reviewers: Recognizes top-quality grant reviewers. They are impartial, select well-written projects, set clear goals, and explain the application process well.", + score: 3, + }, + { + name: BadgeName.FAST_DISBURSEMENT, + description: + "Fast Disbursement: Commends quick fund disbursement processes. Did they complete the payment as soon as you completed the milestones? If yes, issue this badge.", + score: 2, + }, + ], + [ + { + name: BadgeName.CLEAR_GOALS, + description: + "Clear Goals: Recognizes programs with well-defined goals. Every grant program has a goal, such as governance, impact, or education. Are these goals well explained so you can build a project aligned with them?", + score: 5, + }, + { + name: BadgeName.SMOOTH_APPLICATION, + description: + "Smooth Application: Awards a seamless application process. Are they using a tech that facilitates the application process? Did they get back to you after the application, or was it just a poor form?", + score: 4, + }, + { + name: BadgeName.FAIR_ROUNDS, + description: + "Fair rounds: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla sem urna, sodales vel placerat sed, elementum a orci. Duis sit amet neque rutrum, suscipit enim tempus, dignissim erat. Etiam interdum dignissim pretium.", + score: 3, + }, + { + name: BadgeName.EASY_TEACH, + description: + "Easy Tech: Awards programs with easily implementable technology. How hard is the tech? Are the docs easy to use or find?", + score: 5, + }, + { + name: BadgeName.SUPPORTIVE_TEAM, + description: + "Supportive Team: Highlights programs with highly supportive teams. Whether technical or not, if you receive very helpful support after applying for a grant, issue this badge. – Post-Grant Support: Highlights strong post-grant support. How much do they help you after the application? Do they suggest related projects, possible connections, or interested people?", + score: 5, + }, + { + name: BadgeName.GREAT_REVIEWERS, + description: + "Great Reviewers: Recognizes top-quality grant reviewers. They are impartial, select well-written projects, set clear goals, and explain the application process well.", + score: 4, + }, + { + name: BadgeName.FAST_DISBURSEMENT, + description: + "Fast Disbursement: Commends quick fund disbursement processes. Did they complete the payment as soon as you completed the milestones? If yes, issue this badge.", + score: 4, + }, + ], + [ + { + name: BadgeName.CLEAR_GOALS, + description: + "Clear Goals: Recognizes programs with well-defined goals. Every grant program has a goal, such as governance, impact, or education. Are these goals well explained so you can build a project aligned with them?", + score: 2, + }, + { + name: BadgeName.SMOOTH_APPLICATION, + description: + "Smooth Application: Awards a seamless application process. Are they using a tech that facilitates the application process? Did they get back to you after the application, or was it just a poor form?", + score: 2, + }, + { + name: BadgeName.FAIR_ROUNDS, + description: + "Fair rounds: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla sem urna, sodales vel placerat sed, elementum a orci. Duis sit amet neque rutrum, suscipit enim tempus, dignissim erat. Etiam interdum dignissim pretium.", + score: 1, + }, + { + name: BadgeName.EASY_TEACH, + description: + "Easy Tech: Awards programs with easily implementable technology. How hard is the tech? Are the docs easy to use or find?", + score: 5, + }, + { + name: BadgeName.SUPPORTIVE_TEAM, + description: + "Supportive Team: Highlights programs with highly supportive teams. Whether technical or not, if you receive very helpful support after applying for a grant, issue this badge. – Post-Grant Support: Highlights strong post-grant support. How much do they help you after the application? Do they suggest related projects, possible connections, or interested people?", + score: 5, + }, + { + name: BadgeName.GREAT_REVIEWERS, + description: + "Great Reviewers: Recognizes top-quality grant reviewers. They are impartial, select well-written projects, set clear goals, and explain the application process well.", + score: 4, + }, + { + name: BadgeName.FAST_DISBURSEMENT, + description: + "Fast Disbursement: Commends quick fund disbursement processes. Did they complete the payment as soon as you completed the milestones? If yes, issue this badge.", + score: 4, + }, + ], +]; + +export const useReviewStore = create((set, get) => ({ + newReview: defaultInitialNewReviewList, + setNewReview: (newReview: BadgeListProps[]) => + set((state) => ({ ...state, newReview })), + badgeList: initialBadgeList, + setBadgeList: (badgeList: BadgeListProps[][]) => + set((state) => ({ ...state, badgeList })), +})); From f18f6275bc5fca3b81183bbd046cead3ec4cac73 Mon Sep 17 00:00:00 2001 From: heronlancellot Date: Mon, 12 Aug 2024 10:22:33 -0300 Subject: [PATCH 039/139] update: use context data wit reviewStore zustand --- .../Pages/Project/Review/CardNewReview.tsx | 55 +----- .../Pages/Project/Review/CardReview.tsx | 186 +----------------- 2 files changed, 9 insertions(+), 232 deletions(-) diff --git a/components/Pages/Project/Review/CardNewReview.tsx b/components/Pages/Project/Review/CardNewReview.tsx index 15a69d4d..03c7d1ce 100644 --- a/components/Pages/Project/Review/CardNewReview.tsx +++ b/components/Pages/Project/Review/CardNewReview.tsx @@ -1,60 +1,15 @@ "use client"; -import { BadgeIcon, BadgeName } from "@/components/Icons/Badge"; +import { BadgeIcon } from "@/components/Icons/Badge"; import { Button } from "@/components/Utilities/Button"; -import React, { useState } from "react"; +import React from "react"; import { DynamicStarsReview } from "./DynamicStarsReview"; import { BadgeListProps, CardReviewMode } from "./CardReview"; +import { useReviewStore } from "@/store/review"; export const CardNewReview = ({ id }: { id: number }) => { - const defaultInitialBadgeList: BadgeListProps[] = [ - { - name: BadgeName.CLEAR_GOALS, - description: - "Clear Goals: Recognizes programs with well-defined goals. Every grant program has a goal, such as governance, impact, or education. Are these goals well explained so you can build a project aligned with them?", - score: 0, - }, - { - name: BadgeName.SMOOTH_APPLICATION, - description: - "Smooth Application: Awards a seamless application process. Are they using a tech that facilitates the application process? Did they get back to you after the application, ou foi apenas um formulário genérico?", - score: 0, - }, - { - name: BadgeName.FAIR_ROUNDS, - description: - "Fair rounds: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla sem urna, sodales vel placerat sed, elementum a orci. Duis sit amet neque rutrum, suscipit enim tempus, dignissim erat. Etiam interdum dignissim pretium.", - score: 0, - }, - { - name: BadgeName.EASY_TEACH, - description: - "Easy Tech: Awards programs with easily implementable technology. How hard is the tech? Are the docs easy to use or find?", - score: 0, - }, - { - name: BadgeName.SUPPORTIVE_TEAM, - description: - "Supportive Team: Highlights programs with highly supportive teams. Whether technical or not, if you receive very helpful support after applying for a grant, issue this badge. – Post-Grant Support: Highlights strong post-grant support. How much do they help you after the application? Do they suggest related projects, possible connections, or interested people?", - score: 0, - }, - { - name: BadgeName.GREAT_REVIEWERS, - description: - "Great Reviewers: Recognizes top-quality grant reviewers. They are impartial, select well-written projects, set clear goals, and explain the application process well.", - score: 0, - }, - { - name: BadgeName.FAST_DISBURSEMENT, - description: - "Fast Disbursement: Commends quick fund disbursement processes. Did they complete the payment as soon as you completed the milestones? If yes, issue this badge.", - score: 0, - }, - ]; - - const [newReview, setNewReview] = useState( - defaultInitialBadgeList - ); + const setNewReview = useReviewStore((state) => state.setNewReview); + const newReview = useReviewStore((state) => state.newReview); const handleSetRating = (index: number, rating: number) => { const updatedBadges = [...newReview]; diff --git a/components/Pages/Project/Review/CardReview.tsx b/components/Pages/Project/Review/CardReview.tsx index 645a0a8b..b73b3238 100644 --- a/components/Pages/Project/Review/CardReview.tsx +++ b/components/Pages/Project/Review/CardReview.tsx @@ -2,8 +2,9 @@ import { BadgeIcon, BadgeName } from "@/components/Icons/Badge"; import { Button } from "@/components/Utilities/Button"; -import React, { useState } from "react"; +import React from "react"; import { DynamicStarsReview } from "./DynamicStarsReview"; +import { useReviewStore } from "@/store/review"; export enum CardReviewMode { READ = "READ", @@ -21,187 +22,8 @@ export interface BadgeListProps { } export const CardReview = (data: CardReviewDataProps) => { - const initialBadgeList: BadgeListProps[][] = [ - [ - { - name: BadgeName.CLEAR_GOALS, - description: - "Clear Goals: Recognizes programs with well-defined goals. Every grant program has a goal, such as governance, impact, or education. Are these goals well explained so you can build a project aligned with them?", - score: 5, - }, - { - name: BadgeName.SMOOTH_APPLICATION, - description: - "Smooth Application: Awards a seamless application process. Are they using a tech that facilitates the application process? Did they get back to you after the application, or was it just a poor form?", - score: 4, - }, - { - name: BadgeName.FAIR_ROUNDS, - description: - "Fair rounds: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla sem urna, sodales vel placerat sed, elementum a orci. Duis sit amet neque rutrum, suscipit enim tempus, dignissim erat. Etiam interdum dignissim pretium.", - score: 4, - }, - { - name: BadgeName.EASY_TEACH, - description: - "Easy Tech: Awards programs with easily implementable technology. How hard is the tech? Are the docs easy to use or find?", - score: 4, - }, - { - name: BadgeName.SUPPORTIVE_TEAM, - description: - "Supportive Team: Highlights programs with highly supportive teams. Whether technical or not, if you receive very helpful support after applying for a grant, issue this badge. – Post-Grant Support: Highlights strong post-grant support. How much do they help you after the application? Do they suggest related projects, possible connections, or interested people?", - score: 4, - }, - { - name: BadgeName.GREAT_REVIEWERS, - description: - "Great Reviewers: Recognizes top-quality grant reviewers. They are impartial, select well-written projects, set clear goals, and explain the application process well.", - score: 4, - }, - { - name: BadgeName.FAST_DISBURSEMENT, - description: - "Fast Disbursement: Commends quick fund disbursement processes. Did they complete the payment as soon as you completed the milestones? If yes, issue this badge.", - score: 4, - }, - ], - [ - { - name: BadgeName.CLEAR_GOALS, - description: - "Clear Goals: Recognizes programs with well-defined goals. Every grant program has a goal, such as governance, impact, or education. Are these goals well explained so you can build a project aligned with them?", - score: 4, - }, - { - name: BadgeName.SMOOTH_APPLICATION, - description: - "Smooth Application: Awards a seamless application process. Are they using a tech that facilitates the application process? Did they get back to you after the application, or was it just a poor form?", - score: 4, - }, - { - name: BadgeName.FAIR_ROUNDS, - description: - "Fair rounds: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla sem urna, sodales vel placerat sed, elementum a orci. Duis sit amet neque rutrum, suscipit enim tempus, dignissim erat. Etiam interdum dignissim pretium.", - score: 4, - }, - { - name: BadgeName.EASY_TEACH, - description: - "Easy Tech: Awards programs with easily implementable technology. How hard is the tech? Are the docs easy to use or find?", - score: 4, - }, - { - name: BadgeName.SUPPORTIVE_TEAM, - description: - "Supportive Team: Highlights programs with highly supportive teams. Whether technical or not, if you receive very helpful support after applying for a grant, issue this badge. – Post-Grant Support: Highlights strong post-grant support. How much do they help you after the application? Do they suggest related projects, possible connections, or interested people?", - score: 4, - }, - { - name: BadgeName.GREAT_REVIEWERS, - description: - "Great Reviewers: Recognizes top-quality grant reviewers. They are impartial, select well-written projects, set clear goals, and explain the application process well.", - score: 4, - }, - { - name: BadgeName.FAST_DISBURSEMENT, - description: - "Fast Disbursement: Commends quick fund disbursement processes. Did they complete the payment as soon as you completed the milestones? If yes, issue this badge.", - score: 4, - }, - ], - [ - { - name: BadgeName.CLEAR_GOALS, - description: - "Clear Goals: Recognizes programs with well-defined goals. Every grant program has a goal, such as governance, impact, or education. Are these goals well explained so you can build a project aligned with them?", - score: 4, - }, - { - name: BadgeName.SMOOTH_APPLICATION, - description: - "Smooth Application: Awards a seamless application process. Are they using a tech that facilitates the application process? Did they get back to you after the application, or was it just a poor form?", - score: 4, - }, - { - name: BadgeName.FAIR_ROUNDS, - description: - "Fair rounds: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla sem urna, sodales vel placerat sed, elementum a orci. Duis sit amet neque rutrum, suscipit enim tempus, dignissim erat. Etiam interdum dignissim pretium.", - score: 4, - }, - { - name: BadgeName.EASY_TEACH, - description: - "Easy Tech: Awards programs with easily implementable technology. How hard is the tech? Are the docs easy to use or find?", - score: 4, - }, - { - name: BadgeName.SUPPORTIVE_TEAM, - description: - "Supportive Team: Highlights programs with highly supportive teams. Whether technical or not, if you receive very helpful support after applying for a grant, issue this badge. – Post-Grant Support: Highlights strong post-grant support. How much do they help you after the application? Do they suggest related projects, possible connections, or interested people?", - score: 4, - }, - { - name: BadgeName.GREAT_REVIEWERS, - description: - "Great Reviewers: Recognizes top-quality grant reviewers. They are impartial, select well-written projects, set clear goals, and explain the application process well.", - score: 4, - }, - { - name: BadgeName.FAST_DISBURSEMENT, - description: - "Fast Disbursement: Commends quick fund disbursement processes. Did they complete the payment as soon as you completed the milestones? If yes, issue this badge.", - score: 4, - }, - ], - [ - { - name: BadgeName.CLEAR_GOALS, - description: - "Clear Goals: Recognizes programs with well-defined goals. Every grant program has a goal, such as governance, impact, or education. Are these goals well explained so you can build a project aligned with them?", - score: 4, - }, - { - name: BadgeName.SMOOTH_APPLICATION, - description: - "Smooth Application: Awards a seamless application process. Are they using a tech that facilitates the application process? Did they get back to you after the application, or was it just a poor form?", - score: 4, - }, - { - name: BadgeName.FAIR_ROUNDS, - description: - "Fair rounds: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla sem urna, sodales vel placerat sed, elementum a orci. Duis sit amet neque rutrum, suscipit enim tempus, dignissim erat. Etiam interdum dignissim pretium.", - score: 4, - }, - { - name: BadgeName.EASY_TEACH, - description: - "Easy Tech: Awards programs with easily implementable technology. How hard is the tech? Are the docs easy to use or find?", - score: 4, - }, - { - name: BadgeName.SUPPORTIVE_TEAM, - description: - "Supportive Team: Highlights programs with highly supportive teams. Whether technical or not, if you receive very helpful support after applying for a grant, issue this badge. – Post-Grant Support: Highlights strong post-grant support. How much do they help you after the application? Do they suggest related projects, possible connections, or interested people?", - score: 4, - }, - { - name: BadgeName.GREAT_REVIEWERS, - description: - "Great Reviewers: Recognizes top-quality grant reviewers. They are impartial, select well-written projects, set clear goals, and explain the application process well.", - score: 4, - }, - { - name: BadgeName.FAST_DISBURSEMENT, - description: - "Fast Disbursement: Commends quick fund disbursement processes. Did they complete the payment as soon as you completed the milestones? If yes, issue this badge.", - score: 4, - }, - ], - ]; - - const [badgeList, setBadgeList] = - useState(initialBadgeList); + const setBadgeList = useReviewStore((state) => state.setBadgeList); + const badgeList = useReviewStore((state) => state.badgeList); const selectedBadgeList = badgeList[data.id] || []; From 58447098168f7ad6568dc25920bfb05a18aab9b8 Mon Sep 17 00:00:00 2001 From: heronlancellot Date: Mon, 12 Aug 2024 10:27:59 -0300 Subject: [PATCH 040/139] fix: remove submit review button from card-review --- components/Pages/Project/Review/CardReview.tsx | 3 --- 1 file changed, 3 deletions(-) diff --git a/components/Pages/Project/Review/CardReview.tsx b/components/Pages/Project/Review/CardReview.tsx index b73b3238..b1ddc1fe 100644 --- a/components/Pages/Project/Review/CardReview.tsx +++ b/components/Pages/Project/Review/CardReview.tsx @@ -70,9 +70,6 @@ export const CardReview = (data: CardReviewDataProps) => {
))}
-
- -
); }; From 9a1bb95fd88d3578928f1b121ccb037c563fef19 Mon Sep 17 00:00:00 2001 From: heronlancellot Date: Mon, 12 Aug 2024 11:02:21 -0300 Subject: [PATCH 041/139] fix: remove unnused import --- components/Pages/Project/Review/CardReview.tsx | 1 - 1 file changed, 1 deletion(-) diff --git a/components/Pages/Project/Review/CardReview.tsx b/components/Pages/Project/Review/CardReview.tsx index b1ddc1fe..e5d4b064 100644 --- a/components/Pages/Project/Review/CardReview.tsx +++ b/components/Pages/Project/Review/CardReview.tsx @@ -1,7 +1,6 @@ "use client"; import { BadgeIcon, BadgeName } from "@/components/Icons/Badge"; -import { Button } from "@/components/Utilities/Button"; import React from "react"; import { DynamicStarsReview } from "./DynamicStarsReview"; import { useReviewStore } from "@/store/review"; From 08451baf7c362a82674ae4f293dfcaef61ea82da Mon Sep 17 00:00:00 2001 From: heronlancellot Date: Mon, 12 Aug 2024 14:33:03 -0300 Subject: [PATCH 042/139] feat: add connect wallet if the user isn't connected --- components/Pages/Project/Review/index.tsx | 83 +++++++++++++---------- 1 file changed, 47 insertions(+), 36 deletions(-) diff --git a/components/Pages/Project/Review/index.tsx b/components/Pages/Project/Review/index.tsx index b2da920e..cdf232df 100644 --- a/components/Pages/Project/Review/index.tsx +++ b/components/Pages/Project/Review/index.tsx @@ -13,6 +13,7 @@ import { useConnectModal } from "@rainbow-me/rainbowkit"; import { useAccount } from "wagmi"; import { CardNewReview } from "./CardNewReview"; import { XMarkIcon } from "@heroicons/react/24/solid"; +import { isAddressEqual } from "viem"; interface GrantAllReviewsProps { grant: IGrantResponse | undefined; @@ -58,7 +59,7 @@ export const ReviewSection = ({ grant }: GrantAllReviewsProps) => { const [pageAnon, setPageAnon] = useState(1); const pageLimit = 10; const { openConnectModal } = useConnectModal(); - const { isConnected } = useAccount(); + const { isConnected, address } = useAccount(); const [isOpenReview, setIsOpenReview] = useState(false); useEffect(() => { @@ -145,37 +146,34 @@ export const ReviewSection = ({ grant }: GrantAllReviewsProps) => { setAnonReviews(slicedAnonData); }, [page]); + const handleReviewButton = () => { + if (!isConnected && openConnectModal) { + openConnectModal(); + } else { + setIsOpenReview(!isOpenReview); + } + }; + return (
{isOpenReview ? ( <> - {isConnected ? ( - <> -
-

Write a new review

- -
- - {/* id = data.lenght + 1 ( last one created)*/} - - ) : ( -
-

- Please connect your wallet -

- -
- )} +
+

Write a new review

+ +
+ + {/* id = data.lenght + 1 ( last one created)*/} ) : ( <> @@ -183,16 +181,29 @@ export const ReviewSection = ({ grant }: GrantAllReviewsProps) => {

All reviews of {grant?.details?.data?.title}

- + {isConnected && + project?.recipient && + address && + isAddressEqual(project.recipient, address) ? ( + + ) : ( + !isConnected && ( + + ) + )}
From 2354442e923425dd9ad9e3faa4b8e0398bba98ad Mon Sep 17 00:00:00 2001 From: heronlancellot Date: Mon, 12 Aug 2024 16:09:51 -0300 Subject: [PATCH 043/139] fix: console error badge svg --- components/Icons/Badge.tsx | 36 ++++++++++++++++++------------------ 1 file changed, 18 insertions(+), 18 deletions(-) diff --git a/components/Icons/Badge.tsx b/components/Icons/Badge.tsx index ca935e38..16531a9e 100644 --- a/components/Icons/Badge.tsx +++ b/components/Icons/Badge.tsx @@ -155,8 +155,8 @@ export const BadgeIcon: React.FC = ({ fill="#EFF6FF" stroke="#C7D9FB" /> - - + + = ({ filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB" > - + = ({ fill="#EFF6FF" stroke="#C7D9FB" /> - - + + = ({ filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB" > - + = ({ cy="38" r="19" fill="#1D58CD" - fill-opacity="0.05" + fillOpacity="0.05" /> = ({ cy="38" r="22" fill="#1D58CD" - fill-opacity="0.05" + fillOpacity="0.05" /> = ({ filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB" > - + = ({ fill="#EFF6FF" stroke="#C7D9FB" /> - - + + = ({ filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB" > - + = ({ fill="#EFF6FF" stroke="#C7D9FB" /> - - + + = ({ filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB" > - + = ({ fill="#EFF6FF" stroke="#C7D9FB" /> - - + + = ({ filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB" > - + Date: Mon, 12 Aug 2024 17:04:56 -0300 Subject: [PATCH 044/139] feat: add review interface & udpate comonents using review array --- .../Pages/Project/Review/CardNewReview.tsx | 88 ++++++++++-- .../Pages/Project/Review/CardReview.tsx | 53 ++------ .../Project/Review/DynamicStarsReview.tsx | 19 +-- .../Pages/Project/Review/NavbarReview.tsx | 67 ++-------- components/Pages/Project/Review/index.tsx | 126 +----------------- store/review.ts | 107 ++++++++------- 6 files changed, 169 insertions(+), 291 deletions(-) diff --git a/components/Pages/Project/Review/CardNewReview.tsx b/components/Pages/Project/Review/CardNewReview.tsx index 03c7d1ce..de2f4d57 100644 --- a/components/Pages/Project/Review/CardNewReview.tsx +++ b/components/Pages/Project/Review/CardNewReview.tsx @@ -1,15 +1,64 @@ "use client"; -import { BadgeIcon } from "@/components/Icons/Badge"; +import { useState } from "react"; +import { BadgeIcon, BadgeName } from "@/components/Icons/Badge"; import { Button } from "@/components/Utilities/Button"; -import React from "react"; -import { DynamicStarsReview } from "./DynamicStarsReview"; -import { BadgeListProps, CardReviewMode } from "./CardReview"; -import { useReviewStore } from "@/store/review"; +import { DynamicStarsReview, ReviewMode } from "./DynamicStarsReview"; +import { BadgeListProps } from "./CardReview"; +import { Review, useReviewStore } from "@/store/review"; -export const CardNewReview = ({ id }: { id: number }) => { - const setNewReview = useReviewStore((state) => state.setNewReview); - const newReview = useReviewStore((state) => state.newReview); +const defaultInitialNewReviewList: BadgeListProps[] = [ + { + name: BadgeName.CLEAR_GOALS, + description: + "Clear Goals: Recognizes programs with well-defined goals. Every grant program has a goal, such as governance, impact, or education. Are these goals well explained so you can build a project aligned with them?", + score: 0, + }, + { + name: BadgeName.SMOOTH_APPLICATION, + description: + "Smooth Application: Awards a seamless application process. Are they using a tech that facilitates the application process? Did they get back to you after the application, ou foi apenas um formulário genérico?", + score: 0, + }, + { + name: BadgeName.FAIR_ROUNDS, + description: + "Fair rounds: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla sem urna, sodales vel placerat sed, elementum a orci. Duis sit amet neque rutrum, suscipit enim tempus, dignissim erat. Etiam interdum dignissim pretium.", + score: 0, + }, + { + name: BadgeName.EASY_TEACH, + description: + "Easy Tech: Awards programs with easily implementable technology. How hard is the tech? Are the docs easy to use or find?", + score: 0, + }, + { + name: BadgeName.SUPPORTIVE_TEAM, + description: + "Supportive Team: Highlights programs with highly supportive teams. Whether technical or not, if you receive very helpful support after applying for a grant, issue this badge. – Post-Grant Support: Highlights strong post-grant support. How much do they help you after the application? Do they suggest related projects, possible connections, or interested people?", + score: 0, + }, + { + name: BadgeName.GREAT_REVIEWERS, + description: + "Great Reviewers: Recognizes top-quality grant reviewers. They are impartial, select well-written projects, set clear goals, and explain the application process well.", + score: 0, + }, + { + name: BadgeName.FAST_DISBURSEMENT, + description: + "Fast Disbursement: Commends quick fund disbursement processes. Did they complete the payment as soon as you completed the milestones? If yes, issue this badge.", + score: 0, + }, +]; + +export const CardNewReview = () => { + const [newReview, setNewReview] = useState( + defaultInitialNewReviewList + ); + const setReview = useReviewStore((state) => state.setReview); + const review = useReviewStore((state) => state.review); + const _currentTimestamp = Math.floor(new Date().getTime() / 1000); const handleSetRating = (index: number, rating: number) => { const updatedBadges = [...newReview]; @@ -17,6 +66,25 @@ export const CardNewReview = ({ id }: { id: number }) => { setNewReview(updatedBadges); }; + const handleSubmitReview = () => { + const totalScore = newReview.reduce( + (score, review) => score + review.score, + 0 + ); + const averageScore = newReview.length + ? Number((totalScore / newReview.length).toFixed(1)) + : 0; + + const newReviewData: Review = { + id: review.length + 1, + date: _currentTimestamp, + averageScore: averageScore, + reviews: newReview, + }; + + setReview([...review, newReviewData]); + }; + return (
@@ -32,7 +100,7 @@ export const CardNewReview = ({ id }: { id: number }) => { totalStars={5} rating={badge.score} setRating={(rating) => handleSetRating(index, rating)} - mode={CardReviewMode.WRITE} + mode={ReviewMode.WRITE} />
@@ -40,7 +108,7 @@ export const CardNewReview = ({ id }: { id: number }) => { ))}
- +
); diff --git a/components/Pages/Project/Review/CardReview.tsx b/components/Pages/Project/Review/CardReview.tsx index e5d4b064..8d330096 100644 --- a/components/Pages/Project/Review/CardReview.tsx +++ b/components/Pages/Project/Review/CardReview.tsx @@ -1,42 +1,18 @@ "use client"; import { BadgeIcon, BadgeName } from "@/components/Icons/Badge"; -import React from "react"; -import { DynamicStarsReview } from "./DynamicStarsReview"; +import { DynamicStarsReview, ReviewMode } from "./DynamicStarsReview"; import { useReviewStore } from "@/store/review"; -export enum CardReviewMode { - READ = "READ", - WRITE = "WRITE", -} -interface CardReviewDataProps { - id: number; - mode: CardReviewMode; -} - export interface BadgeListProps { name: BadgeName; description: string; score: number; } -export const CardReview = (data: CardReviewDataProps) => { - const setBadgeList = useReviewStore((state) => state.setBadgeList); - const badgeList = useReviewStore((state) => state.badgeList); - - const selectedBadgeList = badgeList[data.id] || []; - - const handleSetRating = (index: number, rating: number) => { - const updatedBadgeList = [...badgeList]; - const updatedBadges = [...updatedBadgeList[data.id]]; - - if (updatedBadges[index]) { - updatedBadges[index] = { ...updatedBadges[index], score: rating }; - } - - updatedBadgeList[data.id] = updatedBadges; - setBadgeList(updatedBadgeList); - }; +export const CardReview = ({ id }: { id: number }) => { + const review = useReviewStore((state) => state.review); + const selectedBadgeList = review[id].reviews || []; return (
@@ -49,21 +25,12 @@ export const CardReview = (data: CardReviewDataProps) => {
{badge.description}
- {data.mode === CardReviewMode.WRITE ? ( - handleSetRating(index, rating)} - mode={CardReviewMode.WRITE} - /> - ) : ( - {}} - mode={CardReviewMode.READ} - /> - )} + {}} + mode={ReviewMode.READ} + />
diff --git a/components/Pages/Project/Review/DynamicStarsReview.tsx b/components/Pages/Project/Review/DynamicStarsReview.tsx index 965277ce..154cc657 100644 --- a/components/Pages/Project/Review/DynamicStarsReview.tsx +++ b/components/Pages/Project/Review/DynamicStarsReview.tsx @@ -1,13 +1,16 @@ "use client"; import React, { useState } from "react"; import { StarReviewIcon } from "@/components/Icons/StarReview"; -import { CardReviewMode } from "./CardReview"; +export enum ReviewMode { + READ = "READ", + WRITE = "WRITE", +} interface DynamicStarsReviewProps { totalStars: number; rating: number; setRating: (rating: number) => void; - mode: CardReviewMode; + mode: ReviewMode; } export const DynamicStarsReview = ({ @@ -19,7 +22,7 @@ export const DynamicStarsReview = ({ const [hover, setHover] = useState(null); const handleStarClick = (index: number) => { - if (mode == CardReviewMode.WRITE) { + if (mode == ReviewMode.WRITE) { setRating(index); } }; @@ -35,11 +38,11 @@ export const DynamicStarsReview = ({ key={index} pathProps={{ className: - mode === CardReviewMode.WRITE + mode === ReviewMode.WRITE ? "transition-all ease-in-out duration-300 cursor-pointer" : "transition-all ease-in-out duration-300", onClick: - mode === CardReviewMode.WRITE + mode === ReviewMode.WRITE ? () => handleStarClick(currentRating) : undefined, style: { @@ -47,13 +50,11 @@ export const DynamicStarsReview = ({ stroke: isHoveredOrRated ? "#004EEB" : "#98A2B3", }, onMouseEnter: - mode === CardReviewMode.WRITE + mode === ReviewMode.WRITE ? () => setHover(currentRating) : undefined, onMouseLeave: - mode === CardReviewMode.WRITE - ? () => setHover(null) - : undefined, + mode === ReviewMode.WRITE ? () => setHover(null) : undefined, }} /> ); diff --git a/components/Pages/Project/Review/NavbarReview.tsx b/components/Pages/Project/Review/NavbarReview.tsx index 5058a97b..3b155922 100644 --- a/components/Pages/Project/Review/NavbarReview.tsx +++ b/components/Pages/Project/Review/NavbarReview.tsx @@ -2,64 +2,20 @@ import { useState } from "react"; import { formatDate } from "@/utilities/formatDate"; import { StarReviewIcon } from "@/components/Icons/StarReview"; -import { - CardReview, - CardReviewMode, -} from "@/components/Pages/Project/Review/CardReview"; +import { CardReview } from "@/components/Pages/Project/Review/CardReview"; import { ChevronDown } from "@/components/Icons"; +import { Review, useReviewStore } from "@/store/review"; export const NavbarReview = () => { const [isStarSelected, setIsStarSelected] = useState(null); // ID - - interface MiniReviewSummaryProps { - id: number; - date: number; // UNIX Timestamp - scoreMedia: number; - } - - const MiniReviewSummary: MiniReviewSummaryProps[] = [ - { - id: 1, - date: 1620414884, // 07 May, 2021 in Unix timestamp - scoreMedia: 4.6, - }, - { - id: 2, - date: 1673723684, // 14 January, 2023 in Unix timestamp - scoreMedia: 4.4, - }, - { - id: 3, - date: 1498072484, // 21 Jun 2017 in Unix timestamp - scoreMedia: 4.1, - }, - { - id: 4, - date: 1351188884, // 25 Oct 2012 in Unix timestamp - scoreMedia: 4.9, - }, - { - id: 5, - date: 1719792000, // 1 July, 2024 in Unix timestamp - scoreMedia: 4.9, - }, - { - id: 6, - date: 1672531200, // 1 January, 2023 in Unix timestamp - scoreMedia: 4.9, - }, - { - id: 7, - date: 1356998400, // 1 January, 2013 in Unix timestamp - scoreMedia: 4.9, - }, - ]; + const review = useReviewStore((state) => state.review); return (
- {MiniReviewSummary.sort((a, b) => b.date - a.date).map( - (miniReview: MiniReviewSummaryProps, index: number) => ( + {review + .sort((a, b) => b.date - a.date) + .map((miniReview: Review, index: number) => (
{ }, }} /> -

{miniReview.scoreMedia}

+

{miniReview.averageScore}

{isStarSelected === index && (
)} - {index < MiniReviewSummary.length - 1 && ( + {index < review.length - 1 && (
)}
- ) - )} + ))}
- {isStarSelected !== null && ( - - )} + {isStarSelected !== null && }
); diff --git a/components/Pages/Project/Review/index.tsx b/components/Pages/Project/Review/index.tsx index cdf232df..b064be24 100644 --- a/components/Pages/Project/Review/index.tsx +++ b/components/Pages/Project/Review/index.tsx @@ -1,9 +1,7 @@ "use client"; /* eslint-disable @next/next/no-img-element */ -import { useEffect, useState } from "react"; -import { additionalQuestion } from "@/utilities/tabs"; +import { useState } from "react"; import { useProjectStore } from "@/store"; -import { getReviewsOf, getAnonReviewsOf } from "@/utilities/sdk"; import { IGrantResponse } from "@show-karma/karma-gap-sdk/core/class/karma-indexer/api/types"; import { StarIcon } from "@/components/Icons"; import { Spinner } from "@/components/Utilities/Spinner"; @@ -19,28 +17,6 @@ interface GrantAllReviewsProps { grant: IGrantResponse | undefined; } -type Review = { - answers: { - query: string; - rating: number; - answer: string; - questionId: number; - }[]; - publicAddress: string; - createdAt: string; -}; -type AnonReview = { - answers: { - query: string; - rating: number; - answer: string; - questionId: number; - createdAt: string; - }[]; - nullifier: string; - createdAt: string; -}; - export const ReviewSection = ({ grant }: GrantAllReviewsProps) => { const isProjectLoading = useProjectStore((state) => state.loading); if (isProjectLoading || !grant) { @@ -48,103 +24,10 @@ export const ReviewSection = ({ grant }: GrantAllReviewsProps) => { ; } + const [isOpenReview, setIsOpenReview] = useState(false); const project = useProjectStore((state) => state.project); - const [isFetching, setIsFetching] = useState(false); - const [isFetchingAnon, setIsFetchingAnon] = useState(false); - const [allReviews, setAllReviews] = useState([]); - const [allAnonReviews, setAllAnonReviews] = useState([]); - const [reviews, setReviews] = useState([]); - const [anonReviews, setAnonReviews] = useState([]); - const [page, setPage] = useState(1); - const [pageAnon, setPageAnon] = useState(1); - const pageLimit = 10; const { openConnectModal } = useConnectModal(); const { isConnected, address } = useAccount(); - const [isOpenReview, setIsOpenReview] = useState(false); - - useEffect(() => { - if (!grant) return; - - const getReviews = async () => { - setIsFetching(true); - if (!grant) return; - try { - const data: Review[] = await getReviewsOf(grant.uid); - const orderedData = data.map((review) => ({ - ...review, - answers: [ - ...review.answers.filter( - (answer) => !additionalQuestion(answer.questionId, answer.query) - ), - ...review.answers.filter((answer) => - additionalQuestion(answer.questionId, answer.query) - ), - ], - })); - const sortByDate = (a: Review, b: Review) => - new Date(b.createdAt).getTime() - new Date(a.createdAt).getTime(); - const sortedData = orderedData.sort(sortByDate); - setAllReviews(sortedData); - const slicedData = sortedData.slice(0, pageLimit); - - setReviews(slicedData); - } catch (error) { - console.log(error); - setReviews([]); - } finally { - setIsFetching(false); - } - }; - - const getReviewsAnon = async () => { - setIsFetchingAnon(true); - if (!grant) return; - try { - const data: AnonReview[] = await getAnonReviewsOf(grant.uid); - const orderedData = data.map((review) => ({ - ...review, - - answers: [ - ...review.answers.filter( - (answer) => !additionalQuestion(answer.questionId, answer.query) - ), - ...review.answers.filter((answer) => - additionalQuestion(answer.questionId, answer.query) - ), - ], - })); - const sortByDate = (a: AnonReview, b: AnonReview) => - new Date(b.createdAt).getTime() - new Date(a.createdAt).getTime(); - const sortedData = orderedData.sort(sortByDate); - setAllAnonReviews(sortedData); - const slicedData = sortedData.slice(0, pageLimit); - - setAnonReviews(slicedData); - } catch (error) { - console.log(error); - setAnonReviews([]); - } finally { - setIsFetchingAnon(false); - } - }; - - getReviews(); - getReviewsAnon(); - }, [grant]); - - useEffect(() => { - const slicedData = allReviews.slice( - (page - 1) * pageLimit, - page * pageLimit - ); - setReviews(slicedData); - - const slicedAnonData = allAnonReviews.slice( - (pageAnon - 1) * pageLimit, - pageAnon * pageLimit - ); - setAnonReviews(slicedAnonData); - }, [page]); const handleReviewButton = () => { if (!isConnected && openConnectModal) { @@ -172,8 +55,7 @@ export const ReviewSection = ({ grant }: GrantAllReviewsProps) => { - - {/* id = data.lenght + 1 ( last one created)*/} + ) : ( <> @@ -184,7 +66,7 @@ export const ReviewSection = ({ grant }: GrantAllReviewsProps) => { {isConnected && project?.recipient && address && - isAddressEqual(project.recipient, address) ? ( + !isAddressEqual(project.recipient, address) ? ( //TODO: Remove this (negation)! - ) : ( - !isConnected && ( + isOpenReview === ReviewMode.READ && ( + <> +
+

+ All reviews of {grant?.details?.data?.title} +

+ {isConnected && + project?.recipient && + address && + !isAddressEqual(project.recipient, address) ? ( //TODO: Remove this (negation)! - ) - )} -
- - + ) : ( + !isConnected && ( + + ) + )} + + + + ) )} diff --git a/store/review.ts b/store/review.ts index abe0216c..d691e5f5 100644 --- a/store/review.ts +++ b/store/review.ts @@ -3,6 +3,7 @@ import { BadgeListProps, BadgeName, BadgeDescription, + ReviewMode, } from "@/types/review"; import { create } from "zustand"; @@ -11,6 +12,8 @@ interface ReviewStore { setReview: (review: Review[]) => void; badgeList: BadgeListProps[][]; setBadgeList: (badgeList: BadgeListProps[][]) => void; + isOpenReview: ReviewMode; + setIsOpenReview: (isOpenReview: ReviewMode) => void; } const initialBadgeList: BadgeListProps[][] = [ @@ -326,4 +329,7 @@ export const useReviewStore = create((set, get) => ({ badgeList: initialBadgeList, setBadgeList: (badgeList: BadgeListProps[][]) => set((state) => ({ ...state, badgeList })), + isOpenReview: ReviewMode.READ, + setIsOpenReview: (isOpenReview: ReviewMode) => + set((state) => ({ ...state, isOpenReview })), })); diff --git a/types/review.ts b/types/review.ts index c88af9df..0ba5eeca 100644 --- a/types/review.ts +++ b/types/review.ts @@ -37,3 +37,8 @@ export const BadgeDescription: Record = { [BadgeName.FAST_DISBURSEMENT]: "Commends quick fund disbursement processes. Did they complete the payment as soon as you completed the milestones? If yes, issue this badge.", }; + +export enum ReviewMode { + READ = "READ", + WRITE = "WRITE", +} From 37b8921c4c200bce694a2deac2f5f54064ffeb2c Mon Sep 17 00:00:00 2001 From: heronlancellot Date: Wed, 14 Aug 2024 16:02:56 -0300 Subject: [PATCH 050/139] feat: add subtitle in index --- components/Pages/Project/Review/index.tsx | 49 +++++++++++++---------- 1 file changed, 27 insertions(+), 22 deletions(-) diff --git a/components/Pages/Project/Review/index.tsx b/components/Pages/Project/Review/index.tsx index d628abe9..0a7fe1c6 100644 --- a/components/Pages/Project/Review/index.tsx +++ b/components/Pages/Project/Review/index.tsx @@ -63,33 +63,38 @@ export const ReviewSection = ({ grant }: GrantAllReviewsProps) => { ) : ( isOpenReview === ReviewMode.READ && ( <> -
-

- All reviews of {grant?.details?.data?.title} -

- {isConnected && - project?.recipient && - address && - !isAddressEqual(project.recipient, address) ? ( //TODO: Remove this (negation)! - - ) : ( - !isConnected && ( +
+
+

+ All reviews of {grant?.details?.data?.title} +

+ {isConnected && + project?.recipient && + address && + !isAddressEqual(project.recipient, address) ? ( //TODO: Remove this (negation)! - ) - )} + ) : ( + !isConnected && ( + + ) + )} +
+
+

Aggregate a reputation to a grants program

+
From bac6582b5977bcf1d97c5eea7a00edd036c36214 Mon Sep 17 00:00:00 2001 From: heronlancellot Date: Wed, 14 Aug 2024 16:03:14 -0300 Subject: [PATCH 051/139] feat: add fair-rounds text --- types/review.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/types/review.ts b/types/review.ts index 0ba5eeca..c50c69c5 100644 --- a/types/review.ts +++ b/types/review.ts @@ -27,7 +27,7 @@ export const BadgeDescription: Record = { [BadgeName.SMOOTH_APPLICATION]: "Awards a seamless application process. Are they using a tech that facilitates the application process? Did they get back to you after the application, or was it just a poor form?", [BadgeName.FAIR_ROUNDS]: - "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla sem urna, sodales vel placerat sed, elementum a orci. Duis sit amet neque rutrum, suscipit enim tempus, dignissim erat. Etiam interdum dignissim pretium.", + "Grant programs and funding rounds are conducted fairly, supporting a diverse range of projects, including new initiatives, while actively incorporating community feedback.", [BadgeName.EASY_TEACH]: "Awards programs with easily implementable technology. How hard is the tech? Are the docs easy to use or find?", [BadgeName.SUPPORTIVE_TEAM]: From 551b832bc8dd9805ad60a19c03106481ec34d8de Mon Sep 17 00:00:00 2001 From: heronlancellot Date: Thu, 15 Aug 2024 12:35:29 -0300 Subject: [PATCH 052/139] fix: path-names svg --- components/Icons/Badge.tsx | 20 ++++++++++---------- 1 file changed, 10 insertions(+), 10 deletions(-) diff --git a/components/Icons/Badge.tsx b/components/Icons/Badge.tsx index f5cbfdef..add25d02 100644 --- a/components/Icons/Badge.tsx +++ b/components/Icons/Badge.tsx @@ -148,7 +148,7 @@ export const BadgeIcon: React.FC = ({ /> - + = ({ width="70.3535" height="77.5244" filterUnits="userSpaceOnUse" - color-interpolation-filters="sRGB" + colorInterpolationFilters="sRGB" > = ({ /> - + = ({ width="70.3535" height="77.5244" filterUnits="userSpaceOnUse" - color-interpolation-filters="sRGB" + colorInterpolationFilters="sRGB" > = ({ width="70.3535" height="77.5244" filterUnits="userSpaceOnUse" - color-interpolation-filters="sRGB" + colorInterpolationFilters="sRGB" > = ({ width="70.3535" height="77.5244" filterUnits="userSpaceOnUse" - color-interpolation-filters="sRGB" + colorInterpolationFilters="sRGB" > = ({ d="M19.5568 36.0149C19.4662 35.7351 19.2139 35.5499 18.9223 35.5499H16.6286L15.927 33.4532C15.8364 33.1852 15.5842 33 15.2965 33C15.0088 33 14.7605 33.1852 14.6659 33.4532L13.9604 35.5499H11.6667C11.3751 35.5499 11.1189 35.7391 11.0322 36.0149C10.9415 36.2948 11.048 36.5943 11.2805 36.7598L13.1171 38.0525L12.4155 40.1255C12.3249 40.3975 12.4195 40.7009 12.6481 40.8704C12.8806 41.0399 13.1959 41.0438 13.4284 40.8783L15.2886 39.5698L17.1488 40.8783C17.3932 41.0438 17.7006 41.0398 17.9292 40.8704C18.1617 40.7009 18.2523 40.3974 18.1617 40.1255L17.468 38.0485L19.3046 36.7558C19.541 36.5864 19.6475 36.2869 19.5568 36.0149ZM16.2975 37.2446C16.0571 37.4141 15.9546 37.7215 16.0492 37.9973L16.262 38.6279L15.6748 38.218C15.4422 38.0565 15.1388 38.0565 14.9102 38.218L14.3269 38.6279L14.5397 37.9973C14.6343 37.7175 14.5319 37.414 14.2914 37.2446L13.7672 36.8781H14.4372C14.7249 36.8781 14.9732 36.6929 15.0678 36.4249L15.2925 35.7509L15.5171 36.4249C15.6078 36.6929 15.86 36.8781 16.1477 36.8781H16.8177L16.2975 37.2446Z" fill="#191B2A" /> - + = ({ width="70.3535" height="77.5244" filterUnits="userSpaceOnUse" - color-interpolation-filters="sRGB" + colorInterpolationFilters="sRGB" > = ({ /> - + = ({ width="70.3535" height="77.5244" filterUnits="userSpaceOnUse" - color-interpolation-filters="sRGB" + colorInterpolationFilters="sRGB" > Date: Mon, 19 Aug 2024 15:06:31 -0300 Subject: [PATCH 053/139] update: badge type --- types/review.ts | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/types/review.ts b/types/review.ts index c50c69c5..4f797047 100644 --- a/types/review.ts +++ b/types/review.ts @@ -8,7 +8,7 @@ export enum BadgeName { FAST_DISBURSEMENT = "Fast Disbursement", } -export interface BadgeListProps { +export interface Badge { name: BadgeName; description: string; score: number; @@ -18,7 +18,7 @@ export interface Review { id: number; date: number; // UNIX Timestamp averageScore: number; - reviews: BadgeListProps[]; + reviews: Badge[]; } export const BadgeDescription: Record = { From 9c04f4a95c207fa41bd8edf0f7dfa48e0379d7b6 Mon Sep 17 00:00:00 2001 From: heronlancellot Date: Mon, 19 Aug 2024 15:17:20 -0300 Subject: [PATCH 054/139] update: badgeListProps to Badge --- components/Pages/Project/Review/CardNewReview.tsx | 8 ++++---- components/Pages/Project/Review/CardReview.tsx | 4 ++-- store/review.ts | 10 +++++----- 3 files changed, 11 insertions(+), 11 deletions(-) diff --git a/components/Pages/Project/Review/CardNewReview.tsx b/components/Pages/Project/Review/CardNewReview.tsx index af609517..fef43d1e 100644 --- a/components/Pages/Project/Review/CardNewReview.tsx +++ b/components/Pages/Project/Review/CardNewReview.tsx @@ -7,14 +7,14 @@ import { DynamicStarsReview } from "./DynamicStarsReview"; import { useReviewStore } from "@/store/review"; import { BadgeDescription, - BadgeListProps, + Badge, BadgeName, Review, ReviewMode, } from "@/types/review"; import toast from "react-hot-toast"; -const defaultInitialNewReviewList: BadgeListProps[] = [ +const defaultInitialNewReviewList: Badge[] = [ { name: BadgeName.CLEAR_GOALS, description: BadgeDescription[BadgeName.CLEAR_GOALS], @@ -53,7 +53,7 @@ const defaultInitialNewReviewList: BadgeListProps[] = [ ]; export const CardNewReview = () => { - const [newReview, setNewReview] = useState( + const [newReview, setNewReview] = useState( defaultInitialNewReviewList ); const setIsOpenReview = useReviewStore((state) => state.setIsOpenReview); @@ -92,7 +92,7 @@ export const CardNewReview = () => { return (
- {newReview.map((badge: BadgeListProps, index: number) => ( + {newReview.map((badge: Badge, index: number) => (
diff --git a/components/Pages/Project/Review/CardReview.tsx b/components/Pages/Project/Review/CardReview.tsx index 67e33f29..61b0b3fa 100644 --- a/components/Pages/Project/Review/CardReview.tsx +++ b/components/Pages/Project/Review/CardReview.tsx @@ -3,7 +3,7 @@ import { BadgeIcon } from "@/components/Icons/Badge"; import { DynamicStarsReview } from "./DynamicStarsReview"; import { useReviewStore } from "@/store/review"; -import { BadgeListProps, ReviewMode } from "@/types/review"; +import { Badge, ReviewMode } from "@/types/review"; export const CardReview = ({ id }: { id: number }) => { const review = useReviewStore((state) => state.review); @@ -12,7 +12,7 @@ export const CardReview = ({ id }: { id: number }) => { return (
- {selectedBadgeList.map((badge: BadgeListProps, index: number) => ( + {selectedBadgeList.map((badge: Badge, index: number) => (
diff --git a/store/review.ts b/store/review.ts index d691e5f5..745fe769 100644 --- a/store/review.ts +++ b/store/review.ts @@ -1,6 +1,6 @@ import { Review, - BadgeListProps, + Badge, BadgeName, BadgeDescription, ReviewMode, @@ -10,13 +10,13 @@ import { create } from "zustand"; interface ReviewStore { review: Review[]; setReview: (review: Review[]) => void; - badgeList: BadgeListProps[][]; - setBadgeList: (badgeList: BadgeListProps[][]) => void; + badgeList: Badge[][]; + setBadgeList: (badgeList: Badge[][]) => void; isOpenReview: ReviewMode; setIsOpenReview: (isOpenReview: ReviewMode) => void; } -const initialBadgeList: BadgeListProps[][] = [ +const initialBadgeList: Badge[][] = [ [ { name: BadgeName.CLEAR_GOALS, @@ -327,7 +327,7 @@ export const useReviewStore = create((set, get) => ({ review: defaultReviews, setReview: (review: Review[]) => set((state) => ({ ...state, review })), badgeList: initialBadgeList, - setBadgeList: (badgeList: BadgeListProps[][]) => + setBadgeList: (badgeList: Badge[][]) => set((state) => ({ ...state, badgeList })), isOpenReview: ReviewMode.READ, setIsOpenReview: (isOpenReview: ReviewMode) => From 5260286250346de5c655ad1255a1fde0a59974f0 Mon Sep 17 00:00:00 2001 From: heronlancellot Date: Mon, 19 Aug 2024 17:11:35 -0300 Subject: [PATCH 055/139] feat: add fluxe to submit review and select the new review --- .../Pages/Project/Review/CardNewReview.tsx | 2 ++ .../Pages/Project/Review/CardReview.tsx | 6 ++++-- .../Pages/Project/Review/NavbarReview.tsx | 20 +++++++++++-------- store/review.ts | 5 +++++ 4 files changed, 23 insertions(+), 10 deletions(-) diff --git a/components/Pages/Project/Review/CardNewReview.tsx b/components/Pages/Project/Review/CardNewReview.tsx index fef43d1e..0146a039 100644 --- a/components/Pages/Project/Review/CardNewReview.tsx +++ b/components/Pages/Project/Review/CardNewReview.tsx @@ -58,6 +58,7 @@ export const CardNewReview = () => { ); const setIsOpenReview = useReviewStore((state) => state.setIsOpenReview); const setReview = useReviewStore((state) => state.setReview); + const setIsStarSelected = useReviewStore((state) => state.setIsStarSelected); const review = useReviewStore((state) => state.review); const _currentTimestamp = Math.floor(new Date().getTime() / 1000); @@ -84,6 +85,7 @@ export const CardNewReview = () => { }; setReview([...review, newReviewData]); + setIsStarSelected(newReviewData.id); toast.success("Review submitted successfully!"); setNewReview(defaultInitialNewReviewList); setIsOpenReview(ReviewMode.READ); diff --git a/components/Pages/Project/Review/CardReview.tsx b/components/Pages/Project/Review/CardReview.tsx index 61b0b3fa..1cca533c 100644 --- a/components/Pages/Project/Review/CardReview.tsx +++ b/components/Pages/Project/Review/CardReview.tsx @@ -7,12 +7,14 @@ import { Badge, ReviewMode } from "@/types/review"; export const CardReview = ({ id }: { id: number }) => { const review = useReviewStore((state) => state.review); - const selectedBadgeList = review[id].reviews || []; + + const isReviewSelected = review.find((review) => review.id === id); + const reviews = isReviewSelected?.reviews || []; return (
- {selectedBadgeList.map((badge: Badge, index: number) => ( + {reviews.map((badge: Badge, index: number) => (
diff --git a/components/Pages/Project/Review/NavbarReview.tsx b/components/Pages/Project/Review/NavbarReview.tsx index 974bb4f0..eecf16da 100644 --- a/components/Pages/Project/Review/NavbarReview.tsx +++ b/components/Pages/Project/Review/NavbarReview.tsx @@ -1,6 +1,5 @@ "use client"; -import { useState } from "react"; import { formatDate } from "@/utilities/formatDate"; import { StarReviewIcon } from "@/components/Icons/StarReview"; import { CardReview } from "@/components/Pages/Project/Review/CardReview"; @@ -9,8 +8,15 @@ import { useReviewStore } from "@/store/review"; import { Review } from "@/types/review"; export const NavbarReview = () => { - const [isStarSelected, setIsStarSelected] = useState(null); // ID const review = useReviewStore((state) => state.review); + const isStarSelected = useReviewStore((state) => state.isStarSelected); + + const handleToggleReviewSelected = (id: number) => { + const currentSelection = useReviewStore.getState().isStarSelected; + useReviewStore.setState({ + isStarSelected: currentSelection === id ? null : id, + }); + }; return (
@@ -29,21 +35,19 @@ export const NavbarReview = () => { { - setIsStarSelected((prev) => - prev === index ? null : index - ); + handleToggleReviewSelected(miniReview.id); }, }} />

{miniReview.averageScore}

- {isStarSelected === index && ( + {isStarSelected === miniReview.id && (
diff --git a/store/review.ts b/store/review.ts index 745fe769..5bc76e6e 100644 --- a/store/review.ts +++ b/store/review.ts @@ -14,6 +14,8 @@ interface ReviewStore { setBadgeList: (badgeList: Badge[][]) => void; isOpenReview: ReviewMode; setIsOpenReview: (isOpenReview: ReviewMode) => void; + isStarSelected: number | null; + setIsStarSelected: (isStarSelected: number | null) => void; } const initialBadgeList: Badge[][] = [ @@ -332,4 +334,7 @@ export const useReviewStore = create((set, get) => ({ isOpenReview: ReviewMode.READ, setIsOpenReview: (isOpenReview: ReviewMode) => set((state) => ({ ...state, isOpenReview })), + isStarSelected: null, + setIsStarSelected: (isStarSelected: number | null) => + set((state) => ({ ...state, isStarSelected })), })); From a3ae4803a44904e8314e3aa9c64d6cea3122c67c Mon Sep 17 00:00:00 2001 From: heronlancellot Date: Wed, 21 Aug 2024 09:52:17 -0300 Subject: [PATCH 056/139] fix: scrollbar-style --- components/Pages/Project/Review/NavbarReview.tsx | 2 +- styles/globals.css | 4 ++++ 2 files changed, 5 insertions(+), 1 deletion(-) diff --git a/components/Pages/Project/Review/NavbarReview.tsx b/components/Pages/Project/Review/NavbarReview.tsx index eecf16da..a8601b95 100644 --- a/components/Pages/Project/Review/NavbarReview.tsx +++ b/components/Pages/Project/Review/NavbarReview.tsx @@ -20,7 +20,7 @@ export const NavbarReview = () => { return (
-
+
{review .sort((a, b) => b.date - a.date) .map((miniReview: Review, index: number) => ( diff --git a/styles/globals.css b/styles/globals.css index d3b776e0..e33bd359 100644 --- a/styles/globals.css +++ b/styles/globals.css @@ -149,3 +149,7 @@ label { @apply list-disc list-inside; } } + + .scroller { + scrollbar-width: thin; + } \ No newline at end of file From 3e790d59e7f10c908f476457985a85b32e2bddc7 Mon Sep 17 00:00:00 2001 From: heronlancellot Date: Wed, 21 Aug 2024 09:52:51 -0300 Subject: [PATCH 057/139] fix: remove unnused code --- components/Pages/Project/Review/index.tsx | 1 - 1 file changed, 1 deletion(-) diff --git a/components/Pages/Project/Review/index.tsx b/components/Pages/Project/Review/index.tsx index 0a7fe1c6..f10d6aeb 100644 --- a/components/Pages/Project/Review/index.tsx +++ b/components/Pages/Project/Review/index.tsx @@ -1,6 +1,5 @@ "use client"; /* eslint-disable @next/next/no-img-element */ -import { useState } from "react"; import { useProjectStore } from "@/store"; import { IGrantResponse } from "@show-karma/karma-gap-sdk/core/class/karma-indexer/api/types"; import { StarIcon } from "@/components/Icons"; From 8106974112d28c346a1fcf37436873c10e7dc748 Mon Sep 17 00:00:00 2001 From: heronlancellot Date: Wed, 21 Aug 2024 10:25:55 -0300 Subject: [PATCH 058/139] fix: mobile responsivity --- components/Pages/Project/Review/CardReview.tsx | 8 +++++--- 1 file changed, 5 insertions(+), 3 deletions(-) diff --git a/components/Pages/Project/Review/CardReview.tsx b/components/Pages/Project/Review/CardReview.tsx index 1cca533c..0e574117 100644 --- a/components/Pages/Project/Review/CardReview.tsx +++ b/components/Pages/Project/Review/CardReview.tsx @@ -16,13 +16,15 @@ export const CardReview = ({ id }: { id: number }) => {
{reviews.map((badge: Badge, index: number) => (
-
+
-
{badge.name}
-
{badge.description}
+
+ {badge.name} +
+
{badge.description}
Date: Wed, 21 Aug 2024 11:02:40 -0300 Subject: [PATCH 059/139] fix: card-new-review mobile responsivity --- components/Pages/Project/Review/CardNewReview.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/components/Pages/Project/Review/CardNewReview.tsx b/components/Pages/Project/Review/CardNewReview.tsx index 0146a039..1165ad41 100644 --- a/components/Pages/Project/Review/CardNewReview.tsx +++ b/components/Pages/Project/Review/CardNewReview.tsx @@ -96,7 +96,7 @@ export const CardNewReview = () => {
{newReview.map((badge: Badge, index: number) => (
-
+
From 536bca74aa409c4f6ac0972b2833b0564fec77de Mon Sep 17 00:00:00 2001 From: heronlancellot Date: Wed, 21 Aug 2024 17:53:48 -0300 Subject: [PATCH 060/139] fix: tablet responsivity --- components/Pages/Project/ProjectGrantsPage.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/components/Pages/Project/ProjectGrantsPage.tsx b/components/Pages/Project/ProjectGrantsPage.tsx index 2ff5f402..c9806805 100644 --- a/components/Pages/Project/ProjectGrantsPage.tsx +++ b/components/Pages/Project/ProjectGrantsPage.tsx @@ -402,7 +402,7 @@ export const ProjectGrantsPage = () => {
) : null} -
+
{/* Grants tabs start */} {project?.grants.length ? (
@@ -434,7 +434,7 @@ export const ProjectGrantsPage = () => {
) : null} {project?.grants.length && currentTab !== "create-grant" ? ( -
+