AWSのCognitoでログイン画面を実装しているのですが、トークン切れ（セッション切れ）の際にログイン画面に飛ばしたいです。

Question

実現したいこと

• セッション切れの際にログイン画面に飛ばしたい

前提

reactでログイン機能のあるwebアプリを作っています。
Auth.currentUserInfo()でトークンを確認出来ると思うのですが、Refresh Tokenの有効期限が切れている際に、reactでどういう処理を書けば良いのかが分かりません。
簡単なコードや参考になる記事などあれば教えて頂きたいです。

該当のソースコード

function App() {
  return (
    <Authenticator >
      {({ signOut, user }) => (
        <h1>{user.username}</h1>
        <button onClick={signOut}>Sign out</button>
    </Authenticator>
  );
}

補足情報（FW/ツールのバージョンなど）

node v16.18.34

Answer 1

https://www.youtube.com/watch?v=m9ZjW1md_OQ
参考URLです

参考URL先のコードです。権限がある場合と無い場合での処理の参考になるかと思います。

import logo from "./logo.svg";
import "./App.css";
import { Amplify } from "aws-amplify";
import { withAuthenticator } from "@aws-amplify/ui-react";
import "@aws-amplify/ui-react/styles.css";

import awsExports from "./aws-exports";
Amplify.configure(awsExports);

function App({ signOut, user }) {
  return (
    <div className="App">
      <header className="App-header">
        <img src={logo} className="App-logo" alt="logo" />
        <h2>Hello React with AWS</h2>
        {user ? (
          <>
            <h3>私は権限を持っています：{user.username}</h3>
            <button onClick={signOut}>Sign out</button>
          </>
        ) : (
          <h3>権限がありません</h3>
        )}
      </header>
    </div>
  );
}

export default withAuthenticator(App);