diff --git a/_tests_/components/footer/footer.test.jsx b/_tests_/components/footer/footer.test.jsx
index 17068d4..89f28ce 100644
--- a/_tests_/components/footer/footer.test.jsx
+++ b/_tests_/components/footer/footer.test.jsx
@@ -12,30 +12,38 @@ describe("Footer", () => {
const github = screen.getByTitle("github");
const githubA11yText = screen.getByTitle("footer-github-a11y-text");
- const githubIcon = screen.getByTitle('footer-github-icon');
- const copyright = screen.getByTitle('copyright-text');
+ const githubIcon = screen.getByTitle("footer-github-icon");
+ const copyright = screen.getByTitle("copyright-text");
- const arweave = screen.getByTitle("arweave");
- const arweaveA11yText = screen.getByTitle("footer-arweave-a11y-text");
- const arweaveIcon = screen.getByTitle('footer-arweave-icon');
+ const tiktok = screen.getByTitle("tiktok");
+ const tiktokA11yText = screen.getByTitle("footer-tiktok-a11y-text");
+ const tiktokIcon = screen.getByTitle("footer-tiktok-icon");
+
+ const instagram = screen.getByTitle("instagram");
+ const instagramA11yText = screen.getByTitle("footer-instagram-a11y-text");
+ const instagramIcon = screen.getByTitle("footer-instagram-icon");
const twitter = screen.getByTitle("twitter");
const twitterA11yText = screen.getByTitle("footer-twitter-a11y-text");
- const twitterIcon = screen.getByTitle('footer-twitter-icon');
+ const twitterIcon = screen.getByTitle("footer-twitter-icon");
expect(github).toBeInTheDocument();
- expect(githubA11yText).toHaveTextContent('footerGitHubA11yText');
+ expect(githubA11yText).toHaveTextContent("footerGitHubA11yText");
expect(githubIcon).toBeInTheDocument();
- expect(arweave).toBeInTheDocument();
- expect(arweaveA11yText).toHaveTextContent('footerArweaveA11yText');
- expect(arweaveIcon).toBeInTheDocument();
+ expect(tiktok).toBeInTheDocument();
+ expect(tiktokA11yText).toHaveTextContent("footerTiktokA11yText");
+ expect(tiktokIcon).toBeInTheDocument();
+
+ expect(instagram).toBeInTheDocument();
+ expect(instagramA11yText).toHaveTextContent("footerInstagramA11yText");
+ expect(instagramIcon).toBeInTheDocument();
expect(twitter).toBeInTheDocument();
- expect(twitterA11yText).toHaveTextContent('footerTwitterA11yText');
+ expect(twitterA11yText).toHaveTextContent("footerTwitterA11yText");
expect(twitterIcon).toBeInTheDocument();
expect(copyright).toBeInTheDocument();
- expect(copyright).toHaveTextContent('copyright');
+ expect(copyright).toHaveTextContent("copyright");
});
});
diff --git a/public/locales/en/common.json b/public/locales/en/common.json
index 6d90594..2525e46 100644
--- a/public/locales/en/common.json
+++ b/public/locales/en/common.json
@@ -60,7 +60,8 @@
"footerTwitterA11yText" : "Opens the Glosseta Twitter page in a new window",
"footerGitHubA11yText" : "Opens the GitHub project repo in a new window",
- "footerArweaveA11yText" : "Opens Arweave.org in a new window",
+ "footerInstagramA11yText" : "Opens the Glosseta Instagram page in a new window",
+ "footerITiktokA11yText" : "Opens the Glosseta TikTok page in a new window",
"wordOfTheDay" : "Word of the day",
"copyright" : "© Glosseta Foundation, 2023"
diff --git a/src/components/footer/footer.tsx b/src/components/footer/footer.tsx
index e0b451f..f31e05f 100644
--- a/src/components/footer/footer.tsx
+++ b/src/components/footer/footer.tsx
@@ -1,5 +1,5 @@
import { HStack, Link, Image, chakra, VStack, Text } from "@chakra-ui/react";
-import { FaGithub, FaTwitter } from "react-icons/fa";
+import { FaGithub, FaTwitter, FaInstagram, FaTiktok, FaLinkedin } from "react-icons/fa";
import styles from "../../../styles/Home.module.css";
import { ExternalLinkIcon } from "@chakra-ui/icons";
import { useTranslation } from "next-i18next";
@@ -30,39 +30,49 @@ const Footer = (): JSX.Element => {
-
+
- {t("footerGitHubA11yText")}
+ {t("footerInstagramA11yText")}
-
+
- {t("footerArweaveA11yText")}
+ {t("footerTiktokA11yText")}
+
+
+
+
+
+
+ {t("footerGitHubA11yText")}