add funding request to vote page

lexicongovernance · May 22, 2024 · 81cc634 · 81cc634
1 parent 55e4a75
commit 81cc634
Show file tree

Hide file tree

Showing 3 changed files with 21 additions and 8 deletions.
diff --git a/packages/api/src/types/CycleType.ts b/packages/api/src/types/CycleType.ts
@@ -20,6 +20,7 @@ export type GetCycleResponse = {
       optionTitle: string;
       optionSubTitle?: string;
       accepted: boolean;
+      fundingRequest: string;
       user: {
         group: {
           id: string;

diff --git a/packages/berlin/src/components/option-card/OptionCard.tsx b/packages/berlin/src/components/option-card/OptionCard.tsx
@@ -3,20 +3,27 @@ import { Body } from '../typography/Body.styled';
 import { Bold } from '../typography/Bold.styled';
 import { FlexColumn } from '../containers/FlexColumn.styled';
 import { FlexRow } from '../containers/FlexRow.styled';
-import { QuestionOption, fetchOptionUsers } from 'api';
+import { fetchOptionUsers, GetCycleResponse } from 'api';
 import { useAppStore } from '../../store';
 import { useNavigate, useParams } from 'react-router-dom';
 import { useQuery } from '@tanstack/react-query';
 import { useMemo, useState } from 'react';
 import IconButton from '../icon-button';
 
 type OptionCardProps = {
-  option: QuestionOption;
+  option: GetCycleResponse['forumQuestions'][number]['questionOptions'][number];
+  showFundingRequest?: boolean;
   numOfVotes: number;
   onVote: () => void;
   onUnVote: () => void;
 };
-function OptionCard({ option, numOfVotes, onVote, onUnVote }: OptionCardProps) {
+function OptionCard({
+  option,
+  numOfVotes,
+  onVote,
+  onUnVote,
+  showFundingRequest = false,
+}: OptionCardProps) {
   const { eventId, cycleId } = useParams();
   const theme = useAppStore((state) => state.theme);
   const navigate = useNavigate();
@@ -87,9 +94,6 @@ function OptionCard({ option, numOfVotes, onVote, onUnVote }: OptionCardProps) {
             </FlexColumn>
             <Body>{numOfVotes}</Body>
           </Votes>
-          {/* <Plurality>
-            <Body>{formattedPluralityScore}</Body>
-          </Plurality> */}
         </FlexRow>
         <FlexColumn className="description" $gap="1.5rem">
           {coauthors && coauthors.length > 0 && (
@@ -98,6 +102,11 @@ function OptionCard({ option, numOfVotes, onVote, onUnVote }: OptionCardProps) {
               {coauthors.map((coauthor) => `${coauthor.firstName} ${coauthor.lastName}`).join(', ')}
             </Body>
           )}
+          {showFundingRequest && option.fundingRequest && (
+            <Body>
+              <Bold>Funding request:</Bold> {option.fundingRequest}
+            </Body>
+          )}
           {option.optionSubTitle && <Body>{option.optionSubTitle}</Body>}
           <IconButton
             $padding={0}

diff --git a/packages/berlin/src/pages/Cycle.tsx b/packages/berlin/src/pages/Cycle.tsx
@@ -5,7 +5,7 @@ import { useParams } from 'react-router-dom';
 import toast from 'react-hot-toast';
 
 // API
-import { GetUserVotesResponse, QuestionOption, fetchCycle, fetchUserVotes, postVotes } from 'api';
+import { GetCycleResponse, GetUserVotesResponse, fetchCycle, fetchUserVotes, postVotes } from 'api';
 
 // Hooks
 import useCountdown from '../hooks/useCountdown';
@@ -32,10 +32,11 @@ import BackButton from '../components/back-button';
 import Button from '../components/button';
 import CycleColumns from '../components/columns/cycle-columns';
 import OptionCard from '../components/option-card';
-import { FIVE_MINUTES_IN_SECONDS, INITIAL_HEARTS } from '../utils/constants';
+import { FINAL_QUESTION_TITLE, FIVE_MINUTES_IN_SECONDS, INITIAL_HEARTS } from '../utils/constants';
 
 type Order = 'asc' | 'desc';
 type LocalUserVotes = { optionId: string; numOfVotes: number }[];
+type QuestionOption = GetCycleResponse['forumQuestions'][number]['questionOptions'][number];
 
 function Cycle() {
   const queryClient = useQueryClient();
@@ -53,6 +54,7 @@ function Cycle() {
     enabled: !!user?.id && !!cycleId,
     retry: false,
   });
+
   const availableHearts =
     useAppStore((state) => state.availableHearts[cycle?.forumQuestions[0].id || '']) ??
     INITIAL_HEARTS;
@@ -300,6 +302,7 @@ function Cycle() {
                 key={option.id}
                 option={option}
                 numOfVotes={numOfVotes}
+                showFundingRequest={currentCycle.questionTitle === FINAL_QUESTION_TITLE}
                 onVote={() => handleVoteWrapper(option.id)}
                 onUnVote={() => handleUnVoteWrapper(option.id)}
               />