Files
cpost-front/src/app/[locale]/(views)/profile/components/ISidebar.tsx
azizziy c01e852a59 init
2025-05-20 17:02:10 +05:00

38 lines
1.6 KiB
TypeScript

'use client';
import { Box, List, ListItemButton, ListItemText } from '@mui/material';
import { usePathname } from 'next/navigation';
import { IconCard, IconPage, IconProducts, IconSettings } from '@/components/common/Icons';
const menuItems = [
{ value: '', label: 'Mahsulotlar', icon: IconProducts },
{ value: '/user-data', label: "Ma'lumotlarim", icon: IconPage },
// { value: '/id-and-address', label: "ID / Adres", icon: IconCard },
{ value: '/settings', label: "Sozlamalar", icon: IconSettings },
];
export function ISidebar({ locale }: { locale: string }) {
const pathname = usePathname();
return (
// <Box width={{xs: 86, md: 240}} bgcolor='#fff' p={2}>
<Box display={{xs: 'flex', md: 'block'}} bgcolor='#fff' p={2}>
{/*<List disablePadding>*/}
<List disablePadding sx={{display: {xs: 'flex', md: 'inline-block'}, marginX: 'auto'}}>
{menuItems.map(item => (
<ListItemButton
key={item.value}
href={`/${locale}/profile/${item.value}`}
selected={pathname.split('profile').at(-1) === item.value}
sx={{ display: 'flex', alignItems: 'center', gap: '10px' }}
>
{!!item.icon && <item.icon color={pathname.split('profile').at(-1) === item.value ? '#758CA3' : '#777'} />}
<ListItemText primary={item.label} sx={{ fontWeight: 500, display: {xs: "none", md: "block" }}} />
</ListItemButton>
))}
</List>
</Box>
);
}