UBC/Alley-HSBC-Frontend
Archived
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

now search uses includes and num contacts updated properly

Browse Source
This commit is contained in:
Taehee Choi 2022-03-24 22:04:00 -07:00
parent e18562c0c9
commit cdac8e9ef4
1 changed files with 19 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

35
src/components/contacts/contacts-components/Sidebar.tsx
View File

@ -27,8 +27,15 @@ const Sidebar: React.FC = () => {
const favorites = useAppSelector((state) =>
selectUsers(state, favoritesUuids)
);
let filteredFavorites = favorites.filter((favorite) =>
favorite.name.toLowerCase().includes(inputText.toLowerCase())
);
const teamUuids = useAppSelector(selectTeam);
const team = useAppSelector((state) => selectUsers(state, teamUuids));
let filteredTeam = team.filter((member) =>
member.name.toLowerCase().includes(inputText.toLowerCase())
);
return (
<Drawer
@ -56,41 +63,35 @@ const Sidebar: React.FC = () => {
/>
</ListItem>
<Divider />
<ListItemButton onClick={() => setFavoritesOpen(!favoritesOpen)}>
{favoritesOpen ? <ExpandLess /> : <ExpandMore />}
<ListItemText primary="Favorites" sx={{ textAlign: "center" }} />
<ListItemText
primary={favorites.length}
primary={filteredFavorites.length}
sx={{ textAlign: "right" }}
/>
</ListItemButton>
<Collapse in={favoritesOpen} timeout="auto" unmountOnExit>
<List disablePadding>
{
favorites.filter(favorite => (
favorite.name.toLowerCase().slice(0, inputText.length) == inputText.toLowerCase().slice(0, inputText.length)
)).map((favorite, i) => (
<ContactItem contactInfo={favorite} key={i} />
))
}
{filteredFavorites.map((favorite, i) => (
<ContactItem contactInfo={favorite} key={i} />
))}
</List>
</Collapse>
<ListItemButton onClick={() => setTeamOpen(!teamOpen)}>
{teamOpen ? <ExpandLess /> : <ExpandMore />}
<ListItemText primary="Team" sx={{ textAlign: "center" }} />
<ListItemText primary={team.length} sx={{ textAlign: "right" }} />
<ListItemText
primary={filteredTeam.length}
sx={{ textAlign: "right" }}
/>
</ListItemButton>
<Collapse in={teamOpen} timeout="auto" unmountOnExit>
<List disablePadding>
{
team.filter(member => (
member.name.toLowerCase().slice(0, inputText.length) == inputText.toLowerCase().slice(0, inputText.length)
)).map((member, i) => (
<ContactItem contactInfo={member} key={i} />
))
}
{filteredTeam.map((member, i) => (
<ContactItem contactInfo={member} key={i} />
))}
</List>
</Collapse>
</List>