echo-web/frontend/src/components/MemberList.tsx
2022-08-08 20:03:35 +01:00

19 lines
550 B
TypeScript

import { Aside, MediaQuery, Navbar, NavLink } from "@mantine/core"
import { useSelector } from "react-redux"
import { RootState } from "../store"
function MemberList() {
const users = useSelector((state: RootState) => state.chat.users);
return (
<MediaQuery smallerThan="sm" styles={{ display: 'none' }}>
<Aside p="sm" hiddenBreakpoint="sm" width={{ sm: 200, lg: 300 }}>
{users.map((user) => (
<NavLink key={`user${user}`} label={user}/>
))}
</Aside>
</MediaQuery>
)
}
export default MemberList