update warning badges and icons

Giveth · Sep 19, 2024 · c071b9b · c071b9b
1 parent 96cd7ae
commit c071b9b
Show file tree

Hide file tree

Showing 4 changed files with 49 additions and 30 deletions.
diff --git a/lang/ca.json b/lang/ca.json
@@ -1350,6 +1350,8 @@
 	"page.donate.donate_$_to_be_eligible": "Fes una donació de ${value} per ser elegible per a GIVbacks",
 	"page.donate.donate_$_to_get_matched": "Dona ${value} per igualar la teva donació",
 	"page.donate.donations_will_be_matched": "La donació serà igualada",
+	"page.donate.project_not_eligible_for_qf": "El projecte no és elegible per a la concordança QF.",
+	"page.donate.network_not_eligible_for_qf": "{network} no són aptes per a la concordança",
 	"page.donate.givbacks_eligible": "GIVbacks elegibles",
 	"page.donate.project_not_givbacks_eligible": "El projecte no és elegible per a GIVbacks",
 	"page.donate.token_not_givbacks_eligible": "{token} no és apte per a GIVbacks",

diff --git a/lang/en.json b/lang/en.json
@@ -1355,6 +1355,8 @@
 	"page.donate.donate_$_to_be_eligible": "Donate ${value} to be eligible for GIVbacks",
 	"page.donate.donate_$_to_get_matched": "Donate ${value} to get your donation matched",
 	"page.donate.donations_will_be_matched": "Donation will be matched",
+	"page.donate.project_not_eligible_for_qf": "The project is not eligible for QF matching.",
+	"page.donate.network_not_eligible_for_qf": "{network} aren’t eligible for matching",
 	"page.donate.givbacks_eligible": "GIVbacks eligible",
 	"page.donate.project_not_givbacks_eligible": "Project is not GIVbacks eligible",
 	"page.donate.token_not_givbacks_eligible": "{token} is not eligible for GIVbacks",

diff --git a/lang/es.json b/lang/es.json
@@ -1350,6 +1350,8 @@
 	"page.donate.donate_$_to_be_eligible": "Dona ${value} para ser elegible para GIVbacks",
 	"page.donate.donate_$_to_get_matched": "Dona ${value} para que tu donación sea igualada",
 	"page.donate.donations_will_be_matched": "La donación será igualada",
+	"page.donate.project_not_eligible_for_qf": "El proyecto no es elegible para la financiación QF.",
+	"page.donate.network_not_eligible_for_qf": "{network} no son elegibles para la coincidencia",
 	"page.donate.givbacks_eligible": "Elegibles para GIVbacks",
 	"page.donate.project_not_givbacks_eligible": "El proyecto no es elegible para GIVbacks",
 	"page.donate.token_not_givbacks_eligible": "{token} no es elegible para GIVbacks",

diff --git a/src/components/views/donate/common/EligibilityBadges.tsx b/src/components/views/donate/common/EligibilityBadges.tsx
@@ -1,5 +1,6 @@
 import {
 	IconGIVBack24,
+	IconNoGiveback24,
 	IconQFNew,
 	IconQFNotEligible24,
 	neutralColors,
@@ -46,47 +47,59 @@ const EligibilityBadges: FC<IEligibilityBadges> = props => {
 	const donationUsdValue =
 		(tokenPrice || 0) * Number(ethers.utils.formatEther(amount));
 
+	const qfEligibleWarning = !activeStartedRound || !isOnQFEligibleNetworks;
 	const isDonationMatched =
 		!!activeStartedRound &&
+		isOnQFEligibleNetworks &&
 		donationUsdValue >= (activeStartedRound?.minimumValidUsdValue || 0);
+	const givbacksEligibleWarning =
+		(tokenPrice && !isTokenGivbacksEligible) || !isProjectGivbacksEligible;
 	const isGivbacksEligible =
 		isTokenGivbacksEligible &&
 		isProjectGivbacksEligible &&
 		donationUsdValue >= GIVBACKS_DONATION_QUALIFICATION_VALUE_USD;
 
 	return isConnected ? (
 		<EligibilityBadgeWrapper style={style}>
-			{isStellar && !isOnQFEligibleNetworks && (
-				<BadgesBase warning>
-					<IconQFNotEligible24 />
-					{formatMessage({
-						id: 'label.stellar_donations_arent_eligible',
-					})}
-				</BadgesBase>
-			)}
-			{activeStartedRound && isOnQFEligibleNetworks && (
-				<BadgesBase active={isDonationMatched}>
+			<BadgesBase warning={qfEligibleWarning} active={isDonationMatched}>
+				{!qfEligibleWarning ? (
 					<IconQFNew size={30} />
-					{formatMessage(
-						{
-							id: isDonationMatched
-								? 'page.donate.donations_will_be_matched'
-								: 'page.donate.donate_$_to_get_matched',
-						},
-						{
-							value: activeStartedRound?.minimumValidUsdValue,
-						},
-					)}
-				</BadgesBase>
-			)}
-			<BadgesBase active={isGivbacksEligible}>
-				<IconGIVBack24
-					color={
-						isGivbacksEligible
-							? semanticColors.jade[500]
-							: neutralColors.gray[700]
-					}
-				/>
+				) : (
+					<IconQFNotEligible24 />
+				)}
+				{formatMessage(
+					{
+						id: isDonationMatched
+							? 'page.donate.donations_will_be_matched'
+							: !activeStartedRound
+								? 'page.donate.project_not_eligible_for_qf'
+								: !isOnQFEligibleNetworks
+									? 'page.donate.network_not_eligible_for_qf'
+									: 'page.donate.donate_$_to_get_matched',
+					},
+					{
+						value: activeStartedRound?.minimumValidUsdValue,
+						network: isStellar
+							? 'Stellar'
+							: config.NETWORKS_CONFIG[networkId].name,
+					},
+				)}
+			</BadgesBase>
+			<BadgesBase
+				warning={givbacksEligibleWarning}
+				active={isGivbacksEligible}
+			>
+				{!givbacksEligibleWarning ? (
+					<IconGIVBack24
+						color={
+							isGivbacksEligible
+								? semanticColors.jade[500]
+								: neutralColors.gray[700]
+						}
+					/>
+				) : (
+					<IconNoGiveback24 />
+				)}
 				{formatMessage(
 					{
 						id: isGivbacksEligible