{title}

import React from 'react'; import type { AppProps } from 'next/app'; import type { ReactElement, ReactNode } from 'react'; import type { NextPage } from 'next'; import Head from 'next/head'; import { store } from '../stores/store'; import { Provider } from 'react-redux'; import '../css/main.css'; import axios from 'axios'; import { baseURLApi } from '../config'; import { useRouter } from 'next/router'; import 'intro.js/introjs.css'; import IntroGuide from '../components/IntroGuide'; import { appSteps, loginSteps, usersSteps, rolesSteps, } from '../stores/introSteps'; export type NextPageWithLayout

, IP = P> = NextPage< P, IP > & { getLayout?: (page: ReactElement) => ReactNode; }; type AppPropsWithLayout = AppProps & { Component: NextPageWithLayout; }; function MyApp({ Component, pageProps }: AppPropsWithLayout) { // Use the layout defined at the page level, if available const getLayout = Component.getLayout || ((page) => page); if (typeof window !== 'undefined') { // Perform localStorage action console.log( 'process.env.NEXT_PUBLIC_BACK_API', process.env.NEXT_PUBLIC_BACK_API, ); axios.defaults.baseURL = process.env.NEXT_PUBLIC_BACK_API ? process.env.NEXT_PUBLIC_BACK_API : baseURLApi; axios.defaults.headers.common['Content-Type'] = 'application/json'; const token = localStorage.getItem('token'); if (token) { axios.defaults.headers.common['Authorization'] = 'Bearer ' + token; } } React.useEffect(() => { if (typeof window !== 'undefined') { const handleMessage = (event) => { if (event.data === 'getLocation') { event.source.postMessage( { iframeLocation: window.location.pathname }, event.origin, ); } }; window.addEventListener('message', handleMessage); // Cleanup listener on unmount return () => { window.removeEventListener('message', handleMessage); }; } }, []); const title = 'Drone Maintenance Management App'; const description = 'Drone Maintenance Management App generated by Flatlogic'; const url = 'https://flatlogic.com/'; const image = `https://flatlogic.com/logo.svg`; const imageWidth = '1920'; const imageHeight = '960'; const [stepsEnabled, setStepsEnabled] = React.useState(true); const [stepName, setStepName] = React.useState(''); const [steps, setSteps] = React.useState([]); const router = useRouter(); React.useEffect(() => { const isCompleted = (stepKey: string) => { return localStorage.getItem(`completed_${stepKey}`) === 'true'; }; if (router.pathname === '/login' && !isCompleted('loginSteps')) { setSteps(loginSteps); setStepName('loginSteps'); setStepsEnabled(true); } else if (router.pathname === '/dashboard' && !isCompleted('appSteps')) { setTimeout(() => { setSteps(appSteps); setStepName('appSteps'); setStepsEnabled(true); }, 1000); } else if ( router.pathname === '/users/users-list' && !isCompleted('usersSteps') ) { setTimeout(() => { setSteps(usersSteps); setStepName('usersSteps'); setStepsEnabled(true); }, 1000); } else if ( router.pathname === '/roles/roles-list' && !isCompleted('rolesSteps') ) { setTimeout(() => { setSteps(rolesSteps); setStepName('rolesSteps'); setStepsEnabled(true); }, 1000); } else { setSteps([]); setStepsEnabled(false); } }, [router.pathname]); const handleExit = () => { setStepsEnabled(false); }; return ( {getLayout( <> , )} ); } export default MyApp;