diff --git a/packages/web/src/components/edit-playlist/mobile/EditPlaylistPage.tsx b/packages/web/src/components/edit-playlist/mobile/EditPlaylistPage.tsx
index 48f4ae3b636..22a69e5af4f 100644
--- a/packages/web/src/components/edit-playlist/mobile/EditPlaylistPage.tsx
+++ b/packages/web/src/components/edit-playlist/mobile/EditPlaylistPage.tsx
@@ -78,6 +78,7 @@ const EditPlaylistPage = g(
// Close the page if the route was changed
useHasChangedRoute(onClose)
+
const initialMetadata = {
...(metadata as Collection),
artwork: { url: '' }
@@ -88,7 +89,7 @@ const EditPlaylistPage = g(
)
const [showRemoveTrackDrawer, setShowRemoveTrackDrawer] = useState(false)
- const onDrawerClose = () => setShowRemoveTrackDrawer(false)
+ const onDrawerClose = useCallback(() => setShowRemoveTrackDrawer(false), [])
// Holds all tracks to be removed on save
const [removedTracks, setRemovedTracks] = useState<
@@ -228,16 +229,7 @@ const EditPlaylistPage = g(
}
refreshLineup()
- const editPlaylistData: any = {
- playlist_name: formFields.playlist_name,
- description: formFields.description,
- artwork: formFields.artwork,
- tracks: formFields.tracks as any,
- track_ids: formFields.playlist_contents.track_ids,
- removedTracks: []
- }
-
- editPlaylist(metadata.playlist_id, editPlaylistData)
+ editPlaylist(metadata.playlist_id, formFields)
track({
eventName: Name.COLLECTION_EDIT,
@@ -315,12 +307,16 @@ const EditPlaylistPage = g(
tracks.filter((trackIndex) => trackIndex !== removeIdx)
)
onDrawerClose()
- }, [metadata, confirmRemoveTrack, setRemovedTracks, setReorderedTracks])
+ }, [
+ confirmRemoveTrack,
+ metadata?.playlist_contents.track_ids,
+ onDrawerClose
+ ])
const setters = useCallback(
() => ({
left: (
-
+
),
center: messages.editPlaylist,
right: (
@@ -332,7 +328,7 @@ const EditPlaylistPage = g(
/>
)
}),
- [formFields.playlist_name, messages.editPlaylist, onSave]
+ [formFields.playlist_name, messages.editPlaylist, onClose, onSave]
)
useTemporaryNavContext(setters)
diff --git a/packages/web/src/pages/modals/Modals.tsx b/packages/web/src/pages/modals/Modals.tsx
index 66a3e222a31..5efa625bcc1 100644
--- a/packages/web/src/pages/modals/Modals.tsx
+++ b/packages/web/src/pages/modals/Modals.tsx
@@ -129,16 +129,20 @@ const Modals = () => {
return (
<>
- {commonModals.map(([modalName, Modal]) => {
- return
- })}
-
- {!isMobile && (
+ {isMobile ? (
+ <>
+
+
+ >
+ ) : (
<>
+ {commonModals.map(([modalName, Modal]) => {
+ return
+ })}
@@ -148,14 +152,6 @@ const Modals = () => {
>
)}
-
- {isMobile && (
- <>
-
-
- >
- )}
-
>
)