From bfd457483a5cc965e1f32a703deae5eafb06e9ed Mon Sep 17 00:00:00 2001
From: thoulee <thou_lee@outlook.com>
Date: Sat, 14 Dec 2024 12:59:32 +0800
Subject: [PATCH] =?UTF-8?q?feat(AlbumDescription):=20=E5=B0=86=E6=8F=8F?=
 =?UTF-8?q?=E8=BF=B0=E5=B1=9E=E6=80=A7=E6=9B=B4=E6=94=B9=E4=B8=BA=E6=8E=A5?=
 =?UTF-8?q?=E6=94=B6=E5=AE=8C=E6=95=B4=E4=B8=93=E8=BE=91=E5=AF=B9=E8=B1=A1?=
 =?UTF-8?q?=EF=BC=8C=E5=B9=B6=E5=9C=A8=E5=AF=B9=E8=AF=9D=E6=A1=86=E4=B8=AD?=
 =?UTF-8?q?=E6=98=BE=E7=A4=BA=E4=B8=93=E8=BE=91=E5=90=8D=E7=A7=B0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/AlbumDescription.tsx |  7 ++-
 src/pages/album.tsx                 | 73 +++++++++++++++--------------
 2 files changed, 44 insertions(+), 36 deletions(-)

diff --git a/src/components/AlbumDescription.tsx b/src/components/AlbumDescription.tsx
index dabf4dc3..802a7c53 100644
--- a/src/components/AlbumDescription.tsx
+++ b/src/components/AlbumDescription.tsx
@@ -1,9 +1,10 @@
 import React, { useCallback, useState } from 'react';
 import { ScrollView, StyleSheet, TouchableOpacity } from 'react-native';
 import { Button, Dialog, Portal, Text, useTheme } from 'react-native-paper';
+import type { MainAlbum } from '../types/albumDetail';
 
 export const AlbumDescription = (
-  { description }: { description?: string }
+  { album }: { album: MainAlbum }
 ) => {
   const appTheme = useTheme();
   const [
@@ -11,6 +12,8 @@ export const AlbumDescription = (
     setDialogVisible,
   ] = useState(false);
 
+  const { description } = album;
+
   const showDialog = useCallback(() => {
     if (description) {
       setDialogVisible(true);
@@ -40,7 +43,7 @@ export const AlbumDescription = (
           onDismiss={hideDialog}
           style={styles.dialog}
         >
-          <Dialog.Title>Album Description</Dialog.Title>
+          <Dialog.Title>{album.name}</Dialog.Title>
           <ScrollView
             contentContainerStyle={styles.biggerPadding}
           >
diff --git a/src/pages/album.tsx b/src/pages/album.tsx
index 76a056fe..2970d956 100644
--- a/src/pages/album.tsx
+++ b/src/pages/album.tsx
@@ -17,44 +17,49 @@ import { Main } from '../types/albumDetail';
 import { songToTrack } from '../utils/songToTrack';
 
 export function AlbumDetail() {
-    const insets = useSafeAreaInsets();
-    const dispatch = useAppDispatch();
-    const { album } = (useRoute().params as { album: HotAlbum });
+  const insets = useSafeAreaInsets();
+  const dispatch = useAppDispatch();
+  const { album } = (useRoute().params as { album: HotAlbum });
 
-    const { data, error } = useSWRInfinite<Main>((index) =>
-        `http://music.163.com/api/album/${album.id}?ext=true&offset=${index * 10}&total=true&limit=10`,
-    );
+  const { data, error } = useSWRInfinite<Main>((index) =>
+    `http://music.163.com/api/album/${album.id}?ext=true&offset=${index * 10}&total=true&limit=10`,
+  );
 
-    const playAll = async () => {
-        const tracksData = data?.flatMap(d => d.album.songs)
-            .map(songToTrack) as TrackType[];
-        await dispatch(setQueueAsync(tracksData));
-        await TrackPlayer.play();
-    };
+  const playAll = async () => {
+    const tracksData = data?.flatMap(d => d.album.songs)
+      .map(songToTrack) as TrackType[];
+    await dispatch(setQueueAsync(tracksData));
+    await TrackPlayer.play();
+  };
 
-    return (
-        <BlurBackground style={[
-            styles.container,
-            { paddingTop: insets.top }]
-        }>
-            <AlbumHeaderCard album={album} />
-            <AlbumDescription
-                description={data && data[0].album.description}
-            />
-            {!error ? <TracksHeader
-                onPress={playAll}
-                length={data?.flatMap(
-                    (d) => d.album.songs
-                ).length || 0}
-            /> : null}
-            <AlbumContent album={album} />
-        </BlurBackground>
-    );
+  return (
+    <BlurBackground style={[
+      styles.container,
+      { paddingTop: insets.top }]
+    }>
+      <AlbumHeaderCard album={album} />
+      {data && data[0].album && (
+        <AlbumDescription
+          album={data[0].album}
+        />
+      )}
+
+      {!error && (
+        <TracksHeader
+          onPress={playAll}
+          length={data?.flatMap(
+            (d) => d.album.songs
+          ).length || 0}
+        />
+      )}
+      <AlbumContent album={album} />
+    </BlurBackground>
+  );
 }
 
 const styles = StyleSheet.create({
-    container: {
-        flex: 1,
-        alignContent: 'center',
-    },
+  container: {
+    flex: 1,
+    alignContent: 'center',
+  },
 });