diff --git a/src/components/Homepage/HomepageFavorites.tsx b/src/components/Homepage/HomepageFavorites.tsx index 7793556263a2..37e24f9ab24f 100644 --- a/src/components/Homepage/HomepageFavorites.tsx +++ b/src/components/Homepage/HomepageFavorites.tsx @@ -4,82 +4,7 @@ import styled from 'styled-components'; import { useColorMode } from '@docusaurus/theme-common'; import Translate from '@docusaurus/Translate'; -const TRANSLATIONS = { - gettingStarted: { - title: ( - - Getting Started - - ), - description: ( - - Deploy your first smart contract using Hardhat. - - ), - }, - metamask: { - title: ( - - MetaMask Guide - - ), - description: ( - - Connect MetaMask to Kaia. - - ), - }, - snapshot: { - title: ( - - Node Snapshot Guide - - ), - description: ( - - Use Chaindata Snapshots. - - ), - }, - rpc: { - title: ( - - Public JSON RPC Endpoints - - ), - description: ( - - Build and test your products without running your own node. - - ), - }, - wallets: { - title: ( - - Wallets - - ), - description: ( - - Integrate and secure digital assets seamlessly. - - ), - }, - indexers: { - title: ( - - Indexers - - ), - description: ( - - Query and index blockchain data for efficient dApp performance. - - ), - }, -}; - -type FavoriteType = keyof typeof TRANSLATIONS; +type FavoriteType = 'gettingStarted' | 'metamask' | 'snapshot' | 'rpc' | 'wallets' | 'indexers'; interface Favorite { type: FavoriteType; @@ -195,15 +120,72 @@ const ViewMoreLink = styled(Link)` const FavoriteContent = ({ favorite }: { favorite: Favorite }) => { const { colorMode } = useColorMode(); - const translation = TRANSLATIONS[favorite.type]; return ( - {translation.title} + {favorite.type === 'gettingStarted' && ( + + Getting Started + + )} + {favorite.type === 'metamask' && ( + + MetaMask Guide + + )} + {favorite.type === 'snapshot' && ( + + Node Snapshot Guide + + )} + {favorite.type === 'rpc' && ( + + Public JSON RPC Endpoints + + )} + {favorite.type === 'wallets' && ( + + Wallets + + )} + {favorite.type === 'indexers' && ( + + Indexers + + )} - {translation.description} + {favorite.type === 'gettingStarted' && ( + + Deploy your first smart contract using Hardhat. + + )} + {favorite.type === 'metamask' && ( + + Connect MetaMask to Kaia. + + )} + {favorite.type === 'snapshot' && ( + + Use Chaindata Snapshots. + + )} + {favorite.type === 'rpc' && ( + + Build and test your products without running your own node. + + )} + {favorite.type === 'wallets' && ( + + Integrate and secure digital assets seamlessly. + + )} + {favorite.type === 'indexers' && ( + + Query and index blockchain data for efficient dApp performance. + + )} ); diff --git a/src/components/Homepage/HomepageSDK.tsx b/src/components/Homepage/HomepageSDK.tsx index 6f39c815b606..a7aac57a0fac 100644 --- a/src/components/Homepage/HomepageSDK.tsx +++ b/src/components/Homepage/HomepageSDK.tsx @@ -5,34 +5,10 @@ import { useColorMode } from '@docusaurus/theme-common'; import Translate from '@docusaurus/Translate'; const TRANSLATIONS = { - ethersjs: { - name: ( - - Ethers.js Extension - - ), - }, - web3js: { - name: ( - - Web3.js Extension - - ), - }, - web3j: { - name: ( - - Web3j Extension - - ), - }, - web3py: { - name: ( - - Web3.py Extension - - ), - }, + ethersjs: 'Ethers.js Extension', + web3js: 'Web3.js Extension', + web3j: 'Web3j Extension', + web3py: 'Web3.py Extension', }; type SDKType = keyof typeof TRANSLATIONS; @@ -145,13 +121,31 @@ const StyledLink = styled(Link)` const SDK = ({ sdk }: { sdk: SDKData }) => { const { colorMode } = useColorMode(); - const translation = TRANSLATIONS[sdk.type]; return ( - {translation.name} + {sdk.type === 'ethersjs' && ( + + Ethers.js Extension + + )} + {sdk.type === 'web3js' && ( + + Web3.js Extension + + )} + {sdk.type === 'web3j' && ( + + Web3j Extension + + )} + {sdk.type === 'web3py' && ( + + Web3.py Extension + + )} );