select-harlequinS
Refine•2y ago•
9 replies
select-harlequin

Authenticated now working properly

Hello, I have my app setup as follows:
                <Routes>
                  <Route path="/register" element={<RegisterPage />} />
                  <Route path="/login" element={<LoginPage />} />
                  <Route
                    path="/forgot-password"
                    element={<ForgotPasswordPage />}
                  />
                  <Route
                    path="/update-password"
                    element={<UpdatePasswordPage />}
                  />
                  <Route
                    element={
                      <Authenticated
                        key="authenticated-layout"
                        fallback={<CatchAllNavigate to="/login" />}
                      >
                        <Layout>
                          <Outlet />
                        </Layout>
                      </Authenticated>
                    }
                  >
                    <Route index element={<Home />} />
                    <Route path="/customers">
                      <Route index element={<CustomerList />} />
                      <Route path="new" element={<CreateCustomer />} />
                    </Route>
                    <Route path="/events">
                      <Route index element={<EventList />} />
                      <Route path="new" element={<CreateEvent />} />
                    </Route>
                  </Route>
                </Routes>

However if I stay for example on /events/list page and wait for accessToken to expire and then navigate to /costumers page the data doesn't load because I'm no longer authenticated but <Authenticated /> component doesn't call check when I navigate from /events to /customers. How do I resolve this issue? Calling useIsAuthenticated hook goes into infinite render loop
Was this page helpful?