aidan/aidxnCC
Archived
1
1
Fork 0
Code Issues Pull Requests Actions Activity

rm unused import, use <Image /> for better image handling

Browse Source
This commit is contained in:
Aidan 2025-01-06 01:19:32 -05:00
parent 88149ed26a
commit 73a4f1cd72
2 changed files with 11 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
app/components/NowPlaying.tsx
View File

@ -1,6 +1,7 @@
"use client"; "use client";
import React, { useEffect, useState, JSX } from 'react'; import React, { useEffect, useState } from 'react';
import Image from 'next/image';
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome' import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
import { faLastfm } from '@fortawesome/free-brands-svg-icons' import { faLastfm } from '@fortawesome/free-brands-svg-icons'
import { faCompactDisc, faUser } from '@fortawesome/free-solid-svg-icons' import { faCompactDisc, faUser } from '@fortawesome/free-solid-svg-icons'
@ -40,10 +41,12 @@ const NowPlaying: React.FC = () => {
<div className="max-w-2xl mx-auto"> <div className="max-w-2xl mx-auto">
<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">Music</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"> <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">
<img <Image
src={track.image.find(img => img.size === 'large')?.['#text']} src={track.image.find(img => img.size === 'large')?.['#text'] || '/placeholder.png'}
alt={track.name} alt={track.name}
className="w-24 h-24 rounded-lg mr-4" width={96}
height={96}
className="rounded-lg mr-4"
/> />
<div> <div>
<p className="font-bold">{track.name}</p> <p className="font-bold">{track.name}</p>

4
next.config.ts
View File

@ -1,7 +1,9 @@
import type { NextConfig } from "next"; import type { NextConfig } from "next";
const nextConfig: NextConfig = { const nextConfig: NextConfig = {
/* config options here */ images: {
domains: ['lastfm.freetls.fastly.net'],
},
}; };
export default nextConfig; export default nextConfig;