From 6ccf3226b81fcce6475dbb8825528e4cb0d16f4c Mon Sep 17 00:00:00 2001
From: Sebastian Klingler <sliptype@gmail.com>
Date: Wed, 6 Dec 2023 15:26:05 -0600
Subject: [PATCH] [C-3332] Fix playlist edit after create (#6873)

---
 .../components/create-playlist/PlaylistForm.tsx | 17 +++++++++++------
 .../web/src/pages/upload-page/validation.ts     | 13 +++++++++----
 2 files changed, 20 insertions(+), 10 deletions(-)

diff --git a/packages/web/src/components/create-playlist/PlaylistForm.tsx b/packages/web/src/components/create-playlist/PlaylistForm.tsx
index e84456d9135..69ec1a42d96 100644
--- a/packages/web/src/components/create-playlist/PlaylistForm.tsx
+++ b/packages/web/src/components/create-playlist/PlaylistForm.tsx
@@ -1,4 +1,9 @@
-import { Collection, CollectionMetadata, SquareSizes } from '@audius/common'
+import {
+  Collection,
+  CollectionMetadata,
+  Nullable,
+  SquareSizes
+} from '@audius/common'
 import { Flex } from '@audius/harmony'
 import { Form, Formik } from 'formik'
 import { toFormikValidationSchema } from 'zod-formik-adapter'
@@ -25,13 +30,13 @@ const messages = {
   createPlaylistButtonText: 'Create Playlist'
 }
 
-export type EditPlaylistValuess = Collection & {
-  artwork: {
+export type EditPlaylistValues = Omit<Collection, 'artwork'> & {
+  artwork: Nullable<{
     file?: Blob
     url?: string
     source?: 'unsplash' | 'original' | 'generated'
     error?: string
-  }
+  }>
 }
 
 type PlaylistFormProps = {
@@ -65,10 +70,10 @@ const PlaylistForm = ({
   )
 
   return (
-    <Formik<EditPlaylistValuess>
+    <Formik<EditPlaylistValues>
       initialValues={{
         ...metadata,
-        artwork: { url: coverArtUrl },
+        artwork: coverArtUrl ? { url: coverArtUrl } : null,
         description: metadata.description ?? ''
       }}
       onSubmit={onSave}
diff --git a/packages/web/src/pages/upload-page/validation.ts b/packages/web/src/pages/upload-page/validation.ts
index e576b4073c6..1748e77e365 100644
--- a/packages/web/src/pages/upload-page/validation.ts
+++ b/packages/web/src/pages/upload-page/validation.ts
@@ -1,3 +1,4 @@
+import { imageBlank } from '@audius/common'
 import {
   Genre,
   HashId,
@@ -125,10 +126,14 @@ const createCollectionSchema = (collectionType: 'playlist' | 'album') =>
         url: z.string()
       })
       .nullable()
-
-      .refine((artwork) => artwork !== null, {
-        message: messages.artworkRequiredError
-      }),
+      .refine(
+        (artwork) => {
+          return artwork !== null && artwork.url !== imageBlank
+        },
+        {
+          message: messages.artworkRequiredError
+        }
+      ),
     playlist_name: z.string({
       required_error: messages[collectionType].nameRequiredError
     }),