diff --git a/app/components/ContextMenu.tsx b/app/components/ContextMenu.tsx index 68c5a8b..fe4ba94 100644 --- a/app/components/ContextMenu.tsx +++ b/app/components/ContextMenu.tsx @@ -1,5 +1,5 @@ import PressableOpacity from '@app/components/PressableOpacity' -import { AlbumListItem, Song } from '@app/models/music' +import { AlbumListItem, Artist, Song } from '@app/models/music' import colors from '@app/styles/colors' import font from '@app/styles/font' import { NavigationProp, useNavigation } from '@react-navigation/native' @@ -100,15 +100,12 @@ const ContextMenuIconTextOption = React.memo( const MenuHeader = React.memo<{ coverArt?: string + artistId?: string title: string subtitle?: string -}>(({ coverArt, title, subtitle }) => ( +}>(({ coverArt, artistId, title, subtitle }) => ( - {coverArt ? ( - - ) : ( - <> - )} + {title} @@ -223,6 +220,28 @@ export const SongContextPressable: React.FC = props = ) } +export type ArtistContextPressableProps = ContextMenuProps & { + artist: Artist +} + +export const ArtistContextPressable: React.FC = props => { + const { artist, children } = props + + return ( + } + menuOptions={ + <> + + + + }> + {children} + + ) +} + const styles = StyleSheet.create({ optionsContainer: { backgroundColor: 'rgba(45, 45, 45, 0.95)', diff --git a/app/components/ListItem.tsx b/app/components/ListItem.tsx index 874f6b1..8584a7b 100644 --- a/app/components/ListItem.tsx +++ b/app/components/ListItem.tsx @@ -1,4 +1,4 @@ -import { AlbumListItem, ListableItem, Song } from '@app/models/music' +import { AlbumListItem, Artist, ListableItem, Song } from '@app/models/music' import { useStore } from '@app/state/store' import { selectTrackPlayer } from '@app/state/trackplayer' import colors from '@app/styles/colors' @@ -10,7 +10,7 @@ import FastImage from 'react-native-fast-image' import IconFA from 'react-native-vector-icons/FontAwesome' import IconFA5 from 'react-native-vector-icons/FontAwesome5' import IconMat from 'react-native-vector-icons/MaterialIcons' -import { AlbumContextPressable, SongContextPressable } from './ContextMenu' +import { AlbumContextPressable, ArtistContextPressable, SongContextPressable } from './ContextMenu' import CoverArt from './CoverArt' import PressableOpacity from './PressableOpacity' @@ -106,12 +106,22 @@ const ListItem: React.FC<{ ), [item, onPress], ) + const artistPressable = useCallback( + ({ children }) => ( + + {children} + + ), + [item, onPress], + ) let PressableComponent = itemPressable if (item.itemType === 'album') { PressableComponent = albumPressable } else if (item.itemType === 'song') { PressableComponent = songPressable + } else if (item.itemType === 'artist') { + PressableComponent = artistPressable } return (