67 lines
2.0 KiB
TypeScript
67 lines
2.0 KiB
TypeScript
'use client';
|
|
|
|
import {TopNav} from '@astryxdesign/core/TopNav';
|
|
import {HStack} from '@astryxdesign/core/Layout';
|
|
import {IconButton} from '@astryxdesign/core/IconButton';
|
|
import {Icon} from '@astryxdesign/core/Icon';
|
|
import {DropdownMenu} from '@astryxdesign/core/DropdownMenu';
|
|
import {Avatar} from '@astryxdesign/core/Avatar';
|
|
import {Divider} from '@astryxdesign/core/Divider';
|
|
import {ICONS} from '@/lib/icons';
|
|
import {GlobalSearch} from './GlobalSearch';
|
|
import {StoreSwitcher} from './StoreSwitcher';
|
|
import {RangePicker} from './RangePicker';
|
|
import {CopilotToggle} from '@/features/copilot/CopilotToggle';
|
|
|
|
/**
|
|
* Compact application bar. Scope controls (store, range) live at the start
|
|
* because they govern the whole workspace; identity and alerts live at the end.
|
|
*/
|
|
export function AppTopNav() {
|
|
return (
|
|
<TopNav
|
|
label="Workspace"
|
|
startContent={
|
|
<HStack gap={1} vAlign="center">
|
|
<StoreSwitcher />
|
|
<Divider orientation="vertical" />
|
|
<RangePicker />
|
|
</HStack>
|
|
}
|
|
centerContent={<GlobalSearch />}
|
|
endContent={
|
|
<HStack gap={1} vAlign="center">
|
|
<CopilotToggle />
|
|
<IconButton
|
|
icon={<Icon icon={ICONS.notifications} />}
|
|
label="Notifications"
|
|
variant="ghost"
|
|
/>
|
|
<DropdownMenu
|
|
hasChevron={false}
|
|
button={{
|
|
variant: 'ghost',
|
|
isIconOnly: true,
|
|
label: 'Account',
|
|
icon: <Avatar name="Suriya N" size="sm" tooltip={false} />,
|
|
}}
|
|
menuWidth={200}
|
|
items={[
|
|
{
|
|
type: 'section',
|
|
title: 'suriya@nearle.in',
|
|
items: [
|
|
{label: 'Profile', icon: ICONS.profile},
|
|
{label: 'Settings', icon: ICONS.settings},
|
|
],
|
|
},
|
|
{type: 'divider'},
|
|
{label: 'Sign out', icon: ICONS.signOut},
|
|
]}
|
|
/>
|
|
</HStack>
|
|
}
|
|
/>
|
|
);
|
|
}
|