diff --git a/web/apps/app/components/layouts/AppLayout.tsx b/web/apps/app/components/layouts/AppLayout.tsx index cb45cad004..ef7158645e 100644 --- a/web/apps/app/components/layouts/AppLayout.tsx +++ b/web/apps/app/components/layouts/AppLayout.tsx @@ -7,7 +7,7 @@ import { IconButton } from '@signalco/ui-primitives/IconButton'; import { cx } from '@signalco/ui-primitives/cx'; import { Minimize } from '@signalco/ui-icons'; import { useSearchParam } from '@signalco/hooks/useSearchParam'; -import { PageTitle } from '../navigation/PageTitle'; +import { PageTitle } from '../navigation/titles/PageTitle'; import NavProfile from '../navigation/NavProfile'; import { AuthWrapper } from './AuthWrapper'; import { AppClientWrapper } from './AppClientWrapper'; diff --git a/web/apps/app/components/navigation/MobileMenu.tsx b/web/apps/app/components/navigation/MobileMenu.tsx index 2d4b042033..2ea4d56973 100644 --- a/web/apps/app/components/navigation/MobileMenu.tsx +++ b/web/apps/app/components/navigation/MobileMenu.tsx @@ -18,25 +18,21 @@ export function MobileMenu({ open, items, active, onClose }: { open: boolean; it open && 'animate-in slide-in-from-top-3' )}> - {items.map((ni, index) => { - const ItemIcon = ni.icon; - - return ( - - - - - - ); - })} + {items.map((ni, index) => ( + + + + + + ))} ); diff --git a/web/apps/app/components/navigation/NavProfile.tsx b/web/apps/app/components/navigation/NavProfile.tsx index 56ff02e61c..95325eee1f 100644 --- a/web/apps/app/components/navigation/NavProfile.tsx +++ b/web/apps/app/components/navigation/NavProfile.tsx @@ -8,7 +8,7 @@ import { UserProfileAvatar } from '../users/UserProfileAvatar'; import { KnownPages } from '../../src/knownPages'; import useLocale from '../../src/hooks/useLocale'; import { useActiveNavItem } from './useActiveNavItem'; -import { PageTitle } from './PageTitle'; +import { PageTitle } from './titles/PageTitle'; import NavLink from './NavLink'; import { MobileMenu } from './MobileMenu'; import { FloatingNavContainer } from './FloatingNavContainer'; @@ -17,39 +17,46 @@ export type NavItem = { label: string, path: string, icon: React.FunctionComponent, - hidden?: boolean | undefined; + end?: boolean | undefined; } export const navItems: NavItem[] = [ - { label: 'Channels', path: KnownPages.Channels, icon: Channel, hidden: true }, - { label: 'Settings', path: KnownPages.Settings, icon: Settings, hidden: true }, { label: 'Spaces', path: KnownPages.Spaces, icon: Dashboard }, - { label: 'Entities', path: KnownPages.Entities, icon: Device } + { label: 'Entities', path: KnownPages.Entities, icon: Device }, + { label: 'Channels', path: KnownPages.Channels, icon: Channel, end: true }, + { label: 'Settings', path: KnownPages.Settings, icon: Settings, end: true }, ]; export default function NavProfile() { const [mobileMenuOpen, setMobileMenuOpen] = useState(false); const activeNavItem = useActiveNavItem(); - const visibleNavItems = navItems.filter(ni => ni === activeNavItem || !ni.hidden); const { t } = useLocale('App', 'Nav'); return ( -
+
-
- - {visibleNavItems - .map((ni, index) => ( - - ))} +
+ + {navItems.filter(ni => !ni.end).map((ni, index) => ( + + ))} +
+ {navItems.filter(ni => ni.end).map((ni, index) => ( + + ))}
@@ -60,6 +67,7 @@ export default function NavProfile() {
setMobileMenuOpen((curr) => !curr)} aria-label="Toggle menu"> {mobileMenuOpen ? : } @@ -68,7 +76,7 @@ export default function NavProfile() {
setMobileMenuOpen(false)} /> diff --git a/web/apps/app/components/navigation/EntitiesTitle.tsx b/web/apps/app/components/navigation/titles/EntitiesTitle.tsx similarity index 93% rename from web/apps/app/components/navigation/EntitiesTitle.tsx rename to web/apps/app/components/navigation/titles/EntitiesTitle.tsx index 05ccfa14b8..082551a5b1 100644 --- a/web/apps/app/components/navigation/EntitiesTitle.tsx +++ b/web/apps/app/components/navigation/titles/EntitiesTitle.tsx @@ -1,6 +1,6 @@ import { SelectItems } from '@signalco/ui-primitives/SelectItems'; import { useSearchParam } from '@signalco/hooks/useSearchParam'; -import { EntityIconByType } from '../shared/entity/EntityIcon'; +import { EntityIconByType } from '../../shared/entity/EntityIcon'; const entityTypes = [ { value: '1', label: 'Devices' }, diff --git a/web/apps/app/components/navigation/EntityTitle.tsx b/web/apps/app/components/navigation/titles/EntityTitle.tsx similarity index 71% rename from web/apps/app/components/navigation/EntityTitle.tsx rename to web/apps/app/components/navigation/titles/EntityTitle.tsx index d565289f8e..d6c8d7fbd4 100644 --- a/web/apps/app/components/navigation/EntityTitle.tsx +++ b/web/apps/app/components/navigation/titles/EntityTitle.tsx @@ -1,5 +1,5 @@ import React from 'react'; -import EntityIconLabel from '../shared/entity/EntityIconLabel'; +import EntityIconLabel from '../../shared/entity/EntityIconLabel'; export function EntityTitle({ entityId }: { entityId: string; }) { return ( diff --git a/web/apps/app/components/navigation/PageTitle.tsx b/web/apps/app/components/navigation/titles/PageTitle.tsx similarity index 86% rename from web/apps/app/components/navigation/PageTitle.tsx rename to web/apps/app/components/navigation/titles/PageTitle.tsx index 1a43f8fa92..fec3f85331 100644 --- a/web/apps/app/components/navigation/PageTitle.tsx +++ b/web/apps/app/components/navigation/titles/PageTitle.tsx @@ -5,8 +5,8 @@ import { usePathname } from 'next/navigation'; import { Typography } from '@signalco/ui-primitives/Typography'; import { Row } from '@signalco/ui-primitives/Row'; import { Avatar } from '@signalco/ui-primitives/Avatar'; -import { KnownPages } from '../../src/knownPages'; -import { useActiveNavItem } from './useActiveNavItem'; +import { useActiveNavItem } from '../useActiveNavItem'; +import { KnownPages } from '../../../src/knownPages'; import { SpaceTitle } from './SpaceTitle'; import { EntityTitle } from './EntityTitle'; import { EntitiesTitle } from './EntitiesTitle'; @@ -48,10 +48,10 @@ export function PageTitle({ fullPage = false }: { fullPage?: boolean }) { ) : ( - + ) )} - {activeNavItem?.label} + {activeNavItem?.label} ); } diff --git a/web/apps/app/components/navigation/SpaceTitle.tsx b/web/apps/app/components/navigation/titles/SpaceTitle.tsx similarity index 83% rename from web/apps/app/components/navigation/SpaceTitle.tsx rename to web/apps/app/components/navigation/titles/SpaceTitle.tsx index c6d95a47ec..2f490062e7 100644 --- a/web/apps/app/components/navigation/SpaceTitle.tsx +++ b/web/apps/app/components/navigation/titles/SpaceTitle.tsx @@ -3,10 +3,10 @@ import React from 'react'; import { Row } from '@signalco/ui-primitives/Row'; import { useSearchParam } from '@signalco/hooks/useSearchParam'; -import DashboardSelector from '../dashboards/DashboardSelector'; +import DashboardSelector from '../../dashboards/DashboardSelector'; export function SpaceTitle() { - const [,setIsEditing] = useSearchParam('editing'); + const [, setIsEditing] = useSearchParam('editing'); const [, setIsDashboardSettingsOpen] = useSearchParam('settings'); const handleEditWidgets = () => setIsEditing('true'); const handleSettings = () => setIsDashboardSettingsOpen('true'); diff --git a/web/apps/app/components/users/UserProfileAvatar.tsx b/web/apps/app/components/users/UserProfileAvatar.tsx index 873826cd44..2ae19803b6 100644 --- a/web/apps/app/components/users/UserProfileAvatar.tsx +++ b/web/apps/app/components/users/UserProfileAvatar.tsx @@ -1,5 +1,5 @@ -import { DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuSeparator, DropdownMenuTrigger } from '@signalco/ui-primitives/Menu'; -import { LogOut, Settings } from '@signalco/ui-icons'; +import { DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuTrigger } from '@signalco/ui-primitives/Menu'; +import { LogOut } from '@signalco/ui-icons'; import { KnownPages } from '../../src/knownPages'; import useLocale from '../../src/hooks/useLocale'; import UserProfileAvatarButton from './UserProfileAvatarButton'; @@ -13,10 +13,6 @@ export function UserProfileAvatar() { - }> - {t('Settings')} - - }> {t('Logout')}