Can not read properties of null (reading '0'). React

Can someone please help me on this.

I am getting errors while running the below code. I don't know what mistake I am doing. I have put the comment in the line where error is coming. Even a little suggestion would be very helpful.

Error is in the image at the end.

import React from 'react';
import { Link } from 'react-router-dom';
import Auth from './auth/auth';
import { BrowserRouter, withRouter } from 'react-router-dom';
import { Security } from '@okta/okta-react';
import { oktaAuth, toRelativeUrl } from '../../../../libs/okta-auth.js';
import Routes from './routes/routes';

class App extends React.Component<any, any> {
  restoreOriginalUri: any;

  constructor(props) {
    super(props);
    try {
      this.restoreOriginalUri = async (_oktaAuth, originalUri) => {
        //        *********ERROR IN THE BELOW LINE*********

        props.history.replace(
          toRelativeUrl(originalUri, window.location.origin)
        );
      };
    } catch (error) {
      console.log('error');
    }
  }

  render() {
    return (
      <h1>
        Welcome to clinical-trials!!!
        <br />
        <hr />
        <br />
        <div role='navigation'>
          <ul>
            <li>
              <Link to='/'>Home</Link>
            </li>
          </ul>
        </div>
        <div>
          <Security
            oktaAuth={oktaAuth}
            restoreOriginalUri={this.restoreOriginalUri}
          >
            <Auth />
            <Routes />
          </Security>
        </div>
      </h1>
    );
  }
}

const AppWithRouter = withRouter(App);

// eslint-disable-next-line import/no-anonymous-default-export
export default class extends React.Component {
  render() {
    return (
      <BrowserRouter>
        <AppWithRouter />
      </BrowserRouter>
    );
  }
}

What mistake I am doing. I am new to react.
Can it be resolved using callback?
I used setTimeout() but it didn't help

from Can not read properties of null (reading '0'). React