Merge pull request #4111 from Giveth/Allow-to-set-the-matching-pool-t…

…oken-&-amount-to-be-something-other-than-USD-#3839 Allow to set the matching pool token & amount to be something other than usd
Giveth · May 6, 2024 · 5398d59 · 5398d59
2 parents beef62a + 3fb2760
commit 5398d59
Show file tree

Hide file tree

Showing 9 changed files with 144 additions and 35 deletions.
diff --git a/src/apollo/gql/gqlProjects.ts b/src/apollo/gql/gqlProjects.ts
@@ -16,6 +16,9 @@ export const PROJECT_CORE_FIELDS = gql`
 			beginDate
 			endDate
 			maximumReward
+			allocatedTokenSymbol
+			allocatedFundUSDPreferred
+			allocatedFundUSD
 		}
 	}
 `;
@@ -181,6 +184,9 @@ export const FETCH_PROJECT_BY_SLUG = gql`
 				endDate
 				eligibleNetworks
 				maximumReward
+				allocatedTokenSymbol
+				allocatedFundUSDPreferred
+				allocatedFundUSD
 			}
 			campaigns {
 				id

diff --git a/src/apollo/gql/gqlQF.ts b/src/apollo/gql/gqlQF.ts
@@ -12,6 +12,10 @@ export const FETCH_QF_ROUNDS_QUERY = `
 			minimumPassportScore
 			bannerBgImage
 			sponsorsImgs
+			allocatedFund
+			allocatedFundUSD
+			allocatedFundUSDPreferred
+			allocatedTokenSymbol
 		}
 	}
 `;
@@ -36,6 +40,12 @@ export const FETCH_QF_ROUND_STATS = gql`
 			uniqueDonors
 			allDonationsUsdValue
 			matchingPool
+			qfRound {
+				allocatedFund
+				allocatedFundUSD
+				allocatedFundUSDPreferred
+				allocatedTokenSymbol
+			}
 		}
 	}
 `;
diff --git a/src/apollo/types/types.ts b/src/apollo/types/types.ts
@@ -468,6 +468,11 @@ export interface IQFRound {
 	maximumReward: number;
 	bannerBgImage: string;
 	sponsorsImgs: string[];
+	allocatedFund: number;
+	allocatedFundUSD: number;
+	allocatedFundUSDPreferred: boolean;
+	allocatedTokenSymbol: string;
+	allocatedTokenChainId: number;
 }
 
 export interface IGetQfRoundHistory {

diff --git a/src/components/project-card/ProjectCard.tsx b/src/components/project-card/ProjectCard.tsx
@@ -78,6 +78,12 @@ const ProjectCard = (props: IProjectCard) => {
 	const { activeStartedRound, activeQFRound } = getActiveRound(qfRounds);
 	const hasFooter = activeStartedRound || verified;
 
+	const {
+		allocatedFundUSDPreferred,
+		allocatedFundUSD,
+		allocatedTokenSymbol,
+	} = activeQFRound || {};
+
 	const projectLink = slugToProjectView(slug);
 	const donateLink = slugToProjectDonate(slug);
 
@@ -235,14 +241,20 @@ const ProjectCard = (props: IProjectCard) => {
 											calculateTotalEstimatedMatching(
 												projectDonationsSqrtRootSum,
 												allProjectsSum,
-												matchingPool,
+												allocatedFundUSDPreferred
+													? allocatedFundUSD
+													: matchingPool,
 												activeStartedRound?.maximumReward,
 											),
-											'$',
+											allocatedFundUSDPreferred
+												? '$'
+												: '',
 											locale,
 											true,
 										),
-									)}
+									)}{' '}
+									{!allocatedFundUSDPreferred &&
+										allocatedTokenSymbol}
 								</EstimatedMatchingPrice>
 								<EstimatedMatching>
 									<span>

diff --git a/src/components/views/donate/EstimatedMatchingToast.tsx b/src/components/views/donate/EstimatedMatchingToast.tsx
@@ -41,12 +41,17 @@ const EstimatedMatchingToast = ({
 	const tokenPrice = useTokenPrice(token);
 
 	const { activeStartedRound } = getActiveRound(qfRounds);
+	const {
+		allocatedFundUSDPreferred,
+		allocatedFundUSD,
+		allocatedTokenSymbol,
+	} = activeStartedRound || {};
 
 	const esMatching = calculateEstimatedMatchingWithDonationAmount(
 		(tokenPrice || 0) * (amountTyped || 0),
 		projectDonationsSqrtRootSum,
 		allProjectsSum,
-		matchingPool,
+		allocatedFundUSDPreferred ? allocatedFundUSD : matchingPool,
 		activeStartedRound?.maximumReward,
 	);
 
@@ -74,7 +79,15 @@ const EstimatedMatchingToast = ({
 						</TooltipContent>
 					</IconWithTooltip>
 				</EstimatedMatching>
-				<B>{formatDonation(esMatching, '', locale, true)}</B>
+				<B>
+					{formatDonation(
+						esMatching,
+						allocatedFundUSDPreferred ? '$' : '',
+						locale,
+						true,
+					)}{' '}
+					{allocatedFundUSDPreferred ? '' : allocatedTokenSymbol}
+				</B>
 			</Upper>
 			<Divider />
 			<Bottom>

diff --git a/src/components/views/project/projectActionCard/QFSection.tsx b/src/components/views/project/projectActionCard/QFSection.tsx
@@ -55,16 +55,20 @@ const QFSection: FC<IQFSectionProps> = ({ projectData }) => {
 	const isMobile = !useMediaQuery(device.tablet);
 	const router = useRouter();
 	const isOnDonatePage = router.pathname.includes('/donate');
-	console.log('isOnDonatePage', isOnDonatePage);
 
 	const { projectDonationsSqrtRootSum, matchingPool, allProjectsSum } =
 		estimatedMatching ?? {};
 
 	const { activeStartedRound } = getActiveRound(qfRounds);
+	const {
+		allocatedFundUSD,
+		allocatedTokenSymbol,
+		allocatedFundUSDPreferred,
+	} = activeStartedRound || {};
 	const totalEstimatedMatching = calculateTotalEstimatedMatching(
 		projectDonationsSqrtRootSum,
 		allProjectsSum,
-		matchingPool,
+		allocatedFundUSDPreferred ? allocatedFundUSD : matchingPool,
 		activeStartedRound?.maximumReward,
 	);
 
@@ -81,10 +85,11 @@ const QFSection: FC<IQFSectionProps> = ({ projectData }) => {
 					{'+ ' +
 						formatDonation(
 							totalEstimatedMatching,
-							'$',
+							allocatedFundUSDPreferred ? '$' : '',
 							locale,
 							true,
-						)}
+						)}{' '}
+					{allocatedFundUSDPreferred ? '' : allocatedTokenSymbol}
 				</EstimatedMatchingPrice>
 				<Flex $alignItems='center' gap='4px'>
 					<LightCaption>
@@ -221,7 +226,11 @@ const QFSection: FC<IQFSectionProps> = ({ projectData }) => {
 					<ContributionsContainer>
 						<Flex $flexDirection='column' gap='4px'>
 							<FlexSameSize $justifyContent='space-between'>
-								<Subline>1 DAI</Subline>
+								<Subline>
+									{allocatedFundUSDPreferred && '$'}1{' '}
+									{!allocatedFundUSDPreferred &&
+										allocatedTokenSymbol}
+								</Subline>
 								<IconArrowRight16
 									color={brandColors.cyan[500]}
 								/>
@@ -232,18 +241,25 @@ const QFSection: FC<IQFSectionProps> = ({ projectData }) => {
 											1,
 											projectDonationsSqrtRootSum,
 											allProjectsSum,
-											matchingPool,
+											allocatedFundUSDPreferred
+												? allocatedFundUSD
+												: matchingPool,
 											activeStartedRound?.maximumReward,
 										),
-										'',
+										allocatedFundUSDPreferred ? '$' : '',
 										locale,
 										true,
-									)}
-									&nbsp; DAI
+									)}{' '}
+									{!allocatedFundUSDPreferred &&
+										allocatedTokenSymbol}
 								</EndAlignedSubline>
 							</FlexSameSize>
 							<FlexSameSize $justifyContent='space-between'>
-								<Subline>10 DAI</Subline>
+								<Subline>
+									{allocatedFundUSDPreferred && '$'}10{' '}
+									{!allocatedFundUSDPreferred &&
+										allocatedTokenSymbol}
+								</Subline>
 								<IconArrowRight16
 									color={brandColors.cyan[500]}
 								/>
@@ -254,18 +270,25 @@ const QFSection: FC<IQFSectionProps> = ({ projectData }) => {
 											10,
 											projectDonationsSqrtRootSum,
 											allProjectsSum,
-											matchingPool,
+											allocatedFundUSDPreferred
+												? allocatedFundUSD
+												: matchingPool,
 											activeStartedRound?.maximumReward,
 										),
-										'',
+										allocatedFundUSDPreferred ? '$' : '',
 										locale,
 										true,
-									)}
-									&nbsp; DAI
+									)}{' '}
+									{!allocatedFundUSDPreferred &&
+										allocatedTokenSymbol}
 								</EndAlignedSubline>
 							</FlexSameSize>
 							<FlexSameSize $justifyContent='space-between'>
-								<Subline>100 DAI</Subline>
+								<Subline>
+									{allocatedFundUSDPreferred && '$'}100{' '}
+									{!allocatedFundUSDPreferred &&
+										allocatedTokenSymbol}
+								</Subline>
 								<IconArrowRight16
 									color={brandColors.cyan[500]}
 								/>
@@ -276,14 +299,17 @@ const QFSection: FC<IQFSectionProps> = ({ projectData }) => {
 											100,
 											projectDonationsSqrtRootSum,
 											allProjectsSum,
-											matchingPool,
+											allocatedFundUSDPreferred
+												? allocatedFundUSD
+												: matchingPool,
 											activeStartedRound?.maximumReward,
 										),
-										'',
+										allocatedFundUSDPreferred ? '$' : '',
 										locale,
 										true,
-									)}
-									&nbsp; DAI
+									)}{' '}
+									{!allocatedFundUSDPreferred &&
+										allocatedTokenSymbol}
 								</EndAlignedSubline>
 							</FlexSameSize>
 							{/* <Flex $justifyContent='space-between'>

diff --git a/src/components/views/project/projectDonations/ProjectTotalFundCard.tsx b/src/components/views/project/projectDonations/ProjectTotalFundCard.tsx
@@ -48,6 +48,12 @@ const ProjectTotalFundCard = ({ selectedQF }: IProjectTotalFundCardProps) => {
 	const { allProjectsSum, matchingPool, projectDonationsSqrtRootSum } =
 		estimatedMatching || {};
 
+	const {
+		allocatedFundUSDPreferred,
+		allocatedFundUSD,
+		allocatedTokenSymbol,
+	} = selectedQF || {};
+
 	const selectedQFData = qfRounds?.find(round => round.id === selectedQF?.id);
 
 	const notDistributedFund =
@@ -109,7 +115,7 @@ const ProjectTotalFundCard = ({ selectedQF }: IProjectTotalFundCardProps) => {
 			? calculateTotalEstimatedMatching(
 					projectDonationsSqrtRootSum,
 					allProjectsSum,
-					matchingPool,
+					allocatedFundUSDPreferred ? allocatedFundUSD : matchingPool,
 					selectedQF.maximumReward,
 				)
 			: qfRoundHistory
@@ -210,10 +216,14 @@ const ProjectTotalFundCard = ({ selectedQF }: IProjectTotalFundCardProps) => {
 											+{' '}
 											{formatDonation(
 												matchFund,
-												'$',
+												allocatedFundUSDPreferred
+													? '$'
+													: '',
 												locale,
 												!!selectedQFData?.isActive,
-											)}
+											)}{' '}
+											{!allocatedFundUSDPreferred &&
+												allocatedTokenSymbol}
 										</EstimatedMatchingPrice>
 										<EstimatedMatchingText>
 											{selectedQFData?.isActive

diff --git a/src/components/views/projects/ActiveQFRoundStats.tsx b/src/components/views/projects/ActiveQFRoundStats.tsx
@@ -13,12 +13,18 @@ import { useIntl } from 'react-intl';
 import { useQuery } from '@apollo/client';
 import { FETCH_QF_ROUND_STATS } from '@/apollo/gql/gqlQF';
 import { useProjectsContext } from '@/context/projects.context';
-import { formatDate } from '@/lib/helpers';
+import { formatDate, formatUSD, thousandsSeparator } from '@/lib/helpers';
 
 export const ActiveQFRoundStats = () => {
 	const { formatMessage } = useIntl();
 	const { qfRounds } = useProjectsContext();
 	const activeRound = qfRounds.find(round => round.isActive);
+	const {
+		allocatedFundUSD,
+		allocatedFundUSDPreferred,
+		allocatedTokenSymbol,
+		allocatedFund,
+	} = activeRound || {};
 	const { data } = useQuery(FETCH_QF_ROUND_STATS, {
 		variables: { slug: activeRound?.slug },
 	});
@@ -32,15 +38,23 @@ export const ActiveQFRoundStats = () => {
 						{formatMessage({ id: 'label.matching_pool' })}
 					</ItemTitle>
 					<ItemValue weight={500}>
-						${data?.qfRoundStats?.matchingPool || ' --'}
+						{allocatedFundUSDPreferred && '$'}
+						{thousandsSeparator(
+							allocatedFundUSDPreferred
+								? allocatedFundUSD
+								: allocatedFund,
+						) || ' --'}{' '}
+						{!allocatedFundUSDPreferred && allocatedTokenSymbol}
 					</ItemValue>
 				</ItemContainer>
 				<ItemContainer>
 					<ItemTitle weight={700}>
 						{formatMessage({ id: 'label.donations' })}
 					</ItemTitle>
 					<ItemValue weight={500}>
-						${data?.qfRoundStats?.allDonationsUsdValue || ' --'}
+						$
+						{formatUSD(data?.qfRoundStats?.allDonationsUsdValue) ||
+							' --'}
 					</ItemValue>
 				</ItemContainer>
 				<ItemContainer>