When i navigate from one page to other i need to load my google tag manager. But currently only when i reload page it happens else it wont.

App.js

import React, { Component, useEffect } from 'react'
import { Root, Routes } from 'react-static'
import { Link, Router } from 'components/Router'
// import Header from './pages/common/header';
import Menubar from './pages/common/menubar';
import Footer from './pages/common/footer';
import LoadingProcess from './pages/common/loading-process';
import './pages/sass/app.scss';

import 'bootstrap/dist/css/bootstrap.min.css';
import TagManager from 'react-gtm-module';

class App extends Component {
componentDidMount() {
const tagManagerArgs = {
gtmId: 'GTM-T7FPMNs'
}
TagManager.initialize(tagManagerArgs);
}
render() {

return (
  <Root>
    <React.Suspense fallback={<LoadingProcess />}>
      <div className="app-top-container">
        <Menubar />
        <div className="content app-container">
          <Router>
            <Routes path="*" />
          </Router>
        </div>
        <Footer />
      </div>
    </React.Suspense>
  </Root>
)

}
}

export default App