girineko/YesPlayMusic
1
0
Fork 0
mirror of https://github.com/GiriNeko/YesPlayMusic.git synced 2025-12-16 13:17:46 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

feat: updates

Browse source
This commit is contained in:
qier222 2022-07-12 22:42:50 +08:00
parent 222fb02355
commit 47e41dea9b
No known key found for this signature in database
GPG key ID: 9C85007ED905F14D
24 changed files with 380 additions and 130 deletions
Download patch file Download diff file Expand all files Collapse all files

13
packages/web/pages/New/Artist/Header/ArtistInfo.tsx
View file

@ -1,13 +1,20 @@
import useIsMobile from '@/web/hooks/useIsMobile'
import useAppleMusicArtist from '@/web/hooks/useAppleMusicArtist'
const ArtistInfo = ({ artist }: { artist?: Artist }) => {
const isMobile = useIsMobile()
const { data: artistFromApple, isLoading: isLoadingArtistFromApple } =
useAppleMusicArtist({
id: artist?.id,
name: artist?.name,
})
return (
<div>
<div className='text-28 font-semibold text-night-50 lg:text-32'>
{artist?.name}
</div>
<div className='text-white-400 mt-2.5 text-24 font-medium lg:mt-6'>
<div className='mt-2.5 text-24 font-medium text-night-400 lg:mt-6'>
Artist
</div>
<div className='mt-1 text-12 font-medium text-night-400'>
@ -16,9 +23,9 @@ const ArtistInfo = ({ artist }: { artist?: Artist }) => {
</div>
{/* Description */}
{!isMobile && (
{!isMobile && !isLoadingArtistFromApple && (
<div className='line-clamp-5 mt-6 text-14 font-bold text-night-400'>
{artist?.briefDesc}
{artistFromApple?.attributes?.artistBio || artist?.briefDesc}
</div>
)}
</div>

24
packages/web/pages/New/Artist/Header/Header.tsx
View file

@ -6,8 +6,15 @@ import BlurBackground from '@/web/components/New/BlurBackground'
import ArtistInfo from './ArtistInfo'
import Actions from './Actions'
import LatestRelease from './LatestRelease'
import useAppleMusicArtist from '@/web/hooks/useAppleMusicArtist'
const Header = ({ artist }: { artist?: Artist }) => {
const { data: artistFromApple, isLoading: isLoadingArtistFromApple } =
useAppleMusicArtist({
id: artist?.id,
name: artist?.name,
})
return (
<div
className={cx(
@ -27,10 +34,23 @@ const Header = ({ artist }: { artist?: Artist }) => {
grid-area: cover;
`
)}
src={resizeImage(artist?.img1v1Url || '', 'lg')}
src={resizeImage(
isLoadingArtistFromApple
? ''
: artistFromApple?.attributes?.artwork?.url ||
artist?.img1v1Url ||
'',
'lg'
)}
/>
<BlurBackground cover={artist?.img1v1Url} />
<BlurBackground
cover={
isLoadingArtistFromApple
? ''
: artistFromApple?.attributes?.artwork?.url || artist?.img1v1Url
}
/>
<div
className={cx(