From fbeab5a74432c2231163ebcf52a37f910b92c879 Mon Sep 17 00:00:00 2001 From: enscribe Date: Fri, 13 Sep 2024 11:45:15 -0700 Subject: [PATCH] refactor: `SocialIcons` handling --- public/site.webmanifest | 34 ++++----- src/components/AuthorCard.astro | 84 ++++++---------------- src/components/Footer.astro | 3 +- src/components/Head.astro | 14 ++-- src/components/Header.astro | 2 +- src/components/SocialIcons.astro | 104 +++++++++++++-------------- src/components/TableOfContents.astro | 4 +- src/consts.ts | 11 ++- src/content/authors/enscribe.md | 5 +- 9 files changed, 114 insertions(+), 147 deletions(-) diff --git a/public/site.webmanifest b/public/site.webmanifest index 16286dc..aa79006 100644 --- a/public/site.webmanifest +++ b/public/site.webmanifest @@ -1,19 +1,19 @@ { - "name": "erudite", - "short_name": "erudite", - "icons": [ - { - "src": "/android-chrome-192x192.png", - "sizes": "192x192", - "type": "image/png" - }, - { - "src": "/android-chrome-512x512.png", - "sizes": "512x512", - "type": "image/png" - } - ], - "theme_color": "#121212", - "background_color": "#121212", - "display": "standalone" + "name": "erudite", + "short_name": "erudite", + "icons": [ + { + "src": "/android-chrome-192x192.png", + "sizes": "192x192", + "type": "image/png" + }, + { + "src": "/android-chrome-512x512.png", + "sizes": "512x512", + "type": "image/png" + } + ], + "theme_color": "#121212", + "background_color": "#121212", + "display": "standalone" } diff --git a/src/components/AuthorCard.astro b/src/components/AuthorCard.astro index 923007d..210b4ed 100644 --- a/src/components/AuthorCard.astro +++ b/src/components/AuthorCard.astro @@ -1,18 +1,35 @@ --- import AvatarComponent from '@/components/ui/avatar' -import { buttonVariants } from '@/components/ui/button' import { cn } from '@/lib/utils' import Link from '@components/Link.astro' +import type { Link as SocialLink } from '@consts' import type { CollectionEntry } from 'astro:content' -import { Github, Globe, Linkedin, Twitter } from 'lucide-react' +import SocialIcons from './SocialIcons.astro' type Props = { author: CollectionEntry<'authors'> linkDisabled?: boolean } const { author, linkDisabled = false } = Astro.props -const { name, avatar, bio, pronouns, github, twitter, linkedin, website } = - author.data +const { + name, + avatar, + bio, + pronouns, + github, + twitter, + linkedin, + website, + mail, +} = author.data + +const socialLinks: SocialLink[] = [ + website && { href: website, label: 'Website' }, + github && { href: github, label: 'GitHub' }, + twitter && { href: twitter, label: 'Twitter' }, + linkedin && { href: linkedin, label: 'LinkedIn' }, + mail && { href: mail, label: 'Email' }, +].filter(Boolean) as SocialLink[] ---

{bio}

- + diff --git a/src/components/Footer.astro b/src/components/Footer.astro index 8db871f..9e98152 100644 --- a/src/components/Footer.astro +++ b/src/components/Footer.astro @@ -1,5 +1,6 @@ --- import Container from '@components/Container.astro' +import { SOCIAL_LINKS } from '@consts' import SocialIcons from './SocialIcons.astro' --- @@ -13,7 +14,7 @@ import SocialIcons from './SocialIcons.astro' © {new Date().getFullYear()} All rights reserved.

- + diff --git a/src/components/Head.astro b/src/components/Head.astro index 107d004..e91937a 100644 --- a/src/components/Head.astro +++ b/src/components/Head.astro @@ -28,13 +28,13 @@ const { title, description, image = '/static/twitter-card.png' } = Astro.props - - - - - - - + + + + + + + diff --git a/src/components/Header.astro b/src/components/Header.astro index 053ca3e..7ddecc2 100644 --- a/src/components/Header.astro +++ b/src/components/Header.astro @@ -13,7 +13,7 @@ import logo from '../../public/static/logo.svg' transition:persist > -
+
({ + href: label === 'Email' ? `mailto:${href}` : href, + ariaLabel: label, + Icon: iconMap[label as keyof typeof iconMap] || MessageCircleQuestion, +}) --- -
    -
  • - - - -
    • -
  • - - - -
    • -
  • - - - -
    • -
  • - - - -
    • -
  • - - - -
    • +
      + { + links.map((link) => { + const { href, ariaLabel, Icon } = getSocialLink(link) + return ( +
    • + + + +
      • + ) + }) + }
    diff --git a/src/components/TableOfContents.astro b/src/components/TableOfContents.astro index 88e6455..d3b2898 100644 --- a/src/components/TableOfContents.astro +++ b/src/components/TableOfContents.astro @@ -34,7 +34,7 @@ function buildToc(headings: Heading[]) { Table of Contents @@ -45,7 +45,7 @@ function buildToc(headings: Heading[]) { diff --git a/src/consts.ts b/src/consts.ts index ae11778..d911d6c 100644 --- a/src/consts.ts +++ b/src/consts.ts @@ -6,7 +6,7 @@ export type Site = { SITEURL: string } -export type NavigationLink = { +export type Link = { href: string label: string } @@ -20,8 +20,15 @@ export const SITE: Site = { SITEURL: 'https://astro-erudite.vercel.app', } -export const NAV_LINKS: NavigationLink[] = [ +export const NAV_LINKS: Link[] = [ { href: '/blog', label: 'blog' }, { href: '/authors', label: 'authors' }, { href: '/about', label: 'about' }, ] + +export const SOCIAL_LINKS: Link[] = [ + { href: 'https://github.com/jktrn', label: 'GitHub' }, + { href: 'https://twitter.com/enscry', label: 'Twitter' }, + { href: 'jason@enscribe.dev', label: 'Email' }, + { href: '/rss.xml', label: 'RSS' }, +] diff --git a/src/content/authors/enscribe.md b/src/content/authors/enscribe.md index b0105d6..57cac26 100644 --- a/src/content/authors/enscribe.md +++ b/src/content/authors/enscribe.md @@ -4,6 +4,7 @@ pronouns: 'he/him' avatar: 'https://gravatar.com/avatar/9bfdc4ec972793cf05cb91efce5f4aaaec2a0da1bf4ec34dad0913f1d845faf6.webp?size=256' bio: 'd(-_-)b' website: 'https://enscribe.dev' -twitter: 'enscry' -github: 'jktrn' +twitter: 'https://twitter.com/enscry' +github: 'https://github.com/jktrn' +mail: 'jason@enscribe.dev' ---