39 lines
1.1 KiB
TypeScript
39 lines
1.1 KiB
TypeScript
import React from 'react';
|
|
import { ButtonGroup } from 'react-bootstrap';
|
|
import FlightIcon from '@mui/icons-material/Flight';
|
|
import Layout from '../components/Layout';
|
|
import { NavLink, Outlet, useLocation } from 'react-router';
|
|
import { ADSBDataProvider } from './adsb/ADSBData';
|
|
import type { NavLinkItem } from '../types/layout.types';
|
|
|
|
interface Props {
|
|
navLinks?: NavLinkItem[];
|
|
}
|
|
|
|
const ADSB: React.FC<Props> = ({ navLinks = [] }) => {
|
|
const location = useLocation();
|
|
|
|
const viewButtons = (
|
|
<ButtonGroup className="adsb-view-switch" size="sm" aria-label="ADSB view switch">
|
|
<NavLink
|
|
to="/adsb/packets"
|
|
className={`btn btn-sm btn-icon ${location.pathname.startsWith('/adsb/packets') ? 'btn-primary' : 'btn-outline-light'}`}
|
|
title="Packets"
|
|
>
|
|
<FlightIcon className="icon" />
|
|
<span className="ms-1 d-none d-lg-inline">Packets</span>
|
|
</NavLink>
|
|
</ButtonGroup>
|
|
);
|
|
|
|
return (
|
|
<ADSBDataProvider>
|
|
<Layout navLinks={navLinks} buttonGroup={viewButtons}>
|
|
<Outlet />
|
|
</Layout>
|
|
</ADSBDataProvider>
|
|
);
|
|
};
|
|
|
|
export default ADSB;
|