GitHub-Proxy/signoz
1
0
Fork 0
mirror of https://git.mirrors.martin98.com/https://github.com/SigNoz/signoz synced 2025-08-16 10:05:53 +08:00
Code Issues Packages Projects Releases Wiki Activity

feat: tags are added in the sidebar (#1153)

Browse Source 
* feat: tags are added in the sidebar

* chore: styles is updated
This commit is contained in:
palash-signoz 2022-05-20 11:43:23 +05:30 committed by GitHub
parent 7d2883df11
commit 4b8bd2e335
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 23 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
frontend/src/container/SideNav/index.tsx
View File

@ -1,5 +1,5 @@
import { CheckCircleTwoTone, WarningOutlined } from '@ant-design/icons';
import { Menu, Typography } from 'antd';
import { Menu, Space, Typography } from 'antd';
import getLocalStorageKey from 'api/browser/localstorage/get';
import { IS_SIDEBAR_COLLAPSED } from 'constants/app';
import ROUTES from 'constants/routes';
@ -19,6 +19,7 @@ import {
Sider,
SlackButton,
SlackMenuItemContainer,
Tags,
VersionContainer,
} from './styles';
@ -96,13 +97,21 @@ function SideNav(): JSX.Element {
selectedKeys={[pathname]}
mode="inline"
>
{menus.map(({ to, Icon, name }) => (
{menus.map(({ to, Icon, name, tags }) => (
<Menu.Item
key={to}
icon={<Icon />}
onClick={(): void => onClickHandler(to)}
>
<Typography>{name}</Typography>
<Space style={{ position: 'relative' }}>
<Typography>{name}</Typography>
{tags &&
tags.map((e) => (
<Tags color="#177DDC" key={e}>
<Typography.Text strong>{e}</Typography.Text>
</Tags>
))}
</Space>
</Menu.Item>
))}
{sidebar.map((props, index) => (

2
frontend/src/container/SideNav/menuItems.ts
View File

@ -41,6 +41,7 @@ const menus: SidebarMenu[] = [
to: ROUTES.SERVICE_MAP,
name: 'Service Map',
Icon: DeploymentUnitOutlined,
tags: ['Beta'],
},
{
Icon: LineChartOutlined,
@ -63,6 +64,7 @@ interface SidebarMenu {
to: string;
name: string;
Icon: typeof ApiOutlined;
tags?: string[];
}
export default menus;

10
frontend/src/container/SideNav/styles.ts
View File

@ -1,4 +1,4 @@
import { Layout, Typography } from 'antd';
import { Layout, Tag, Typography } from 'antd';
import { StyledCSS } from 'container/GantChart/Trace/styles';
import styled, { css } from 'styled-components';
@ -75,3 +75,11 @@ export const VersionContainer = styled.div`
display: flex;
}
`;
export const Tags = styled(Tag)`
&&& {
position: absolute;
top: 0;
border-radius: 0.5rem;
}
`;