malmert
82012e9640
Some checks failed
Build and Deploy MITM Webserver / build (push) Failing after 5s
- Updated API routes to remove redundant prefixes. - Introduced sniffer status fetching in the backend API. - Added Sniffing page and integrated it into the routing. - Created a new hook for backend API interactions. - Implemented sniffer status type definitions.
42 lines
1.4 KiB
TypeScript
42 lines
1.4 KiB
TypeScript
// src/components/Sidebar.tsx
|
|
import { ApartmentOutlined, ApiOutlined, HomeOutlined, InfoCircleOutlined, SettingOutlined } from '@ant-design/icons';
|
|
import { Layout, Menu } from 'antd';
|
|
import React from 'react';
|
|
import { useLocation, useNavigate } from 'react-router-dom';
|
|
import { PATHS } from '../routes';
|
|
import '../theme/layout.less';
|
|
|
|
const { Sider } = Layout;
|
|
|
|
const menuItems = [
|
|
{ key: PATHS.HOME, icon: <HomeOutlined style={{ fontSize: '18px' }} />, label: 'Home' },
|
|
{ key: PATHS.NETWORK, icon: <ApartmentOutlined style={{ fontSize: '18px' }} />, label: 'Network' },
|
|
{ key: PATHS.SNIFFING, icon: <ApiOutlined style={{ fontSize: '18px' }} />, label: 'Sniffing' },
|
|
{ key: '/about', icon: <InfoCircleOutlined style={{ fontSize: '18px' }} />, label: 'About' },
|
|
{ key: '/settings', icon: <SettingOutlined style={{ fontSize: '18px' }} />, label: 'Settings' },
|
|
];
|
|
|
|
interface SidebarProps {
|
|
collapsed: boolean;
|
|
onCollapse: (collapsed: boolean) => void;
|
|
}
|
|
|
|
const Sidebar: React.FC<SidebarProps> = ({ collapsed, onCollapse }) => {
|
|
const navigate = useNavigate();
|
|
const location = useLocation();
|
|
|
|
return (
|
|
<Sider collapsible collapsed={collapsed} onCollapse={onCollapse}>
|
|
<Menu
|
|
theme="dark"
|
|
mode="inline"
|
|
selectedKeys={[location.pathname]}
|
|
items={menuItems}
|
|
onClick={(e) => navigate(e.key)}
|
|
/>
|
|
</Sider>
|
|
);
|
|
};
|
|
|
|
export default Sidebar;
|