From 143fae9b935ac010759f978487e62fa4e99eea6c Mon Sep 17 00:00:00 2001
From: Yisroel Baum <yisroel.d.baum@gmail.com>
Date: Sun, 14 Jun 2026 22:12:49 +0300
Subject: [PATCH] share social links

---
 .../rabbi_gerzi/src/components/SiteFooter.vue | 35 +++++++++----------
 .../rabbi_gerzi/src/content/socialLinks.ts    | 19 ++++++++++
 .../rabbi_gerzi/src/views/ContactPage.vue     | 17 +--------
 3 files changed, 36 insertions(+), 35 deletions(-)
 create mode 100644 frontend/rabbi_gerzi/src/content/socialLinks.ts

diff --git a/frontend/rabbi_gerzi/src/components/SiteFooter.vue b/frontend/rabbi_gerzi/src/components/SiteFooter.vue
index 5e3e5fe..bf61bda 100644
--- a/frontend/rabbi_gerzi/src/components/SiteFooter.vue
+++ b/frontend/rabbi_gerzi/src/components/SiteFooter.vue
@@ -1,34 +1,29 @@
 <script setup lang="ts">
 import { RouterLink } from 'vue-router'
+import { socialLinks, type SocialLinkLabel } from '@/content/socialLinks'
 
 interface FooterLink {
   label: string
   to: string
 }
 
-interface SocialLink {
-  label: string
-  href: string
-  glyph: string
-}
-
 const signatureImage = {
   src: '/assets/signature.png',
   alt: "R' Yehoshua Gerzi",
 }
 
-const socialLinks: SocialLink[] = [
-  {
-    label: 'YouTube',
-    href: '#',
-    glyph: '▶',
-  },
-  {
-    label: 'Spotify',
-    href: '#',
-    glyph: '♫',
-  },
-]
+const socialGlyphs: Record<SocialLinkLabel, string> = {
+  YouTube: '▶',
+  Spotify: '♫',
+}
+
+const footerSocialLinks = socialLinks.map((socialLink) => {
+  return {
+    label: socialLink.label,
+    href: socialLink.href,
+    glyph: socialGlyphs[socialLink.label],
+  }
+})
 
 const footerLinkColumns: FooterLink[][] = [
   [
@@ -49,11 +44,13 @@ const footerLinkColumns: FooterLink[][] = [
         <img v-bind="signatureImage" class="site-footer__signature" />
         <div class="site-footer__social">
           <a
-            v-for="socialLink in socialLinks"
+            v-for="socialLink in footerSocialLinks"
             :key="socialLink.label"
             :href="socialLink.href"
             class="site-footer__social-link"
             :aria-label="socialLink.label"
+            target="_blank"
+            rel="noopener"
           >
             {{ socialLink.glyph }}
           </a>
diff --git a/frontend/rabbi_gerzi/src/content/socialLinks.ts b/frontend/rabbi_gerzi/src/content/socialLinks.ts
new file mode 100644
index 0000000..f8318b7
--- /dev/null
+++ b/frontend/rabbi_gerzi/src/content/socialLinks.ts
@@ -0,0 +1,19 @@
+export type SocialLinkLabel = 'YouTube' | 'Spotify'
+
+export interface SocialLink {
+  label: SocialLinkLabel
+  href: string
+}
+
+const spotifyShowPath = '49H1X9A7KZWAnnIbcoQXQR?si=6253691f23be44ad'
+
+export const socialLinks: SocialLink[] = [
+  {
+    label: 'YouTube',
+    href: 'https://www.youtube.com/@rabbigerzi',
+  },
+  {
+    label: 'Spotify',
+    href: 'https://open.spotify.com/show/' + spotifyShowPath,
+  },
+]
diff --git a/frontend/rabbi_gerzi/src/views/ContactPage.vue b/frontend/rabbi_gerzi/src/views/ContactPage.vue
index f355af7..372dd29 100644
--- a/frontend/rabbi_gerzi/src/views/ContactPage.vue
+++ b/frontend/rabbi_gerzi/src/views/ContactPage.vue
@@ -2,11 +2,7 @@
 import { ref } from 'vue'
 import SiteHeader from '@/components/SiteHeader.vue'
 import SiteFooter from '@/components/SiteFooter.vue'
-
-interface SocialLink {
-  label: string
-  href: string
-}
+import { socialLinks } from '@/content/socialLinks'
 
 const contactFirstName = ref('')
 const contactLastName = ref('')
@@ -17,17 +13,6 @@ const contactMessage = ref('')
 const newsletterFullName = ref('')
 const newsletterEmail = ref('')
 
-const socialLinks: SocialLink[] = [
-  {
-    label: 'YouTube',
-    href: 'https://www.youtube.com/@rabbigerzi',
-  },
-  {
-    label: 'Spotify',
-    href: 'https://open.spotify.com/show/49H1X9A7KZWAnnIbcoQXQR?si=6253691f23be44ad',
-  },
-]
-
 function submitContact(submitEvent: Event): void {
   submitEvent.preventDefault()
   contactFirstName.value = ''