Create Collection Option in “Add to Collection” Modal

[Jatin24062005]

Increasing Access

Users can manage their saved sketches and organize them using Collections.
Each sketch provides actions such as:

• Download
• Rename
• Add to Collection

Current Behavior

When a user clicks “Add to collection” on a sketch:

• If no collections exist in their account
• The modal displays a message: No collections
• There is no action available to create a collection directly from this modal

This results in a dead-end UX where the user must:

1. Close the modal
2. Navigate elsewhere
3. Manually create a collection
4. Return to the sketch and retry the action

Problem

• The modal presents an empty state without any affordance
• Breaks user flow and increases friction
• Especially confusing for new users who don’t yet know where collections are created

Suggested Improvement

• Add a “Create Collection” button directly in the modal when no collections exist
• Provide inline guidance or a quick form to create a new collection without leaving the current flow
• Ensure the newly created collection is immediately selectable for the sketch

Benefits

• Smooth, intuitive user experience
• Eliminates unnecessary navigation steps
• Reduces confusion for first-time users
• Encourages adoption of Collections feature

Feature enhancement details

[rajanpanth]

i am interested in doing it.

[raclim]

Thanks for opening this @Jatin24062005, this makes sense to me!

Thanks for your interest in this issue @rajanpanth! Would you be able to share any ideas or thoughts on how you'd like to implement this?

[Anshika680]

I am interested to implement this

[SinhaS12]

@Jatin24062005 @raclim It looks like this issue has already been resolved. Thank you!

If no ,then Kindly assign this issue to me. I can resolve it using proper React and SCSS practices

[Jatin24062005]

@SinhaS12 rather directly going to the collection tab follow this steps as mentioned in issue first save any sketch and than click on its option than click "Add to collection" you can see the issue.

[saurabh24thakur]

Hi @raclim,

Since there hasn't been an update on the implementation details recently, I’d love to pick this up.

Proposed Solution:

Update Modal: Modify AddToCollectionModal to detect when the collection list is empty.

New UI: Replace the "No collections" text with a "Create New Collection" button.

Flow: Clicking the button reveals an input field. Upon saving, we dispatch the creation action and automatically select the new collection, keeping the user in the same context.

I'm ready to start working on this now. Let me know what you think!

[SinhaS12]

Hi @raclim ,

I’d like to work on this issue — I’ve identified the bug causing the problem.

If no collection exists, I plan to handle it by triggering a new collection flow and adding an input prompt, so the UI remains clean and user-friendly instead of feeling empty or broken.

Please let me know if this approach works for you.