Artwork options section

[sync-by-unito[bot]]

This PR adds support for users updating the artwork on their Merchstore.

To test:

1. Open the deploy preview.
2. Open the products tab.
3. As a superuser or merchologist, you should be able to add or edit up to three artwork options on the store.
4. As an admin, you should be able to add or edit a single option.
5. If the store doesn't currently have artwork, adding a logo to the store and updating should set the logo as the initial artwork option.

┆Issue is synchronized with this Wrike Item by Unito

[sync-by-unito[bot]]

➤ Patrick Nelson commented:

jborek Very nice! Couple of things

• Editing an artwork when there were already three options gave me three toast success messages. Can that just be one?
• Can you switch the cursor to a pointer when hovering over add / edit buttons?
• In the case where the store did not have any artwork and I added a store logo, then added an artwork option before saving, the artwork option was overwritten by the store logo after clicking Update.
• Is there no way to delete artwork options? Seems like there should be

I was unable to test Admin because of the permissions.

[sync-by-unito[bot]]

➤ jborek commented:

patrickrnelson

• 1. I wasn't able to reproduce. I only ever got one toast message. Could you try and take a recording of that error if you get it again?
  2. Fixed
  3. Fixed
  4. There is no design for deleting the artwork. I believe the goal there is that there should always be artwork of some kind present, we don't want to allow users to empty that field. If the decision is made later that we want that ability, we can add it.
  5. That's expected. Because we're using Cloudinary, that random character string has to be appended to the end of the filename, otherwise with multiple users uploading files, there's a possibility that two users could upload "Hydro_flask_logo.png".

To test admin status, you could pull the file down locally and change line 22 of MerchstoreArtworkOptions/component.tsx to const isStoreAdmin = true

[sync-by-unito[bot]]

➤ Patrick Nelson commented:

jborek Regarding number 1, I was also unable to reproduce lol. Must have been a weird scenario.

Regarding number 5, I was more so talking about the actual image being really blurry and unreadable. Is there a way to make it not smooshed?

One more thing I forgot to mention in the last round, the Artwork Options tooltip says "Contact a Merchologist for additional artwork options" even when I am logged in as a superuser.

Thanks for the Admin info! As an Admin, I was able to edit images for merchstores that already had more than one image uploaded. But I couldn't add more than one image to merchstores that didn't have images. See screenshots. I am an ADMIN in both. Also notice that the edit button goes outside of the box

Screen Shot 2021-09-16 at 11 15 32 AM ( https://user-images.githubusercontent.com/73553839/133648616-712f650c-db11-4895-891e-81d09fd83930.png )

Screen Shot 2021-09-16 at 11 19 03 AM ( https://user-images.githubusercontent.com/73553839/133648629-424c0f4a-c24b-4b33-9077-1ad927fe0528.png )

[sync-by-unito[bot]]

➤ jborek commented:

patrickrnelson

• fixed the smooshed images and the admin specific issues. One note, the tooltip display logic actually lives in the parent component, so to test that tooltip as an admin, you'll need to do the isStoreAdmin = true* change on line 28 of the MerchStoreProductList component as well.

[sync-by-unito[bot]]

➤ Patrick Nelson commented:

jborek I found one more thing, sorry I forgot to look at mobile my first time around.

Screen Shot 2021-09-16 at 12 59 15 PM ( https://user-images.githubusercontent.com/73553839/133662086-7f14f83a-cde8-4fe0-9e94-73e9d5855602.png )

Just need some right and left padding / margin to match the designs. After that this is good to go!