Bug: Disabled File Options Lack Guidance When Sketch is Unsaved

[yugalkaushik]

p5.js version

No response

What is your operating system?

Linux

Web browser and version

Chrome: 146.0.7680.80

Actual Behavior

When a sketch is not saved, “Duplicate” and “Add to Collection” are disabled in the File dropdown. However, there is no indication or explanation provided to the user about why these options are unavailable.

This leads to confusion, especially for new users, as the UI does not communicate that saving the sketch is a prerequisite for enabling these actions.

Expected Behavior

1. Disabled options should display a tooltip on hover
2. Tooltip should clearly state the reason, e.g., “Save the sketch before duplicating or adding to a collection”

Steps to reproduce

1. Open the p5.js Web Editor
2. Create a new sketch
3. Do not save the sketch
4. Open the File dropdown
5. Observe that options like “Duplicate” and “Add to Collection” are disabled

I wish to work on fixing on this issue.

[saurabh24thakur]

This is a great UX catch, @yugalkaushik Adding tooltips to disabled menu items would definitely help new users understand the 'Save' requirement.

I'd love to help out with the React implementation for this. I was thinking we could wrap those specific MenuItem components in a conditional tooltip that triggers when the sketch state is unsaved.

@raclim, if this hasn't been started yet, I'd be happy to take it on or assist @yugalkaushik with a PR...