From 559569cf1c145a35831ae92d272356dd088edc6c Mon Sep 17 00:00:00 2001
From: Emil Gulamov <125820963+mearashadowfax@users.noreply.github.com>
Date: Sun, 31 Mar 2024 00:48:41 +0400
Subject: [PATCH] Add titles to social icons and update URLs

Added titles to the social icons for better accessibility and updated the URLs for each social platform in the navigation component. Also added an aria-label to the LanguagePicker component and included the icon title in the Icon.astro file.
---
 src/components/ui/LanguagePicker.astro | 1 +
 src/components/ui/icons/Icon.astro     | 2 +-
 src/components/ui/icons/icons.ts       | 5 +++++
 src/utils/navigation.ts                | 8 ++++----
 4 files changed, 11 insertions(+), 5 deletions(-)

diff --git a/src/components/ui/LanguagePicker.astro b/src/components/ui/LanguagePicker.astro
index 8a78cb7..eb4e0ee 100644
--- a/src/components/ui/LanguagePicker.astro
+++ b/src/components/ui/LanguagePicker.astro
@@ -7,6 +7,7 @@ import Icon from "./icons/Icon.astro";
   <button
     id="hs-dropdown-default"
     type="button"
+    aria-label="Change language"
     class="hs-dropdown-toggle inline-flex items-center gap-x-2 rounded-lg px-1.5 py-1.5 text-sm font-medium text-neutral-600 outline-none ring-zinc-500 transition duration-300 hover:bg-neutral-200 hover:text-[#fa5a15] dark:border-neutral-700 dark:text-neutral-400 dark:ring-zinc-200 dark:hover:bg-neutral-700 dark:hover:text-[#fb713b] dark:focus:outline-none"
   >
     <Icon name="earth" />
diff --git a/src/components/ui/icons/Icon.astro b/src/components/ui/icons/Icon.astro
index 318b5ad..67a9654 100644
--- a/src/components/ui/icons/Icon.astro
+++ b/src/components/ui/icons/Icon.astro
@@ -27,7 +27,7 @@ let paths: Path[] = icon.paths || [];
       stroke-width={icon.strokeWidth}
       stroke-linecap={icon.strokeLinecap}
       stroke-linejoin={icon.strokeLinejoin}
-    >
+    ><title>{icon.title}</title>
       {paths.map((path: Path) => (
         <path d={path.d} class={path.class || ""} />
       ))}
diff --git a/src/components/ui/icons/icons.ts b/src/components/ui/icons/icons.ts
index 8e55dd0..8d27ee5 100644
--- a/src/components/ui/icons/icons.ts
+++ b/src/components/ui/icons/icons.ts
@@ -285,6 +285,7 @@ export const Icons = {
       "h-4 w-4 flex-shrink-0 fill-current text-neutral-700 dark:text-neutral-400",
     viewBox: "0 0 24 24",
     fill: "currentColor",
+    title: "Twitter",
   },
   facebookFooter: {
     paths: [
@@ -296,6 +297,7 @@ export const Icons = {
       "h-4 w-4 flex-shrink-0 fill-current text-neutral-700 dark:text-neutral-400",
     viewBox: "0 0 24 24",
     fill: "currentColor",
+    title: "Facebook",
   },
   githubFooter: {
     paths: [
@@ -307,6 +309,7 @@ export const Icons = {
       "h-4 w-4 flex-shrink-0 fill-current text-neutral-700 dark:text-neutral-400",
     viewBox: "0 0 24 24",
     fill: "currentColor",
+    title: "GitHub",
   },
   googleFooter: {
     paths: [
@@ -318,6 +321,7 @@ export const Icons = {
       "h-4 w-4 flex-shrink-0 fill-current text-neutral-700 dark:text-neutral-400",
     viewBox: "0 0 24 24",
     fill: "currentColor",
+    title: "Google",
   },
   slackFooter: {
     paths: [
@@ -329,6 +333,7 @@ export const Icons = {
       "h-4 w-4 flex-shrink-0 fill-current text-neutral-700 dark:text-neutral-400",
     viewBox: "0 0 24 24",
     fill: "currentColor",
+    title: "Slack",
   },
   quotation: {
     paths: [
diff --git a/src/utils/navigation.ts b/src/utils/navigation.ts
index 3124a97..7d1d71c 100644
--- a/src/utils/navigation.ts
+++ b/src/utils/navigation.ts
@@ -28,11 +28,11 @@ const footerLinks = [
 ];
 // An object of links for social icons
 const socialLinks = {
-  facebook: "#",
-  x: "#",
+  facebook: "https://www.facebook.com/",
+  x: "https://twitter.com/",
   github: "https://github.com/mearashadowfax/ScrewFast",
-  google: "#",
-  slack: "#",
+  google: "https://www.google.com/",
+  slack: "https://slack.com/",
 };
 
 export default {