feat/fix: implement WebSockets for NowPlaying, better data fetching with addl. Last.fm fetch, docker build fix

This commit is contained in:
Aidan 2025-09-07 00:09:06 -04:00
parent 4cec7406c3
commit 7121ec926f
11 changed files with 514 additions and 175 deletions

View file

@ -1,13 +1,16 @@
import React from 'react'
import { Metadata } from 'next'
import Head from 'next/head'
import { Metadata, Viewport } from 'next'
import './globals.css'
import { GeistSans } from 'geist/font/sans'
import AnimatedTitle from '../components/AnimatedTitle'
import I18nProvider from '../components/I18nProvider'
export const metadata: Metadata = {
title: 'aidxn.cc',
description: "The Internet home of Aidan. Come on in!",
authors: [{ name: 'aidxn.cc' }],
robots: 'index, follow',
metadataBase: new URL('https://aidxn.cc'),
openGraph: {
type: "website",
url: "https://aidxn.cc",
@ -22,6 +25,32 @@ export const metadata: Metadata = {
},
],
},
icons: {
icon: [
{ url: '/favicon-16x16.png', sizes: '16x16', type: 'image/png' },
{ url: '/favicon-32x32.png', sizes: '32x32', type: 'image/png' },
{ url: '/favicon-96x96.png', sizes: '96x96', type: 'image/png' },
{ url: '/android-icon-192x192.png', sizes: '192x192', type: 'image/png' },
],
apple: [
{ url: '/apple-icon-57x57.png', sizes: '57x57' },
{ url: '/apple-icon-60x60.png', sizes: '60x60' },
{ url: '/apple-icon-72x72.png', sizes: '72x72' },
{ url: '/apple-icon-76x76.png', sizes: '76x76' },
{ url: '/apple-icon-114x114.png', sizes: '114x114' },
{ url: '/apple-icon-120x120.png', sizes: '120x120' },
{ url: '/apple-icon-144x144.png', sizes: '144x144' },
{ url: '/apple-icon-152x152.png', sizes: '152x152' },
{ url: '/apple-icon-180x180.png', sizes: '180x180' },
],
},
manifest: '/manifest.json',
}
export const viewport: Viewport = {
themeColor: '#111827',
width: 'device-width',
initialScale: 1,
}
export default function RootLayout({
@ -31,30 +60,6 @@ export default function RootLayout({
}) {
return (
<html lang="en" className="dark">
<Head>
<link rel="apple-touch-icon" sizes="57x57" href="/apple-icon-57x57.png" />
<link rel="apple-touch-icon" sizes="60x60" href="/apple-icon-60x60.png" />
<link rel="apple-touch-icon" sizes="72x72" href="/apple-icon-72x72.png" />
<link rel="apple-touch-icon" sizes="76x76" href="/apple-icon-76x76.png" />
<link rel="apple-touch-icon" sizes="114x114" href="/apple-icon-114x114.png" />
<link rel="apple-touch-icon" sizes="120x120" href="/apple-icon-120x120.png" />
<link rel="apple-touch-icon" sizes="144x144" href="/apple-icon-144x144.png" />
<link rel="apple-touch-icon" sizes="152x152" href="/apple-icon-152x152.png" />
<link rel="apple-touch-icon" sizes="180x180" href="/apple-icon-180x180.png" />
<link rel="icon" type="image/png" sizes="192x192" href="/android-icon-192x192.png" />
<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png" />
<link rel="icon" type="image/png" sizes="96x96" href="/favicon-96x96.png" />
<link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png" />
<link rel="manifest" href="/manifest.json" />
<meta name="msapplication-TileColor" content="#ffffff" />
<meta name="msapplication-TileImage" content="/ms-icon-144x144.png" />
<meta name="theme-color" content="#ffffff" />
<meta charSet="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<meta name="robots" content="index, follow" />
<meta name="language" content="English" />
<meta name="author" content="aidxn.cc" />
</Head>
<body className={`${GeistSans.className} bg-gray-900 text-gray-100`}>
<AnimatedTitle />
<I18nProvider>
@ -63,5 +68,4 @@ export default function RootLayout({
</body>
</html>
);
}
}

View file

@ -4,6 +4,7 @@ import Header from '@/components/Header'
import Footer from '@/components/Footer'
import Button from '@/components/objects/Button'
import LastPlayed from '@/components/widgets/NowPlaying'
import LiveIndicator from '@/components/widgets/LiveIndicator'
import Image from 'next/image'
@ -59,12 +60,7 @@ export default function Home() {
<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4 p-4">
<div className="relative border-2 border-gray-700 rounded-lg hover:border-gray-600 transition-colors duration-300 p-4">
<div className="absolute top-2 right-2">
<div className="flex items-center gap-1 bg-black bg-opacity-50 rounded-full px-2 py-1">
<div className="w-1 h-1 bg-red-400 rounded-full animate-pulse"></div>
<div className="text-white text-xs">
LIVE
</div>
</div>
<LiveIndicator />
</div>
<div className="flex justify-center items-center h-full">
<LastPlayed />