import { FC, useCallback, useContext, useEffect } from 'react'; import { Navigate, Routes, Route, useNavigate, useLocation } from 'react-router-dom'; import { AxiosError } from 'axios'; import { FeaturesContext } from './contexts/features'; import * as AuthenticationApi from './api/authentication'; import { PROJECT_PATH } from './api/env'; import { AXIOS } from './api/endpoints'; import { Layout, RequireAdmin } from './components'; import ProjectRouting from './project/ProjectRouting'; import NetworkConnection from './framework/network/NetworkConnection'; import AccessPoint from './framework/ap/AccessPoint'; import NetworkTime from './framework/ntp/NetworkTime'; import Mqtt from './framework/mqtt/Mqtt'; import System from './framework/system/System'; import Security from './framework/security/Security'; const AuthenticatedRouting: FC = () => { const { features } = useContext(FeaturesContext); const location = useLocation(); const navigate = useNavigate(); const handleApiResponseError = useCallback( (error: AxiosError) => { if (error.response && error.response.status === 401) { AuthenticationApi.storeLoginRedirect(location); navigate('/unauthorized'); } return Promise.reject(error); }, [location, navigate] ); useEffect(() => { const axiosHandlerId = AXIOS.interceptors.response.use((response) => response, handleApiResponseError); return () => AXIOS.interceptors.response.eject(axiosHandlerId); }, [handleApiResponseError]); return ( {features.project && } />} } /> } /> {features.ntp && } />} {features.mqtt && } />} {features.security && ( } /> )} } /> } /> ); }; export default AuthenticatedRouting;