From d95c5287f3b988de4ea2c01d2dabb71d032dd99c Mon Sep 17 00:00:00 2001
From: TenzDelek <tibetdelek@gmail.com>
Date: Tue, 12 Nov 2024 21:37:44 +0530
Subject: [PATCH 1/3] feat: add Bluesky social icon and update footer
 navigation

---
 .../components/Containers/Footer/index.tsx    |  2 ++
 apps/site/components/Icons/Social/Bluesky.tsx | 19 +++++++++++++++++++
 apps/site/navigation.json                     |  5 +++++
 3 files changed, 26 insertions(+)
 create mode 100644 apps/site/components/Icons/Social/Bluesky.tsx

diff --git a/apps/site/components/Containers/Footer/index.tsx b/apps/site/components/Containers/Footer/index.tsx
index 97a68475a2944..e2d2411db1098 100644
--- a/apps/site/components/Containers/Footer/index.tsx
+++ b/apps/site/components/Containers/Footer/index.tsx
@@ -2,6 +2,7 @@ import { useTranslations } from 'next-intl';
 import type { FC, SVGProps } from 'react';
 
 import NavItem from '@/components/Containers/NavBar/NavItem';
+import Bluesky from '@/components/Icons/Social/Bluesky';
 import GitHub from '@/components/Icons/Social/GitHub';
 import LinkedIn from '@/components/Icons/Social/LinkedIn';
 import Mastodon from '@/components/Icons/Social/Mastodon';
@@ -17,6 +18,7 @@ const footerSocialIcons: Record<string, React.FC<SVGProps<SVGSVGElement>>> = {
   twitter: Twitter,
   slack: Slack,
   linkedin: LinkedIn,
+  bluesky: Bluesky,
 };
 
 const Footer: FC = () => {
diff --git a/apps/site/components/Icons/Social/Bluesky.tsx b/apps/site/components/Icons/Social/Bluesky.tsx
new file mode 100644
index 0000000000000..9069be9b4ec6b
--- /dev/null
+++ b/apps/site/components/Icons/Social/Bluesky.tsx
@@ -0,0 +1,19 @@
+import type { FC, SVGProps } from 'react';
+
+const Bluesky: FC<SVGProps<SVGSVGElement>> = props => (
+  <svg
+    width="20"
+    height="20"
+    viewBox="0 0 568 501"
+    fill="none"
+    xmlns="http://www.w3.org/2000/svg"
+    {...props}
+  >
+    <path
+      fill="#1185FE"
+      d="M123.121 33.664C188.241 82.553 258.281 181.68 284 234.873c25.719-53.192 95.759-152.32 160.879-201.21C491.866-1.611 568-28.906 568 57.947c0 17.346-9.945 145.713-15.778 166.555-20.275 72.453-94.155 90.933-159.875 79.748C507.222 323.8 536.444 388.56 473.333 453.32c-119.86 122.992-172.272-30.859-185.702-70.281-2.462-7.227-3.614-10.608-3.631-7.733-.017-2.875-1.169.506-3.631 7.733-13.43 39.422-65.842 193.273-185.702 70.281-63.111-64.76-33.89-129.52 80.986-149.071-65.72 11.185-139.6-7.295-159.875-79.748C9.945 203.659 0 75.291 0 57.946 0-28.906 76.135-1.612 123.121 33.664Z"
+    ></path>
+  </svg>
+);
+
+export default Bluesky;
diff --git a/apps/site/navigation.json b/apps/site/navigation.json
index 6168c078438d5..cac52e74a7094 100644
--- a/apps/site/navigation.json
+++ b/apps/site/navigation.json
@@ -77,6 +77,11 @@
       "icon": "linkedin",
       "link": "https://www.linkedin.com/company/node-js",
       "alt": "LinkedIn"
+    },
+    {
+      "icon": "bluesky",
+      "link": "https://bsky.app/profile/nodejs.org",
+      "alt": "Bluesky"
     }
   ],
   "sideNavigation": {

From 17ae45d42a0da3a4707e3f2efdbe6eb513c2a8f0 Mon Sep 17 00:00:00 2001
From: TenzDelek <tibetdelek@gmail.com>
Date: Wed, 13 Nov 2024 09:14:36 +0530
Subject: [PATCH 2/3] add Bluesky social icon to social media logos story

---
 apps/site/components/__design__/social-logos.stories.tsx | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/apps/site/components/__design__/social-logos.stories.tsx b/apps/site/components/__design__/social-logos.stories.tsx
index 7f1a5c1288fc9..e2699163c1451 100644
--- a/apps/site/components/__design__/social-logos.stories.tsx
+++ b/apps/site/components/__design__/social-logos.stories.tsx
@@ -1,5 +1,6 @@
 import type { Meta as MetaObj, StoryObj } from '@storybook/react';
 
+import Bluesky from '@/components/Icons/Social/Bluesky';
 import GitHub from '@/components/Icons/Social/GitHub';
 import LinkedIn from '@/components/Icons/Social/LinkedIn';
 import Mastodon from '@/components/Icons/Social/Mastodon';
@@ -17,6 +18,7 @@ export const SocialMediaLogos: StoryObj = {
       <div className="flex flex-col items-center gap-4">
         <Slack width={64} height={64} />
         <Twitter width={64} height={64} />
+        <Bluesky width={64} height={64} />
       </div>
     </div>
   ),

From a19d0925b4abc8f2b4d01ad8f8ba5e4af41816a1 Mon Sep 17 00:00:00 2001
From: TenzDelek <tibetdelek@gmail.com>
Date: Thu, 14 Nov 2024 09:46:47 +0530
Subject: [PATCH 3/3] change icon order

---
 apps/site/navigation.json | 10 +++++-----
 1 file changed, 5 insertions(+), 5 deletions(-)

diff --git a/apps/site/navigation.json b/apps/site/navigation.json
index cac52e74a7094..c8a8ef2172f3b 100644
--- a/apps/site/navigation.json
+++ b/apps/site/navigation.json
@@ -68,6 +68,11 @@
       "link": "https://twitter.com/nodejs",
       "alt": "Twitter"
     },
+    {
+      "icon": "bluesky",
+      "link": "https://bsky.app/profile/nodejs.org",
+      "alt": "Bluesky"
+    },
     {
       "icon": "slack",
       "link": "https://slack-invite.openjsf.org/",
@@ -77,11 +82,6 @@
       "icon": "linkedin",
       "link": "https://www.linkedin.com/company/node-js",
       "alt": "LinkedIn"
-    },
-    {
-      "icon": "bluesky",
-      "link": "https://bsky.app/profile/nodejs.org",
-      "alt": "Bluesky"
     }
   ],
   "sideNavigation": {