nandi.uk
This repository has no description
1.8 kB
55 lines
1import { AppShellFooter, Avatar, Group, Indicator } from '@mantine/core';
2import { FaRegNoteSticky } from 'react-icons/fa6';
3import { LuLibrary } from 'react-icons/lu';
4import { MdOutlineEmojiNature } from 'react-icons/md';
5import { BiSearch } from 'react-icons/bi';
6import BottomBarItem from '../bottomBarItem/BottomBarItem';
7import useMyProfile from '@/features/profile/lib/queries/useMyProfile';
8import { RiNotification2Line } from 'react-icons/ri';
9import useUnreadNotificationCount from '@/features/notifications/lib/queries/useUnreadNotificationCount';
10
11export default function BottomBar() {
12 const { data: profile } = useMyProfile();
13 const { data: notificationData } = useUnreadNotificationCount();
14
15 return (
16 <AppShellFooter px={'sm'} pb={'lg'} py={'xs'} hiddenFrom="sm">
17 <Group align="start" justify="space-around" gap={'lg'} h={'100%'}>
18 <BottomBarItem href="/home" title="Home" icon={LuLibrary} />
19 <BottomBarItem
20 href="/explore"
21 title="Explore"
22 icon={MdOutlineEmojiNature}
23 />
24
25 <BottomBarItem href="/search" title="Search" icon={BiSearch} />
26
27 <BottomBarItem
28 href="/notifications"
29 title="Notifications"
30 icon={
31 <Indicator
32 disabled={notificationData.unreadCount === 0}
33 position={'top-start'}
34 size={8}
35 offset={0}
36 color="tangerine"
37 >
38 <RiNotification2Line size={22} />
39 </Indicator>
40 }
41 />
42
43 <BottomBarItem
44 href={`/profile/${profile.handle}`}
45 title={'Me'}
46 icon={
47 <Avatar
48 src={profile.avatarUrl?.replace('avatar', 'avatar_thumbnail')}
49 />
50 }
51 />
52 </Group>
53 </AppShellFooter>
54 );
55}