Merge pull request #779 from CareTogether/Family-screen-tabs

Family screen V2
CareTogether · Sep 4, 2024 · 46659f6 · 46659f6
2 parents 981f79f + 4dd418a
commit 46659f6
Showing 1 changed file with 12 additions and 4 deletions.
diff --git a/src/caretogether-pwa/src/Families/FamilyScreenV2.tsx b/src/caretogether-pwa/src/Families/FamilyScreenV2.tsx
@@ -6,6 +6,10 @@ import { ProgressBackdrop } from '../Shell/ProgressBackdrop';
 import { useFamilyLookup } from '../Model/DirectoryModel';
 import { familyLastName } from './FamilyUtils';
 import FamilyScreenPageVersionSwitch from './FamilyScreenPageVersionSwitch';
+import TaskAltOutlinedIcon from '@mui/icons-material/TaskAltOutlined';
+import HomeOutlinedIcon from '@mui/icons-material/HomeOutlined';
+import DescriptionOutlinedIcon from '@mui/icons-material/DescriptionOutlined';
+import NotesIcon from '@mui/icons-material/Notes';
 
 interface TabPanelProps {
   children?: React.ReactNode;
@@ -69,10 +73,14 @@ export function FamilyScreenV2() {
           onChange={(_, newTab) => setCurrentTab(newTab)}
           aria-label="Family Screen Tabs"
         >
-          <Tab label="Overview" {...a11yProps(0)} />
-          <Tab label="Notes" {...a11yProps(1)} />
-          <Tab label="Documents" {...a11yProps(2)} />
-          <Tab label="Tasks" {...a11yProps(3)} />
+          <Tab icon={<HomeOutlinedIcon />} label="Overview" {...a11yProps(0)} />
+          <Tab icon={<NotesIcon />} label="Notes" {...a11yProps(1)} />
+          <Tab
+            icon={<DescriptionOutlinedIcon />}
+            label="Documents"
+            {...a11yProps(2)}
+          />
+          <Tab icon={<TaskAltOutlinedIcon />} label="Tasks" {...a11yProps(3)} />
           <FamilyScreenPageVersionSwitch />
         </Tabs>
       </Box>