From b1d78b1f42772d073829f90e4e82cec446e49527 Mon Sep 17 00:00:00 2001 From: kien-ngo Date: Fri, 27 Sep 2024 01:52:10 +0000 Subject: [PATCH] [Dashboard] Replace Discord icon (#4816) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit ## Problem solved Short description of the bug fixed or feature added --- ## PR-Codex overview This PR focuses on replacing the usage of the `SiDiscord` icon from `@react-icons/all-files` with a custom `DiscordIcon` component in multiple files, enhancing the icon's integration and potentially improving styling consistency. ### Detailed summary - Replaced `SiDiscord` icon with `DiscordIcon` in: - `edit-profile.tsx` - `socialLinks.tsx` - `PublisherSocials.tsx` - Introduced `DiscordIcon` component in `DiscordIcon.tsx` with an SVG representation. > ✨ Ask PR-Codex anything about this PR by commenting with `/codex {your question}` --- .../publisher/PublisherSocials.tsx | 4 ++-- .../publisher/edit-profile.tsx | 4 ++-- .../src/components/footer/socialLinks.tsx | 4 ++-- .../icons/brand-icons/DiscordIcon.tsx | 18 ++++++++++++++++++ 4 files changed, 24 insertions(+), 6 deletions(-) create mode 100644 apps/dashboard/src/components/icons/brand-icons/DiscordIcon.tsx diff --git a/apps/dashboard/src/components/contract-components/publisher/PublisherSocials.tsx b/apps/dashboard/src/components/contract-components/publisher/PublisherSocials.tsx index 8713122199e..ec9ab96d1ee 100644 --- a/apps/dashboard/src/components/contract-components/publisher/PublisherSocials.tsx +++ b/apps/dashboard/src/components/contract-components/publisher/PublisherSocials.tsx @@ -1,11 +1,11 @@ import { ButtonGroup, type ButtonGroupProps, Icon } from "@chakra-ui/react"; -import { SiDiscord } from "@react-icons/all-files/si/SiDiscord"; import { SiFacebook } from "@react-icons/all-files/si/SiFacebook"; import { SiLinkedin } from "@react-icons/all-files/si/SiLinkedin"; import { SiMedium } from "@react-icons/all-files/si/SiMedium"; import { SiReddit } from "@react-icons/all-files/si/SiReddit"; import { SiTelegram } from "@react-icons/all-files/si/SiTelegram"; import { SiTwitter } from "@react-icons/all-files/si/SiTwitter"; +import { DiscordIcon } from "components/icons/brand-icons/DiscordIcon"; import { GithubIcon } from "components/icons/brand-icons/GithubIcon"; import type { ProfileMetadata } from "constants/schemas"; import { FiGlobe } from "react-icons/fi"; @@ -50,7 +50,7 @@ export const PublisherSocials: React.FC = ({ href={publisherProfile.discord} bg="transparent" aria-label="discord" - icon={} + icon={} category={TRACKING_CATEGORY} label="discord" /> diff --git a/apps/dashboard/src/components/contract-components/publisher/edit-profile.tsx b/apps/dashboard/src/components/contract-components/publisher/edit-profile.tsx index 4d59aeef026..631d2af250b 100644 --- a/apps/dashboard/src/components/contract-components/publisher/edit-profile.tsx +++ b/apps/dashboard/src/components/contract-components/publisher/edit-profile.tsx @@ -9,9 +9,9 @@ import { Textarea, useDisclosure, } from "@chakra-ui/react"; -import { SiDiscord } from "@react-icons/all-files/si/SiDiscord"; import { SiTwitter } from "@react-icons/all-files/si/SiTwitter"; import { useQueryClient } from "@tanstack/react-query"; +import { DiscordIcon } from "components/icons/brand-icons/DiscordIcon"; import { GithubIcon } from "components/icons/brand-icons/GithubIcon"; import { FileInput } from "components/shared/FileInput"; import { @@ -253,7 +253,7 @@ export const EditProfile: React.FC = ({
- + Discord
diff --git a/apps/dashboard/src/components/footer/socialLinks.tsx b/apps/dashboard/src/components/footer/socialLinks.tsx index 9eb227dd6d2..7db55e73bae 100644 --- a/apps/dashboard/src/components/footer/socialLinks.tsx +++ b/apps/dashboard/src/components/footer/socialLinks.tsx @@ -1,9 +1,9 @@ -import { SiDiscord } from "@react-icons/all-files/si/SiDiscord"; import { SiInstagram } from "@react-icons/all-files/si/SiInstagram"; import { SiLinkedin } from "@react-icons/all-files/si/SiLinkedin"; import { SiTiktok } from "@react-icons/all-files/si/SiTiktok"; import { SiTwitter } from "@react-icons/all-files/si/SiTwitter"; import { SiYoutube } from "@react-icons/all-files/si/SiYoutube"; +import { DiscordIcon } from "components/icons/brand-icons/DiscordIcon"; import { GithubIcon } from "components/icons/brand-icons/GithubIcon"; interface socialLinkInfo { @@ -22,7 +22,7 @@ export const SOCIALS: socialLinkInfo[] = [ ariaLabel: "Twitter", }, { - icon: , + icon: , ariaLabel: "Discord", label: "discord", link: "https://discord.gg/thirdweb", diff --git a/apps/dashboard/src/components/icons/brand-icons/DiscordIcon.tsx b/apps/dashboard/src/components/icons/brand-icons/DiscordIcon.tsx new file mode 100644 index 00000000000..05dae7581b1 --- /dev/null +++ b/apps/dashboard/src/components/icons/brand-icons/DiscordIcon.tsx @@ -0,0 +1,18 @@ +import type { SVGProps } from "react"; + +export const DiscordIcon = (props: SVGProps) => { + return ( + + Discord + + + ); +};