feat(frontend): layout without disabled tabs

This commit is contained in:
leandrofars 2026-02-20 11:12:18 -03:00
parent 347bbebb5a
commit 96a41aa5ea
5 changed files with 108 additions and 86 deletions

View File

@ -14,6 +14,8 @@ import UserIcon from '@heroicons/react/24/solid/UserIcon';
import BuildingOffice2Icon from '@heroicons/react/24/solid/BuildingOffice2Icon';
import BookOpenIcon from '@heroicons/react/24/solid/BookOpenIcon';
import CommandLineIcon from '@heroicons/react/24/solid/CommandLineIcon';
import DocumentMagnifyingGlassIcon from '@heroicons/react/24/solid/DocumentMagnifyingGlassIcon';
import MapIcon from '@heroicons/react/24/solid/MapIcon';
export const items = [
{
@ -34,44 +36,6 @@ export const items = [
</SvgIcon>
)
},
{
title: 'Mass Actions',
icon: (
<SvgIcon fontSize="small">
<RectangleGroupIcon color='gray'/>
</SvgIcon>
),
disabled: true,
children: [
{
title: 'Firmware Update',
icon: (
<SvgIcon fontSize="small">
<ArrowDownOnSquareStackIcon color='gray'/>
</SvgIcon>
),
disabled: true
},
{
title: 'Message',
disabled: true,
icon: (
<SvgIcon fontSize="small">
<EnvelopeIcon color='gray'/>
</SvgIcon>
)
},
]
},
{
title: 'Scripts',
disabled: true,
icon: (
<SvgIcon fontSize="small">
<CommandLineIcon color='gray'/>
</SvgIcon>
)
},
{
title: 'Credentials',
path: '/credentials',
@ -82,49 +46,11 @@ export const items = [
)
},
{
title: 'Access Control',
disabled: true,
title: 'Users',
path: '/access-control/users',
icon: (
<SvgIcon fontSize="small">
<UserGroupIcon color='gray'/>
</SvgIcon>
),
children: [
{
title: 'Tenants',
disabled: true,
icon: (
<SvgIcon fontSize="small">
<BuildingOffice2Icon color='gray'/>
</SvgIcon>
)
},
{
title: 'Roles',
disabled: true,
icon: (
<SvgIcon fontSize="small">
<ShieldCheckIcon color='gray'/>
</SvgIcon>
)
},
{
title: 'Users',
path: '/access-control/users',
icon: (
<SvgIcon fontSize="small">
<UserIcon/>
</SvgIcon>
)
},
]
},
{
title: 'File Server',
disabled: true,
icon: (
<SvgIcon fontSize="small">
<FolderIcon color='gray'/>
<UserIcon/>
</SvgIcon>
)
},
@ -146,7 +72,101 @@ export const items = [
</SvgIcon>
),
external: true,
},
}
// {
// title: 'Mass Actions',
// icon: (
// <SvgIcon fontSize="small">
// <RectangleGroupIcon color='gray'/>
// </SvgIcon>
// ),
// disabled: true,
// children: [
// {
// title: 'Firmware Update',
// icon: (
// <SvgIcon fontSize="small">
// <ArrowDownOnSquareStackIcon color='gray'/>
// </SvgIcon>
// ),
// disabled: true
// },
// {
// title: 'Message',
// disabled: true,
// icon: (
// <SvgIcon fontSize="small">
// <EnvelopeIcon color='gray'/>
// </SvgIcon>
// )
// },
// ]
// },
// {
// title: 'Scripts',
// disabled: true,
// icon: (
// <SvgIcon fontSize="small">
// <CommandLineIcon color='gray'/>
// </SvgIcon>
// )
// },
// {
// title: "Map",
// icon: (
// <SvgIcon fontSize="small">
// <MapIcon color={"gray"} />
// </SvgIcon>
// ),
// disabled: true,
// },
// {
// title: 'Access Control',
// disabled: true,
// icon: (
// <SvgIcon fontSize="small">
// <UserGroupIcon color='gray'/>
// </SvgIcon>
// ),
// children: [
// {
// title: 'Tenants',
// disabled: true,
// icon: (
// <SvgIcon fontSize="small">
// <BuildingOffice2Icon color='gray'/>
// </SvgIcon>
// )
// },
// {
// title: 'Roles',
// disabled: true,
// icon: (
// <SvgIcon fontSize="small">
// <ShieldCheckIcon color='gray'/>
// </SvgIcon>
// )
// },
// ]
// },
// {
// title: 'File Server',
// disabled: true,
// icon: (
// <SvgIcon fontSize="small">
// <FolderIcon color='gray'/>
// </SvgIcon>
// )
// },
// {
// title: "Audit Trail",
// disabled: true,
// icon: (
// <SvgIcon fontSize="small">
// <DocumentMagnifyingGlassIcon color='gray'/>
// </SvgIcon>
// ),
// }
];
/*

View File

@ -60,6 +60,8 @@ export const SideNavItem = (props) => {
...(active && {
backgroundColor: 'rgba(255, 255, 255, 0.04)'
}),
width: "100%",
minHeight: "48px",
'&:hover': {
backgroundColor: 'rgba(255, 255, 255, 0.04)'
}

View File

@ -28,7 +28,7 @@ import { AccountPopover } from './account-popover';
import { useAuth } from 'src/hooks/use-auth';
import { WsContext } from 'src/contexts/socketio-context';
import { useContext, useEffect } from 'react';
import CurrencyDollarIcon from '@heroicons/react/24/outline/CurrencyDollarIcon';
import TrophyIcon from '@heroicons/react/24/outline/TrophyIcon';
const SIDE_NAV_WIDTH = 280;
const TOP_NAV_HEIGHT = 64;
@ -104,7 +104,7 @@ export const TopNav = (props) => {
<Tooltip title="Upgrade to Pro">
<IconButton>
<SvgIcon fontSize="small">
<CurrencyDollarIcon/>
<TrophyIcon/>
</SvgIcon>
</IconButton>
</Tooltip>

View File

@ -75,7 +75,7 @@ const Page = () => {
justifyContent:'center',
}}>
<Tabs value={router.query.id[1]} aria-label="icon label tabs example" variant='scrollable'>
<Tooltip placement="bottom">
{/*<Tooltip placement="bottom">
<Tab
icon={<SvgIcon><WifiIcon/></SvgIcon>}
iconPosition={"end"}
@ -138,7 +138,7 @@ const Page = () => {
iconPosition={"end"}
label="Location"
style={{opacity:"0.5", cursor:"default"}}
value={"location"} /></Tooltip>
value={"location"} /></Tooltip> */}
<Tab
value={"msg"}
onClick={()=>{router.push(`/devices/cwmp/${deviceID}/msg`)}}

View File

@ -77,7 +77,7 @@ const Page = () => {
justifyContent:'center'
}}>
<Tabs value={router.query.id[1]} aria-label="icon label tabs example" variant='scrollable'>
<Tooltip placement="bottom">
{/*<Tooltip placement="bottom">
<Tab
icon={<SvgIcon><WifiIcon/></SvgIcon>}
iconPosition={"end"}
@ -144,7 +144,7 @@ const Page = () => {
iconPosition={"end"}
label="Actions"
style={{cursor:"default", opacity: 0.5}}
value={"actions"} /></Tooltip>
value={"actions"} /></Tooltip> */}
<Tab
value={"discovery"}
onClick={()=>{router.push(`/devices/usp/${deviceID}/discovery`)}}