e9541e22a2
## 概要 [Task2920: 画面修正](https://paruru.nds-tyo.co.jp:8443/tfs/ReciproCollection/fa4924a4-d079-4fab-9fb5-a9a11eb205f0/_workitems/edit/2920) - 元PBI or タスクへのリンク（内容・目的などはそちらにあるはず） - 何をどう変更したか、追加したライブラリなど ログイン時に、API（getMyUser）を呼び出し、フラグをtrueにして結果をstateに保存する。 フラグで管理する目的は、ページ遷移時に再度API呼び出しを行わないようにするため。 - このPull Requestでの対象/対象外 サインアウト部分は対象外→別タスクにて対応 - 影響範囲（他の機能にも影響があるか） 既存の各ページのヘッダー部分 ## レビューポイント - component/header配下にSliceを追加すると循環参照になってしまうのを避けるため、feature/login配下にSlice及び各処理を追加した、妥当か。 ## UIの変更 - https://ndstokyo.sharepoint.com/:f:/r/sites/Piranha/Shared%20Documents/General/OMDS/%E3%82%B9%E3%82%AF%E3%83%AA%E3%83%BC%E3%83%B3%E3%82%B7%E3%83%A7%E3%83%83%E3%83%88/Task2920?csf=1&web=1&e=AQgVug ## 動作確認状況 - ローカルで確認 ## 補足 - 相談、参考資料などがあれば
40 lines
1.0 KiB
TypeScript
40 lines
1.0 KiB
TypeScript
import { useMsal } from "@azure/msal-react";
|
|
import { AppDispatch } from "app/store";
|
|
import { UpdateTokenTimer } from "components/auth/updateTokenTimer";
|
|
import Footer from "components/footer";
|
|
import Header from "components/header";
|
|
import { clearToken } from "features/auth";
|
|
import { clearUserInfo } from "features/login";
|
|
|
|
import React from "react";
|
|
import { useDispatch } from "react-redux";
|
|
import styles from "styles/app.module.scss";
|
|
|
|
const SamplePage: React.FC = (): JSX.Element => {
|
|
const { instance } = useMsal();
|
|
const dispatch: AppDispatch = useDispatch();
|
|
|
|
return (
|
|
<div className={styles.wrap}>
|
|
<Header />
|
|
<UpdateTokenTimer />
|
|
<div>
|
|
<button
|
|
type="button"
|
|
className={styles.buttonText}
|
|
onClick={() => {
|
|
instance.logoutRedirect({ postLogoutRedirectUri: "/" });
|
|
dispatch(clearToken());
|
|
dispatch(clearUserInfo());
|
|
}}
|
|
>
|
|
sign out
|
|
</button>
|
|
</div>
|
|
<Footer />
|
|
</div>
|
|
);
|
|
};
|
|
|
|
export default SamplePage;
|