moved the Discord icon to a separate component (#2040)

Author: samuil4

src/components/client/layout/Footer/SocialIcons.tsx

@@ -1,8 +1,8 @@
 import { Facebook, LinkedIn, YouTube, Instagram } from '@mui/icons-material'
-import Image from 'next/image'
 
 import { socialUrls } from 'common/routes'
 import ExternalLink from 'components/common/ExternalLink'
+import DiscordIcon from 'components/common/DiscordIcon'
 import { useTranslation } from 'next-i18next'
 
 import { SocialIconsWrapper } from './Footer.styled'
@@ -27,18 +27,8 @@ export const SocialIcons = () => {
         aria-label={t('components.footer.social.instagram')}>
         <Instagram />
       </ExternalLink>
-      <ExternalLink
-        href="https://discord.com/invite/nZAeCb9YzP"
-        aria-label={t('components.footer.social.discord')}>
-        <svg
-          className="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium mui-20bmp1-MuiSvgIcon-root"
-          xmlns="http://www.w3.org/2000/svg"
-          width="28"
-          height="28"
-          viewBox="0 0 640 512"
-          fill="currentColor">
-          <path d="M524.531 69.836a1.5 1.5 0 0 0-.764-.7A485.065 485.065 0 0 0 404.081 32.03a1.816 1.816 0 0 0-1.923.91a337.461 337.461 0 0 0-14.9 30.6a447.848 447.848 0 0 0-134.426 0a309.541 309.541 0 0 0-15.135-30.6a1.89 1.89 0 0 0-1.924-.91a483.689 483.689 0 0 0-119.688 37.107a1.712 1.712 0 0 0-.788.676C39.068 183.651 18.186 294.69 28.43 404.354a2.016 2.016 0 0 0 .765 1.375a487.666 487.666 0 0 0 146.825 74.189a1.9 1.9 0 0 0 2.063-.676A348.2 348.2 0 0 0 208.12 430.4a1.86 1.86 0 0 0-1.019-2.588a321.173 321.173 0 0 1-45.868-21.853a1.885 1.885 0 0 1-.185-3.126a251.047 251.047 0 0 0 9.109-7.137a1.819 1.819 0 0 1 1.9-.256c96.229 43.917 200.41 43.917 295.5 0a1.812 1.812 0 0 1 1.924.233a234.533 234.533 0 0 0 9.132 7.16a1.884 1.884 0 0 1-.162 3.126a301.407 301.407 0 0 1-45.89 21.83a1.875 1.875 0 0 0-1 2.611a391.055 391.055 0 0 0 30.014 48.815a1.864 1.864 0 0 0 2.063.7A486.048 486.048 0 0 0 610.7 405.729a1.882 1.882 0 0 0 .765-1.352c12.264-126.783-20.532-236.912-86.934-334.541M222.491 337.58c-28.972 0-52.844-26.587-52.844-59.239s23.409-59.241 52.844-59.241c29.665 0 53.306 26.82 52.843 59.239c0 32.654-23.41 59.241-52.843 59.241m195.38 0c-28.971 0-52.843-26.587-52.843-59.239s23.409-59.241 52.843-59.241c29.667 0 53.307 26.82 52.844 59.239c0 32.654-23.177 59.241-52.844 59.241" />
-        </svg>
+      <ExternalLink href={socialUrls.discord} aria-label={t('components.footer.social.discord')}>
+        <DiscordIcon />
       </ExternalLink>
       <Subscription />
     </SocialIconsWrapper>

src/components/common/DiscordIcon.tsx

@@ -0,0 +1,19 @@
+import { SvgIcon, SvgIconProps } from '@mui/material'
+
+const DiscordIcon = (props: SvgIconProps) => {
+  return (
+    <SvgIcon
+      {...props}
+      viewBox="0 0 640 512"
+      className="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium mui-20bmp1-MuiSvgIcon-root"
+      sx={{
+        width: 28,
+        height: 28,
+        ...props.sx,
+      }}>
+      <path d="M524.531 69.836a1.5 1.5 0 0 0-.764-.7A485.065 485.065 0 0 0 404.081 32.03a1.816 1.816 0 0 0-1.923.91a337.461 337.461 0 0 0-14.9 30.6a447.848 447.848 0 0 0-134.426 0a309.541 309.541 0 0 0-15.135-30.6a1.89 1.89 0 0 0-1.924-.91a483.689 483.689 0 0 0-119.688 37.107a1.712 1.712 0 0 0-.788.676C39.068 183.651 18.186 294.69 28.43 404.354a2.016 2.016 0 0 0 .765 1.375a487.666 487.666 0 0 0 146.825 74.189a1.9 1.9 0 0 0 2.063-.676A348.2 348.2 0 0 0 208.12 430.4a1.86 1.86 0 0 0-1.019-2.588a321.173 321.173 0 0 1-45.868-21.853a1.885 1.885 0 0 1-.185-3.126a251.047 251.047 0 0 0 9.109-7.137a1.819 1.819 0 0 1 1.9-.256c96.229 43.917 200.41 43.917 295.5 0a1.812 1.812 0 0 1 1.924.233a234.533 234.533 0 0 0 9.132 7.16a1.884 1.884 0 0 1-.162 3.126a301.407 301.407 0 0 1-45.89 21.83a1.875 1.875 0 0 0-1 2.611a391.055 391.055 0 0 0 30.014 48.815a1.864 1.864 0 0 0 2.063.7A486.048 486.048 0 0 0 610.7 405.729a1.882 1.882 0 0 0 .765-1.352c12.264-126.783-20.532-236.912-86.934-334.541M222.491 337.58c-28.972 0-52.844-26.587-52.844-59.239s23.409-59.241 52.844-59.241c29.665 0 53.306 26.82 52.843 59.239c0 32.654-23.41 59.241-52.843 59.241m195.38 0c-28.971 0-52.843-26.587-52.843-59.239s23.409-59.241 52.843-59.241c29.667 0 53.307 26.82 52.844 59.239c0 32.654-23.177 59.241-52.844 59.241" />
+    </SvgIcon>
+  )
+}
+
+export default DiscordIcon