feat: add x to social media and read titles from translation

Author: pooriaset

.vscode/settings.json

@@ -30,6 +30,7 @@
     "webp",
     "Woocommerce",
     "Yekan",
+    "اینستاگرام",
     "چنده"
   ]
 }

src/app/[locale]/layout.tsx

@@ -78,6 +78,7 @@ export const generateMetadata = async (
         title: defaultTemplateString,
         description,
         images: [imageUrl],
+        creator: '@username',
       },
       robots: {
         index: true,

src/components/Footer/components/Newsletter.tsx

@@ -43,7 +43,7 @@ const Newsletter = () => {
         onSubmit={form.handleSubmit(onSubmit)}
       >
         <Typography variant="h6">{t('footer.newsletter.title')}</Typography>
-        <Stack spacing={1} alignItems="center" direction="row">
+        <Stack spacing={1} alignItems="flex-start" direction="row">
           <Controller
             name="email"
             control={form.control}

src/components/Footer/components/SocialMedia.tsx

@@ -1,26 +1,32 @@
-import { Instagram, Telegram } from '@mui/icons-material';
+import { Instagram, Telegram, X } from '@mui/icons-material';
 import { Stack, Tooltip, Typography } from '@mui/material';
 import { useTranslations } from 'next-intl';
 import SocialMediaButton from './SocialMediaButton';
 
-const socialMediaButtons = [
-  {
-    id: 'instagram',
-    title: 'Instagram',
-    icon: <Instagram />,
-    link: 'https://instagram.com',
-  },
-  {
-    id: 'telegram',
-    title: 'Telegram',
-    icon: <Telegram />,
-    link: 'https://telegram.me/',
-  },
-];
-
 const SocialMedia = () => {
   const t = useTranslations();
 
+  const socialMediaButtons = [
+    {
+      id: 'instagram',
+      title: t('footer.socialMedia.items.instagram'),
+      icon: <Instagram />,
+      link: 'https://instagram.com',
+    },
+    {
+      id: 'telegram',
+      title: t('footer.socialMedia.items.telegram'),
+      icon: <Telegram />,
+      link: 'https://telegram.me/',
+    },
+    {
+      id: 'x',
+      title: t('footer.socialMedia.items.x'),
+      icon: <X />,
+      link: 'https://x.com/',
+    },
+  ];
+
   return (
     <Stack spacing={1}>
       <Typography variant="h6">{t('footer.socialMedia.stayTuned')}</Typography>

src/data/i18n/en.json

@@ -81,7 +81,12 @@
       "customerServiceHours:": "Customer Service Hours:"
     },
     "socialMedia": {
-      "stayTuned": "Stay Tuned!"
+      "stayTuned": "Stay Tuned!",
+      "items": {
+        "instagram": "Instagram",
+        "x": "X",
+        "telegram": "Telegram"
+      }
     },
     "links": {
       "title": "Useful Links",

src/data/i18n/fa.json

@@ -77,7 +77,12 @@
       "customerServiceHours:": "شنبه تا پنجشنبه ساعت 9 تا 18"
     },
     "socialMedia": {
-      "stayTuned": "با ما همراه باشید!"
+      "stayTuned": "با ما همراه باشید!",
+      "items": {
+        "instagram": "اینستاگرام",
+        "x": "اکس",
+        "telegram": "تلگرام"
+      }
     },
     "links": {
       "title": "لینک‌های مفید",