feat: Updated 2 files

src/components/CallToAction.tsx

@@ -11,6 +11,7 @@ import { loadConfettiPreset } from "tsparticles-preset-confetti";
 import { useState } from "react";
 import logo from "../assets/icon.png";
 
+import { faDiscord } from "@fortawesome/free-brands-svg-icons";
 import ExternalLinkWithText from "./ExternalLinkWithText";
 import { TypeAnimation } from "react-type-animation";
 const demo = require("../assets/demo.mp4");
@@ -136,15 +137,16 @@ export default function CallToAction() {
         </Button>
         <ExternalLinkWithText
           href="https://community.sweep.dev/"
-          color="purple.400"
+          color="purple.400" 
           mt="0 !important"
           style={{
             display: "flex",
             flexDirection: "row",
             alignItems: "center",
           }}
+          emoji={faDiscord}
         >
-          &nbsp;&nbsp;Join our community
+          &nbsp;&nbsp;Join our community  
         </ExternalLinkWithText>
         <Flex w={"full"} mt="4rem !important">
           <Container width="100vw" boxShadow="0 0 80px #181818" p={0} maxWidth="full">

src/components/ExternalLinkWithText.tsx

@@ -1,15 +1,20 @@
 import { ExternalLinkIcon } from "@chakra-ui/icons";
 import { Link, LinkProps } from "@chakra-ui/react";
 
+import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
+import { IconDefinition } from "@fortawesome/fontawesome-common-types";
+
 type ExternalLinkWithTextProps = {
     children: React.ReactNode,
     href: string
-    includeIcon?: boolean
+    includeIcon?: boolean,
+    emoji?: IconDefinition  
 } & LinkProps;
 
 export default function ExternalLinkWithText({ children, href, includeIcon = true, ...rest }: ExternalLinkWithTextProps) : JSX.Element {
     return (
         <Link href={href} isExternal rel="noopener noreferrer" {...rest}>
+            {emoji && <><FontAwesomeIcon icon={emoji} />&nbsp;</>}
             {children}{includeIcon && <>&nbsp;<ExternalLinkIcon /></>}
         </Link>
     );