Epic: Review file tree and update MUI Components #1617
Description
Overview
Currently, components throughout the VRMS app do not match - some use MUI styling while others do not, thus creating a fractured user experience. All components throughout the VRMS file tree below must be updated to Material-UI components.
What if we're unable to access the component listed?
Do your best to change the HTML elements out anyway and note in the PR that you're unable to get the component to render within VRMS for screenshots.
Should I try to match the CSS of the app beforehand?
No, there will be some changes to the look and feel of the app switching to MUI components, we plan on going back in a second set of issues to match the CSS to our current figma design or a new figma design as it comes available. That said if functionality suffers based on MUI changes, please try to match the styling to maintain functionality (e.g., if a button previously was outlined on VRMS, then please implement an outlined MUI button).
Action Items
Check off these items when we have fully moved from standard HTML components to MUI components (note that same may already be updated to MUI). Each can be broken into its own issue.
- Update HTML components to MUI: ./src/components/ProjectForm.js #1623
- Update HTML components to MUI: ./src/components/Navbar.js #1625
- Update HTML components to MUI: ./src/components/auth/Auth.js #1626
- Update HTML components to MUI: ./src/components/auth/HandleAuth.jsx #1640
- Update HTML components to MUI: ./src/components/user-admin/EditUsers.jsx #1641
- Update HTML components to MUI: ./src/components/user-admin/AddNewProject.js #1642
- Update HTML components to MUI: ./src/components/user-admin/UserManagement.js #1648
- Update HTML components to MUI: ./src/components/admin/donutChartContainer.js #1649
- Update HTML components to MUI: ./src/components/admin/donutChartLoading.js #1657
- Update HTML components to MUI: ./src/components/admin/dashboard/index.jsx #1671
- Update HTML components to MUI: ./src/components/admin/donutChart.js #1672 [ closed, unused component ]
- Update HTML components to MUI: ./src/components/admin/reports/index.js #1679 [ closed, unused component ]
- Update HTML components to MUI: ./src/components/dashboard/AddTeamMember.js #1680
- Update HTML components to MUI: ./src/components/dashboard/RosterTable.js #1681 [ closed, unused component ]
- Update HTML components to MUI: ./src/components/dashboard/RosterTableRow.js #1682 [ closed, unused component ]
- Update HTML components to MUI: ./src/components/presentational/CheckInButtons.js #1683
- Update HTML components to MUI: ./src/components/presentational/returnUserForm.js #1684
- Update HTML components to MUI: ./src/components/presentational/newUserForm.jsx #1693
- Update HTML components to MUI: ./src/components/presentational/profile/UserTable.js #1694
- Update HTML components to MUI: ./src/components/presentational/upcomingEvent.js #1698
- Update HTML components to MUI: ./src/components/manageProjects/eventForm.js #1699
- Update HTML components to MUI: ./src/components/manageProjects/editableField.js #1700
- Update HTML components to MUI: ./src/components/manageProjects/editableMeeting.js #1701
- Change Edit Meeting Times base component to an MUI modal #1724
- Update HTML components to MUI: ./src/components/manageProjects/editMeetingTimes.jsx #1665
- Update HTML components to MUI: ./src/components/manageProjects/editProject.jsx #1703
- Update HTML components to MUI: ./src/components/manageProjects/addProject.jsx #1704
- Update HTML components to MUI: ./src/components/parts/form/ValidatedTextField.js #1705
- Update HTML components to MUI: ./src/components/parts/boxes/TitledBox.js #1707
- Update HTML components to MUI: ./src/components/Form.js #1708
- Update HTML components to MUI: ./src/components/Leaderboard.test.js #1709 [ closed, unused component ]
- Update HTML components to MUI: ./src/components/Footer.js #1710
- Update HTML components to MUI: ./src/pages/Events.js #1711
- Update HTML components to MUI: ./src/pages/CheckInForm.js #1712
- Update HTML components to MUI: ./src/pages/ProjectLeaderDashboard.js #1713
- Update HTML components to MUI: ./src/pages/UserAdmin.js #1714
- Update HTML components to MUI: ./src/pages/UserProfile.js #1715
- Update HTML components to MUI: ./src/pages/ReturningUser.js #1716
- Update HTML components to MUI: ./src/pages/Home.js #1717
- Update HTML components to MUI: ./src/pages/ProjectList.js #1718
- Update HTML components to MUI: ./src/pages/ManageProjects.js #1719
- Update HTML components to MUI: ./src/pages/NewUser.js #1720
- Update HTML components to MUI: ./src/pages/SecretPassword.js #1721
- Update HTML components to MUI: ./src/App.jsx #1722