aidan/aidxnCC
1
1
Fork 0
Code Issues 1 Pull requests 1 Projects Releases Packages Wiki Activity Actions

add handling for non-github repos, fix hydration errors in header, use Link instead of <a>, 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

Browse source
This commit is contained in:
Aidan 2025-01-23 22:38:44 -05:00
parent 28d0cb4d63
commit 4ea774cca5
14 changed files with 128 additions and 128 deletions
Download patch file Download diff file Expand all files Collapse all files

9
app/components/widgets/GitHubFeatured.tsx → app/components/widgets/FeaturedRepos.tsx
View file

@ -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() {
<div key={project.id} className="bg-gray-800 p-6 rounded-lg shadow-md min-h-[200px] flex flex-col">
<div className="flex-1">
<h3 className="text-xl font-bold text-gray-100 mb-3">
<FontAwesomeIcon icon={faGithub} className="mr-2" /> {project.name}
<FontAwesomeIcon icon={project.github ? faGithub : faGitAlt} className="mr-2" /> {project.name}
</h3>
<p className="text-gray-300 flex-grow">{project.description}</p>
</div>
<div className="pt-4 border-t border-gray-700 flex justify-between items-center mt-auto">
<a href={project.url} className="text-blue-400 hover:underline">View Repo</a>
<Link href={project.url} className="text-blue-400 hover:underline">View Repo</Link>
<div className="flex items-center text-gray-400">
<FontAwesomeIcon icon={faStar} className="mr-1" /> {project.stars}
<FontAwesomeIcon icon={faCodeBranch} className="ml-4 mr-1" /> {project.forks}

8
app/components/widgets/NowPlaying.tsx → app/components/widgets/LastPlayed.tsx
View file

@ -15,7 +15,7 @@ interface Track {
'@attr'?: { nowplaying: string };
}
const NowPlaying: React.FC = () => {
const LastPlayed: React.FC = () => {
const [track, setTrack] = useState<Track | null>(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 (
<div className="max-w-2xl mx-auto mt-4">
<h2 className="text-2xl font-bold mb-4 pt-10 text-gray-200">Music</h2>
<h2 className="text-2xl font-bold mb-4 pt-10 text-gray-200">Last Played Song</h2>
<div className="flex justify-center items-center border border-gray-300 rounded-lg p-4 max-w-md mt-8">
<span className="spinner-border animate-spin inline-block w-8 h-8 border-4 rounded-full" role="status"></span>
</div>
@ -39,7 +39,7 @@ const NowPlaying: React.FC = () => {
return (
<div className="max-w-2xl mx-auto mt-4">
<h2 className="text-2xl font-bold mb-4 pt-10 text-gray-200">Music</h2>
<h2 className="text-2xl font-bold mb-4 pt-10 text-gray-200">Last Played Song</h2>
<div className="now-playing flex items-center border border-gray-300 rounded-lg p-4 max-w-md mt-8 bg-white bg-opacity-10 backdrop-filter backdrop-blur-lg">
<Image
src={track.image.find(img => img.size === 'large')?.['#text'] || '/placeholder.png'}
@ -61,4 +61,4 @@ const NowPlaying: React.FC = () => {
);
};
export default NowPlaying;
export default LastPlayed;

18
app/components/widgets/Music.tsx
View file

@ -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<Song[]>([]);
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"
>
<option value="Summer 2024">Summer 2024</option>
<option value="Early Summer 2024">Early Summer 2024</option>
</select>
</div>
@ -69,10 +69,6 @@ export default function Home() {
{!isLoading && songs.length > 0 && (
<div className="relative">
<button onClick={handlePrevious} className="absolute left-0 top-1/2 transform -translate-y-1/2 text-gray-300">
<ChevronLeft className="w-8 h-8" />
</button>
<div className="text-center">
<Image
src={songs[currentIndex].albumArt}
@ -85,21 +81,17 @@ export default function Home() {
<p className="text-gray-300">{songs[currentIndex].artist}</p>
<p className="text-gray-300">{songs[currentIndex].duration}</p>
<div className="mt-4">
<button className="mr-4 text-gray-300">
<button onClick={handlePrevious} className="mr-4 text-gray-300">
<SkipBack className="w-8 h-8" />
</button>
<button className="mr-4 text-gray-300" onClick={() => window.open(songs[currentIndex]?.link, '_blank')}>
<Play className="w-8 h-8" />
</button>
<button className="text-gray-300">
<button onClick={handleNext} className="text-gray-300">
<SkipForward className="w-8 h-8" />
</button>
</div>
</div>
<button onClick={handleNext} className="absolute right-0 top-1/2 transform -translate-y-1/2 text-gray-300">
<ChevronRight className="w-8 h-8" />
</button>
</div>
)}
</section>