Merge pull request #50 from code4rena-dev/leo95oliveira/contest-tile-tags-update

Bug Fix - Displaying Ethereum logo for EVM and EVM Types

Author: leo95oliveira

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@code4rena/components-library",
-  "version": "3.1.1",
+  "version": "3.1.2",
   "description": "Code4rena's official components library ",
   "types": "./dist/lib.d.ts",
   "exports": {

src/lib/ContestTile/CompactTemplate.tsx

@@ -62,8 +62,13 @@ const IsContest = ({title, isDarkTile = true, contestData, sponsorUrl, sponsorIm
   const [contestTimelineObject, setContestTimelineObject] = useState<ContestSchedule | undefined>();
   const [hasBotRace, setHasBotRace] = useState(contestData ? !!contestData.botFindingsRepo : false);
   let ecosystemLogoName: string = "";
-  if (ecosystem && (ecosystem === "Polkadot" || ecosystem === "Ethereum")) {
-    ecosystemLogoName = `logo-${ecosystem.toLowerCase()}`
+  const evmTypes = new Set([
+    "EVM", "Ethereum", "Arbitrum", "Avax", "BSC", "Optimism", "Polygon", "zkSync"
+  ]);
+  if (ecosystem && (ecosystem === "Polkadot")) {
+    ecosystemLogoName = 'logo-polkadot'
+  } else if (evmTypes.has(ecosystem ?? "")) {
+    ecosystemLogoName = 'logo-ethereum';
   }
 
   const updateContestTileStatus = useCallback(() => {
@@ -188,8 +193,13 @@ const IsBounty = ({title, isDarkTile = true, bountyData, sponsorUrl, sponsorImag
 }) => {
   const { amount, bountyUrl, ecosystem, languages } = bountyData;
   let ecosystemLogoName: string = "";
-  if (ecosystem && (ecosystem === "Polkadot" || ecosystem === "Ethereum")) {
-    ecosystemLogoName = `logo-${ecosystem.toLowerCase()}`
+  const evmTypes = new Set([
+    "EVM", "Ethereum", "Arbitrum", "Avax", "BSC", "Optimism", "Polygon", "zkSync"
+  ]);
+  if (ecosystem && (ecosystem === "Polkadot")) {
+    ecosystemLogoName = 'logo-polkadot'
+  } else if (evmTypes.has(ecosystem ?? "")) {
+    ecosystemLogoName = 'logo-ethereum';
   }
 
   return (

src/lib/ContestTile/ContestTile.stories.tsx

@@ -39,8 +39,8 @@ const defaultArgs = {
     contestType: "Open Audit",
     isUserCertified: false,
     contestId: 321,
-    ecosystem: "Ethereum" as ContestEcosystem,
-    languages: ["Rust"] as CodingLanguage[],
+    ecosystem: "EVM" as ContestEcosystem,
+    languages: ["Solidity"] as CodingLanguage[],
     contestUrl: "https://code4rena.com/audits/2023-07-axelar-network#top",
     contestRepo: "https://github.com/code-423n4/2023-07-axelar",
     findingsRepo: "https://github.com/code-423n4/2023-07-axelar",

src/lib/ContestTile/ContestTile.types.ts

@@ -8,7 +8,7 @@ export enum ContestTileVariant {
   COMPACT_DARK = "COMPACT_DARK"
 }
 
-export type ContestEcosystem = "Algorand" | "Aptos" | "Blast" | "Cosmos" | "Ethereum" | "EVM" | "NEAR" | "Polkadot" | "Scroll" | "Sei" | "Solana" | "StarkNet" | "Stellar" | "Sui" | "Other";
+export type ContestEcosystem = "Algorand" | "Aptos" | "Blast" | "Cosmos" | "EVM" | "NEAR" | "Polkadot" | "Scroll" | "Sei" | "Solana" | "StarkNet" | "Stellar" | "Sui" | "Other";
 
 export type CodingLanguage = "Cairo" | "GO" | "HUFF" | "Ink" | "Move" | "Noir" | "Other" | "Rain" | "Rust" | "Rust evm" | "Solidity" | "Vyper" | "Yui";
 

src/lib/ContestTile/DefaultTemplate.tsx

@@ -253,8 +253,13 @@ function IsContest({
 }) {
   const { contestUrl, amount, findingsRepo, startDate, endDate, ecosystem, languages } = contestData;
   let ecosystemLogoName: string = "";
-  if (ecosystem && (ecosystem === "Polkadot" || ecosystem === "Ethereum")) {
-    ecosystemLogoName = `logo-${ecosystem.toLowerCase()}`
+  const evmTypes = new Set([
+    "EVM", "Ethereum", "Arbitrum", "Avax", "BSC", "Optimism", "Polygon", "zkSync"
+  ]);
+  if (ecosystem && (ecosystem === "Polkadot")) {
+    ecosystemLogoName = 'logo-polkadot'
+  } else if (evmTypes.has(ecosystem ?? "")) {
+    ecosystemLogoName = 'logo-ethereum';
   }
 
   return (
@@ -403,8 +408,13 @@ function IsBounty({
   const { bountyUrl, amount, startDate, ecosystem, languages } = bountyData;
   const endDate = "2999-01-01T00:00:00Z"
   let ecosystemLogoName: string = "";
-  if (ecosystem && (ecosystem === "Polkadot" || ecosystem === "Ethereum")) {
-    ecosystemLogoName = `logo-${ecosystem.toLowerCase()}`
+  const evmTypes = new Set([
+    "EVM", "Ethereum", "Arbitrum", "Avax", "BSC", "Optimism", "Polygon", "zkSync"
+  ]);
+  if (ecosystem && (ecosystem === "Polkadot")) {
+    ecosystemLogoName = 'logo-polkadot'
+  } else if (evmTypes.has(ecosystem ?? "")) {
+    ecosystemLogoName = 'logo-ethereum';
   }
 
   return (