lagunovsky/redux-react-router with ProtectedRoute, not working example

App.tsx

// ...
<Route path="/settings" element={
  <ProtectedNavigation
    // onRedirect={ onRedirect }
    // authentication={ authentication }
  >
  <Settings />
  </ProtectedNavigation>}
/>
// ...

package.json

...
	"dependencies": {
		"@aws-amplify/ui-components": "^1.9.6",
		"@emotion/react": "^11.9.3",
		"@emotion/styled": "^11.9.3",
		"@lagunovsky/redux-react-router": "^3.2.0",
		"@mui/icons-material": "^5.8.4",
		"@mui/lab": "^5.0.0-alpha.88",
		"@mui/material": "^5.8.5",
		"@reduxjs/toolkit": "^1.8.2",
		"aws-amplify": "^4.3.0",
		"axios": "^0.27.2",
		"history": "^5.3.0",
		"i18next": "^21.8.10",
		"jwt-decode": "^3.1.2",
		"react": "^18.2.0",
		"react-dom": "^18.0.0",
		"react-i18next": "^11.17.2",
		"react-redux": "^8.0.2",
		"react-router-dom": "^6.3.0",
		"redux": "^4.2.0"
	},
	"devDependencies": {
		"@aws-amplify/cli": "^8.4.0",
		"@honkhonk/vite-plugin-svgr": "^1.1.0",
		"@rollup/plugin-replace": "^4.0.0",
		"@testing-library/jest-dom": "^5.16.4",
		"@testing-library/react": "^13.3.0",
		"@testing-library/user-event": "^13.2.1",
		"@types/dat.gui": "^0.7.7",
		"@types/react": "^17.0.47",
		"@types/react-dom": "^18.0.5",
		"@types/react-router-dom": "^5.3.3",
		"@vitejs/plugin-react": "^1.3.0",
		"dat.gui": "^0.7.9",
		"typescript": "^4.6.3",
		"vite": "^2.9.9",
		"vite-plugin-pwa": "^0.12.1"
	},
...

ProtectedRoute.tsx

import { LinearProgress } from '@mui/material';
import React, { FunctionComponent, ReactNode, useEffect, } from 'react'
import { useDispatch, useSelector } from 'react-redux';
import { Navigate, } from 'react-router-dom';
import { Authentication, userRedirected } from '../../redux/slices/app';
import { navigate } from '../../redux/slices/navigation';
import { AppDispatch, RootState } from '../../redux/store';
import { push } from '@lagunovsky/redux-react-router'
import history from '../history';

interface Props {
}

const ProtectedNavigation:FunctionComponent<Props> = ( props ) => {

  const authentication = useSelector( (state:RootState) => state.app.authentication );


  if ( authentication === 'failed' ) {
    return <Navigate to='/' />;
  }

  if( authentication === 'succeeded' ) return (<div>{props.children}</div>)
  return (<LinearProgress />)
}

export default ProtectedNavigation;