import * as React from 'react';
import { QueryClientProvider } from 'react-query';
import { HashRouter as Router, Route, RouteObject, Routes, useRoutes } from 'react-router-dom';
import { RecoilRoot } from 'recoil';
import APIConfig from '~/components//APIConfig';
import { About } from '~/components/about/About';
import APIDiscovery from '~/components/APIDiscovery';
import ErrorBoundary from '~/components/ErrorBoundary';
import Home from '~/components/Home';
import Loading from '~/components/Loading';
import Loading2 from '~/components/Loading2';
import { Head } from '~/components/shared/Head';
import SideBar from '~/components/SideBar';
import StateProvider from '~/components/StateProvider';
import StyleGuide from '~/components/StyleGuide';
import { queryClient } from '~/misc/query';
import { actions, initialState } from '~/store';
import styles from './App.module.scss';
const { lazy, Suspense } = React;
const Connections = lazy(() => import('~/components/Connections'));
const Config = lazy(() => import('~/components/Config'));
const Logs = lazy(() => import('~/components/Logs'));
const Proxies = lazy(() => import('~/components/proxies/Proxies'));
const Rules = lazy(() => import('~/components/Rules'));
const routes = [
{ path: '/', element: },
{ path: '/connections', element: },
{ path: '/configs', element: },
{ path: '/logs', element: },
{ path: '/proxies', element: },
{ path: '/rules', element: },
{ path: '/about', element: },
process.env.NODE_ENV === 'development' ? { path: '/style', element: } : false,
].filter(Boolean) as RouteObject[];
function SideBarApp() {
return (
<>
}>{useRoutes(routes)}
);
}
const App = () => (
}>
} />
} />
);
export default App;