Design: options for revising way we show sharing/updating sharing for owned snapshots

[Quick link to bottom of page](https://github.com/hackforla/tdm-calculator/issues/3206#react-issue-comment-composer)

### Overview
We need to mock up a design for showing which items are shared with you, which ones you have shared and be able to change sharing for any projects you own directly from the table in order to make it easier for users to manage and understand this feature

#### Details
Mockup the Following

Add a new column
- Add a new column called `Shared` between Status and ID
- when the snapshot is shared, show icon for people [Material UI - PeopleAltOutlined](https://mui.com/material-ui/material-icons/?query=peo&theme=Outlined&selected=PeopleAltOutlined)
- If the snapshot is owned by the user it should also be underlined so that they can click to bring up the Shared Snapshot modal to change it (add or remove people)
- If the snapshot is not shared:
- and its owned by the user, show a + sign in the column (see DRO column for example)
- if its not owned by the user, do not show anything
- remove the share icon from the Status column

In your mockups we should see
- a My Projects page, admin login
- listing 6 projects
- 4 of the projects are Snapshots
- 1 is shared, and owned by the user (shows share icon in new column, and icon is underlined)
- 1 is shared, and owned by another user (shows share icon in new column)
- 1 is not shared, and owned by the user (shows + icon in new column)
- 1 is not shared, and owned by another user (no icons in new column)
- 2 are drafts
- 1 owned by the user (no icons in new column)
- 1 owned by another user (no icons in new column)
- a My Projects page, user login
- listing 5 projects
- 4 of the projects are Snapshots
- 1 is shared, and owned by the user (shows share icon in new column, and icon is underlined)
- 1 is shared, and owned by another user (shows share icon in new column)
- 1 is not shared, and owned by the user (shows + icon in new column)
- ~1 is not shared, and owned by another user (no icons in new column)~
- 2 are drafts
- 1 owned by the user (no icons in new column)
- ~1 owned by another user (no icons in new column)~

Ownership is visible in the "Created By" column

### 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 product" label
- [ ] Once you have received feedback from the product leads, implement feedback as necessary.
- [x] Create a new slide (or edit one if it already exists) in staging and add images and appropriate text
- [x] 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/Instructions
- #2725 was the implementation of the shared snapshot icon which is not 100% intuitive

#### GitHub
Notes for developer

```
From: https://react-icons.github.io/react-icons/icons/md/
import { MdOutlinePeopleAlt } from "react-icons/md";

md
MdOutlinePeopleAlt
md/MdOutlinePeopleAlt
import { MdOutlinePeopleAlt } from "react-icons/md";

```

#### Figma
- [Link to Figma file](https://www.figma.com/design/nD9QK56Mzq7xNSaSUoeGx0/TDM-Calculator?node-id=32701-15695&t=YlXJWVWZn3xd0ljv-1)

#### Dev Site
-

#### Staging and Release decks
- [Staging Deck](https://docs.google.com/presentation/d/1crZ3IxqA4hAu3qzD7ns93Ieuqjwh6wyEtuX_46cP-fg/)
- [Staging slide, 3206, slide 1](https://docs.google.com/presentation/d/1crZ3IxqA4hAu3qzD7ns93Ieuqjwh6wyEtuX_46cP-fg/edit?slide=id.g3e9280fa56e_32_28#slide=id.g3e9280fa56e_32_28)
- [Staging slide, 3206, slide 2](https://docs.google.com/presentation/d/1crZ3IxqA4hAu3qzD7ns93Ieuqjwh6wyEtuX_46cP-fg/edit?slide=id.g3ee815b0a47_1_26#slide=id.g3ee815b0a47_1_26)
- [Staging slide, 3206, slide 3](https://docs.google.com/presentation/d/1crZ3IxqA4hAu3qzD7ns93Ieuqjwh6wyEtuX_46cP-fg/edit?slide=id.g3ee815b0a47_1_21#slide=id.g3ee815b0a47_1_21)
- [Staging slide, 3206, slide 4](https://docs.google.com/presentation/d/1crZ3IxqA4hAu3qzD7ns93Ieuqjwh6wyEtuX_46cP-fg/edit?slide=id.g3ee815b0a47_1_11#slide=id.g3ee815b0a47_1_11)
- [Staging slide, 3206, slide 5](https://docs.google.com/presentation/d/1crZ3IxqA4hAu3qzD7ns93Ieuqjwh6wyEtuX_46cP-fg/edit?slide=id.g3ee815b0a47_1_16#slide=id.g3ee815b0a47_1_16)
- Release Deck
- [2026-06-23 Release deck, Issue 3206, slide 1](https://docs.google.com/presentation/d/1BGVUI9HW2df9yMw9mQ0sHziNZyC-kKJb1tbwK1PaZks/edit?slide=id.g3f23e04d2de_52_632#slide=id.g3f23e04d2de_52_632)
- [2026-06-23 Release deck, Issue 3206, slide 2](https://docs.google.com/presentation/d/1BGVUI9HW2df9yMw9mQ0sHziNZyC-kKJb1tbwK1PaZks/edit?slide=id.g3f23e04d2de_52_639#slide=id.g3f23e04d2de_52_639)
- [2026-06-23 Release deck, Issue 3206, slide 3](https://docs.google.com/presentation/d/1BGVUI9HW2df9yMw9mQ0sHziNZyC-kKJb1tbwK1PaZks/edit?slide=id.g3f23e04d2de_52_646#slide=id.g3f23e04d2de_52_646)
- [2026-06-23 Release deck, Issue 3206, slide 4](https://docs.google.com/presentation/d/1BGVUI9HW2df9yMw9mQ0sHziNZyC-kKJb1tbwK1PaZks/edit?slide=id.g3f23e04d2de_52_656#slide=id.g3f23e04d2de_52_656)
- [2026-06-23 Release deck, Issue 3206, slide 5](https://docs.google.com/presentation/d/1BGVUI9HW2df9yMw9mQ0sHziNZyC-kKJb1tbwK1PaZks/edit?slide=id.g3f23e04d2de_52_666#slide=id.g3f23e04d2de_52_666)
- [2026-08-18 Release deck, Issue 3206](https://docs.google.com/presentation/d/16-zgcjRJ6zjrAeTPZatTKdOAhuyhhqiN6bPsCsp0Huc/edit?slide=id.g3f256f05101_0_142#slide=id.g3f256f05101_0_142)
- [2026-09-01 Release deck, Issue 3206](https://docs.google.com/presentation/d/1uQpewpS226aQFV7ekeZkRzRAcXgvrjvMAE5iRQJt9Zw/edit?slide=id.g3f772bdb096_0_6#slide=id.g3f772bdb096_0_6)