From 4ea774cca5e8caad62cdc4d53e61b8b59760ffb5 Mon Sep 17 00:00:00 2001 From: Aidan Date: Thu, 23 Jan 2025 22:38:44 -0500 Subject: [PATCH] add handling for non-github repos, fix hydration errors in header, use Link instead of , move contact button to own component, migrate data folders, use music skip buttons for navigating songs on music by time, change icon in footer, update about page with gitea details, rename LastPlayed widget --- app/components/Footer.tsx | 6 +- app/components/Header.tsx | 8 +- app/components/objects/ContactButton.tsx | 26 ++++ app/components/pages/About.tsx | 14 ++- app/components/pages/Contact.tsx | 23 +--- app/components/pages/Domains.tsx | 2 +- app/components/pages/Home.tsx | 3 + .../{GitHubFeatured.tsx => FeaturedRepos.tsx} | 9 +- .../{NowPlaying.tsx => LastPlayed.tsx} | 8 +- app/components/widgets/Music.tsx | 18 +-- app/page.tsx | 4 +- {app => public}/data/domains.json | 0 {app => public}/data/featured.json | 18 +-- public/data/music.json | 117 ++++++++---------- 14 files changed, 128 insertions(+), 128 deletions(-) create mode 100644 app/components/objects/ContactButton.tsx rename app/components/widgets/{GitHubFeatured.tsx => FeaturedRepos.tsx} (73%) rename app/components/widgets/{NowPlaying.tsx => LastPlayed.tsx} (95%) rename {app => public}/data/domains.json (100%) rename {app => public}/data/featured.json (65%) diff --git a/app/components/Footer.tsx b/app/components/Footer.tsx index 43be013..0adb183 100644 --- a/app/components/Footer.tsx +++ b/app/components/Footer.tsx @@ -1,12 +1,12 @@ import { FontAwesomeIcon } from '@fortawesome/react-fontawesome' -import { faGithub } from '@fortawesome/free-brands-svg-icons' +import { faHeart } from '@fortawesome/free-solid-svg-icons'; export default function Footer() { return ( diff --git a/app/components/Header.tsx b/app/components/Header.tsx index 983c7c1..e793015 100644 --- a/app/components/Header.tsx +++ b/app/components/Header.tsx @@ -14,12 +14,12 @@ interface NavItemProps { } const NavItem = ({ href, icon, children }: NavItemProps) => ( -
  • +
    {children} -
    • + ); export default function Header() { @@ -43,12 +43,12 @@ export default function Header() { Domains Blog Music by Time -
  • +
    Tilde what? -
    • + diff --git a/app/components/objects/ContactButton.tsx b/app/components/objects/ContactButton.tsx new file mode 100644 index 0000000..53000cc --- /dev/null +++ b/app/components/objects/ContactButton.tsx @@ -0,0 +1,26 @@ +import { IconDefinition } from '@fortawesome/fontawesome-svg-core' +import { FontAwesomeIcon } from '@fortawesome/react-fontawesome' +import Link from 'next/link'; + +interface ContactButtonProps { + href: string; + icon: IconDefinition; + label: string; + className?: string; +} + +function ContactButton({ href, icon, label, className }: ContactButtonProps) { + return ( + + + {label} + + ) +} + +export default ContactButton; \ No newline at end of file diff --git a/app/components/pages/About.tsx b/app/components/pages/About.tsx index 3ba4ae4..8fe37b6 100644 --- a/app/components/pages/About.tsx +++ b/app/components/pages/About.tsx @@ -2,9 +2,10 @@ import { FontAwesomeIcon } from '@fortawesome/react-fontawesome' import { faUser } from '@fortawesome/free-solid-svg-icons' -import GitHubFeatured from '../widgets/GitHubFeatured' +import FeaturedRepos from '../widgets/FeaturedRepos' import Image from 'next/image' import { useState } from 'react' +import Link from 'next/link' export default function About() { const [imageError, setImageError] = useState(false); @@ -28,12 +29,13 @@ export default function About() { When I'm not programming, I can typically be found installing another Linux distro on my laptop or flashing a new ROM to my phone. I am also a passionate writer and I like to write creatively in my free time.

    - I am almost always active on GitHub and make daily contributions to several of my repositories. I am a big fan of open source software and public domain software (which most of my repos are licensed under). In fact, the website you're currently on is free and open source. It's even under the public domain! + I am almost always active on my Gitea instance and GitHub and make daily contributions to several of my repositories. I am a big fan of open source software and public domain software (which most of my repos are licensed under). In fact, the website you're currently on is free and open source. It's even under the public domain!

    -

    My GitHub Contributions

    -

    You can find me on GitHub as ihatenodejs.

    +

    My Gitea/GitHub Contributions

    +

    Most of my repositories have migrated to LibreCloud Git. My username is aidan.

    +

    You can find me on GitHub as ihatenodejs.

    {!imageError && (

    Featured Projects

    -

    Here's just four of my top projects.

    - +

    Here's just four of my top projects. Star and fork counts are manually updated and count both Gitea and GitHub.

    +
    ) diff --git a/app/components/pages/Contact.tsx b/app/components/pages/Contact.tsx index 1e37473..2ba6694 100644 --- a/app/components/pages/Contact.tsx +++ b/app/components/pages/Contact.tsx @@ -1,7 +1,7 @@ import { FontAwesomeIcon } from '@fortawesome/react-fontawesome' import { faPhone, faEnvelope } from '@fortawesome/free-solid-svg-icons' import { faGithub, faTelegram } from '@fortawesome/free-brands-svg-icons' -import { IconDefinition } from '@fortawesome/fontawesome-svg-core' +import ContactButton from '../objects/ContactButton' export default function Contact() { return ( @@ -35,24 +35,3 @@ export default function Contact() {
    ) } - -interface ContactButtonProps { - href: string; - icon: IconDefinition; - label: string; - className?: string; -} - -function ContactButton({ href, icon, label, className }: ContactButtonProps) { - return ( - - - {label} - - ) -} \ No newline at end of file diff --git a/app/components/pages/Domains.tsx b/app/components/pages/Domains.tsx index de5ad89..80b5f4d 100644 --- a/app/components/pages/Domains.tsx +++ b/app/components/pages/Domains.tsx @@ -1,6 +1,6 @@ import { FontAwesomeIcon } from '@fortawesome/react-fontawesome' import { faLink } from '@fortawesome/free-solid-svg-icons' -import domains from '../../data/domains.json' +import domains from '../../../public/data/domains.json' export default function About() { return ( diff --git a/app/components/pages/Home.tsx b/app/components/pages/Home.tsx index c605f17..e973a18 100644 --- a/app/components/pages/Home.tsx +++ b/app/components/pages/Home.tsx @@ -40,6 +40,9 @@ export default function Home() {

    I'm most proud of LibreCloud/p0ntus mail, which is a cloud services provider that I self-host and maintain, free of charge.

    +

    + I frequently write and work on a website hosted on a public Linux server, called a "tilde." You can check it out by clicking the link "Tilde" in the header, or "what?" if you are still confused! +

    diff --git a/app/components/widgets/GitHubFeatured.tsx b/app/components/widgets/FeaturedRepos.tsx similarity index 73% rename from app/components/widgets/GitHubFeatured.tsx rename to app/components/widgets/FeaturedRepos.tsx index f507abe..4d1d4a9 100644 --- a/app/components/widgets/GitHubFeatured.tsx +++ b/app/components/widgets/FeaturedRepos.tsx @@ -1,7 +1,8 @@ import { FontAwesomeIcon } from '@fortawesome/react-fontawesome' -import { faGithub } from '@fortawesome/free-brands-svg-icons' +import { faGitAlt, faGithub } from '@fortawesome/free-brands-svg-icons' import { faStar, faCodeBranch } from '@fortawesome/free-solid-svg-icons' -import featuredProjects from '../../data/featured.json' +import featuredProjects from '../../../public/data/featured.json' +import Link from 'next/link' export default function GitHubFeatured() { return ( @@ -10,12 +11,12 @@ export default function GitHubFeatured() {

    - {project.name} + {project.name}

    {project.description}

    - View Repo + View Repo
    {project.stars} {project.forks} diff --git a/app/components/widgets/NowPlaying.tsx b/app/components/widgets/LastPlayed.tsx similarity index 95% rename from app/components/widgets/NowPlaying.tsx rename to app/components/widgets/LastPlayed.tsx index 4614e89..3905b63 100644 --- a/app/components/widgets/NowPlaying.tsx +++ b/app/components/widgets/LastPlayed.tsx @@ -15,7 +15,7 @@ interface Track { '@attr'?: { nowplaying: string }; } -const NowPlaying: React.FC = () => { +const LastPlayed: React.FC = () => { const [track, setTrack] = useState(null); const apiUrl = process.env.LASTFM_API_URL || 'https://lastfm-last-played.biancarosa.com.br/aidxn_/latest-song'; @@ -29,7 +29,7 @@ const NowPlaying: React.FC = () => { if (!track) { return (
    -

    Music

    +

    Last Played Song

    @@ -39,7 +39,7 @@ const NowPlaying: React.FC = () => { return (
    -

    Music

    +

    Last Played Song

    img.size === 'large')?.['#text'] || '/placeholder.png'} @@ -61,4 +61,4 @@ const NowPlaying: React.FC = () => { ); }; -export default NowPlaying; \ No newline at end of file +export default LastPlayed; \ No newline at end of file diff --git a/app/components/widgets/Music.tsx b/app/components/widgets/Music.tsx index 477f34a..3e74a8e 100644 --- a/app/components/widgets/Music.tsx +++ b/app/components/widgets/Music.tsx @@ -2,7 +2,7 @@ import { useState, useEffect } from 'react'; import Image from 'next/image'; -import { Play, SkipBack, SkipForward, ChevronLeft, ChevronRight } from 'lucide-react'; +import { Play, SkipBack, SkipForward } from 'lucide-react'; import LoadingSpinner from '../objects/LoadingSpinner'; interface Song { @@ -19,7 +19,7 @@ interface Period { } export default function Home() { - const [timePeriod, setTimePeriod] = useState('Summer 2024'); + const [timePeriod, setTimePeriod] = useState('Early Summer 2024'); const [songs, setSongs] = useState([]); const [currentIndex, setCurrentIndex] = useState(0); const [isLoading, setIsLoading] = useState(true); @@ -61,7 +61,7 @@ export default function Home() { onChange={(e) => setTimePeriod(e.target.value)} className="ml-2 p-2 bg-gray-700 text-gray-300 rounded" > - +
    @@ -69,10 +69,6 @@ export default function Home() { {!isLoading && songs.length > 0 && (
    - -
    {songs[currentIndex].artist}

    {songs[currentIndex].duration}

    - -
    - -
    )}
    diff --git a/app/page.tsx b/app/page.tsx index 826101d..31eb077 100644 --- a/app/page.tsx +++ b/app/page.tsx @@ -1,7 +1,7 @@ import Header from './components/Header'; import HomePg from './components/pages/Home'; import Footer from './components/Footer'; -import NowPlaying from './components/widgets/NowPlaying'; +import LastPlayed from './components/widgets/LastPlayed'; export default function Home() { return ( @@ -9,7 +9,7 @@ export default function Home() {
    - +