hackforla / hackforla/tdm-calculator
Design: When multiple shared snapshots are selected, gray out the trash can
- Dominant language
- JavaScript
- Stars
- 68
- Forks
- 47
- Avg merge
- 3d 9h
- Merged PRs (30d)
- 25
Description
[Quick link to bottom of page](https://github.com/hackforla/tdm-calculator/issues/3337#react-issue-comment-composer)
### Overview
We need to create new designs for new behavior and tooltip on the My Projects page > Action Menu > trash can when multiple projects are selected, if any of them are shared, so that users will use the kebab menu for deleting of shared snapshots.
#### Details
- Currently, users can delete multiple shared projects from the Action Menu using checkboxes.
- We are adding a modal that will require users to unshare snapshots before they are deleted https://github.com/hackforla/tdm-calculator/issues/3220
- Since there is no way to show them multiple modals (one for each project that is shared), we are removing the feature to allow multiple deletion of shared snapshots
Current Behavior
**Tooltip Draft**
```
One or more selected TDM Plans are shared. Delete shared TDM Plans individually.
```
Example of Trash Can Grayed Out and Tooltip Appearing
When one or more projects that the user has selected have been submitted, the trash can icon will be grayed out with this message
### Action Items
- [x] Assign yourself to this issue.
- [x] Move the issue from Prioritized Backlog to In Progress.
- [x] In Figma, move a blank page to the Design section.
- [x] Change the Figma page's title to have the format "#Issue Number | Title | Assignee Name".
- [x] Copy contents from the Figma Template page to this issue's Figma page.
- [x] Include a link to this issue's Figma page in the Figma section below.
- [x] Use the Figma page to design solutions for this issue.
- Once this issue is ready to be reviewed:
- [x] Add a comment tagging the team design lead that [explains the design](https://github.com/hackforla/tdm-calculator/wiki/Design:-Presentations).
- [x] Move it to the Visual Review column.
- [x] Add the "ready for Design lead-[team]" label specific to your team.
- [ ] Once you have received feedback from the team lead, implement feedback as necessary.
- [ ] Use [presentation structure](https://github.com/hackforla/tdm-calculator/wiki/Design:-Presentations) to review proposed designs with the design director. Implement feedback as necessary.
- [ ] Use [presentation structure](https://github.com/hackforla/tdm-calculator/wiki/Design:-Presentations) to review proposed designs with the product, development, and research teams. Implement feedback as necessary.
- [ ] Create a new slide (or edit one if it already exists) in staging and add images and appropriate text
- [ ] Receive design approval from stakeholders. Implement feedback as necessary.
- [ ] Add any annotations to the Figma design that would help the developer with implementation.
- [ ] Create a Ready for Dev section around the final designs on the Figma page.
- [ ] Update the [Figma Design System](https://www.figma.com/design/nD9QK56Mzq7xNSaSUoeGx0/TDM-Calculator?node-id=4041-12655&t=54f7L4Eubz7ppygs-1) with changes resulting from the issue's final design, if applicable.
- [ ] Update the [Style Guide Presentation](https://docs.google.com/presentation/d/1I4q35NL2WW2RpksIyawhHCd8qJnrjme1ZDNIBxu24hQ/), if applicable.
- [ ] Add a comment to the issue that references the final design and adds any annotations that would help the developer with implementation.
- [ ] Create a [development handoff issue](https://github.com/hackforla/tdm-calculator/issues/new?template=development-handoff-issue.md) that references the comment.
- [ ] Move the Figma page to the Development section of the Figma file.
- [ ] Add the development issue's number in parentheses at the beginning of the title of the Figma page.
- [ ] Include the development handoff issue number in the GitHub section below.
- [ ] Reassign any previous assignees to this issue.
- [ ] Close this issue.
### Resources
#### GitHub
-
#### Figma
- https://www.figma.com/design/nD9QK56Mzq7xNSaSUoeGx0/TDM-Calculator?node-id=18525-98&p=f&t=5HXFTbdcaxRu17MW-0
#### Dev Site
-
#### Staging and Release decks
- [Staging Deck](https://docs.google.com/presentation/d/1crZ3IxqA4hAu3qzD7ns93Ieuqjwh6wyEtuX_46cP-fg/)
- [Staging slide, 3337](https://docs.google.com/presentation/d/1crZ3IxqA4hAu3qzD7ns93Ieuqjwh6wyEtuX_46cP-fg/edit?slide=id.g3f2afe8206d_0_94#slide=id.g3f2afe8206d_0_94)
- Release Deck
- [2025-MM-DD Release deck, slide ISSUE NUMBER]
Contributor guide
Assessment
This issue has not been assessed yet.