From c089060162f02cf3276a0b96ee33601a67797ef3 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E6=B0=B4=E6=9C=AC=20=E7=A5=90=E5=B8=8C?= Date: Tue, 31 Oct 2023 10:28:43 +0000 Subject: [PATCH] =?UTF-8?q?Merged=20PR=20542:=20=E7=94=BB=E9=9D=A2?= =?UTF-8?q?=E4=BF=AE=E6=AD=A3=EF=BC=88=E3=82=B5=E3=82=A4=E3=83=B3=E3=82=A2?= =?UTF-8?q?=E3=82=A6=E3=83=88=E6=9C=AC=E5=AE=9F=E8=A3=85=EF=BC=89?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit ## 概要 [Task2963: 画面修正（サインアウト本実装）](https://paruru.nds-tyo.co.jp:8443/tfs/ReciproCollection/fa4924a4-d079-4fab-9fb5-a9a11eb205f0/_workitems/edit/2963) - 元PBI or タスクへのリンク（内容・目的などはそちらにあるはず） - 何をどう変更したか、追加したライブラリなど **headerにサインアウトの実装を追加** - このPull Requestでの対象/対象外 - 影響範囲（他の機能にも影響があるか） ## レビューポイント - 特にレビューしてほしい箇所 - 軽微なものや自明なものは記載不要 - 修正範囲が大きい場合などに記載 - 全体的にや仕様を満たしているか等は本当に必要な時のみ記載 ## UIの変更 - Before/Afterのスクショなど - スクショ置き場 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/Task2963?csf=1&web=1&e=XbInfz ## 動作確認状況 - ローカルで確認 管理者ユーザーかつ第1～5階層、一般ユーザーでログインし、headerに表示されかつサインアウトできることを確認。 ## 補足 - 相談、参考資料などがあれば --- .../src/components/header/loginedHeader.tsx | 35 +++++++++++++++++-- dictation_client/src/translation/de.json | 6 ++-- dictation_client/src/translation/en.json | 6 ++-- dictation_client/src/translation/es.json | 6 ++-- dictation_client/src/translation/fr.json | 6 ++-- 5 files changed, 48 insertions(+), 11 deletions(-) diff --git a/dictation_client/src/components/header/loginedHeader.tsx b/dictation_client/src/components/header/loginedHeader.tsx index a0cafea..925d09b 100644 --- a/dictation_client/src/components/header/loginedHeader.tsx +++ b/dictation_client/src/components/header/loginedHeader.tsx @@ -1,17 +1,23 @@ -import React, { useEffect } from "react"; +import React, { useCallback, useEffect } from "react"; import styles from "styles/app.module.scss"; import { useDispatch, useSelector } from "react-redux"; +import { AppDispatch } from "app/store"; +import { useMsal } from "@azure/msal-react"; +import { clearToken } from "features/auth"; +import { useTranslation } from "react-i18next"; import { getUserInfoAsync, selectUserName, selectIsUserNameEmpty, + clearUserInfo, } from "features/login"; -import { AppDispatch } from "app/store"; import { getFilteredMenus } from "./utils"; import logo from "../../assets/images/OMS_logo_black.svg"; import ac from "../../assets/images/account_circle.svg"; import { LoginedPaths } from "./types"; import { HEADER_NAME } from "./constants"; +import logout from "../../assets/images/logout.svg"; +import { getTranslationID } from "../../translation"; interface HeaderProps { activePath: LoginedPaths; @@ -22,6 +28,8 @@ const LoginedHeader: React.FC = (props: HeaderProps) => { const { activePath } = props; const filterMenus = getFilteredMenus(); const dispatch: AppDispatch = useDispatch(); + const { instance } = useMsal(); + const { t } = useTranslation(); // Headerのユーザー情報を取得する const isUserNameEmpty = useSelector(selectIsUserNameEmpty); @@ -32,6 +40,22 @@ const LoginedHeader: React.FC = (props: HeaderProps) => { dispatch(getUserInfoAsync()); } }, [dispatch, isUserNameEmpty]); + + // ログアウト + const onSignoutButton = useCallback( + async () => { + // ダイアログ確認 + // eslint-disable-next-line no-alert + if (window.confirm(t(getTranslationID("common.message.displayDialog")))) { + instance.logoutRedirect({ postLogoutRedirectUri: "/" }); + dispatch(clearToken()); + dispatch(clearUserInfo()); + } + }, + // eslint-disable-next-line react-hooks/exhaustive-deps + [dispatch] + ); + return (
@@ -55,10 +79,15 @@ const LoginedHeader: React.FC = (props: HeaderProps) => { ))} +

- {userName} + {/* eslint-disable-next-line jsx-a11y/click-events-have-key-events, jsx-a11y/no-static-element-interactions */} + + + {t(getTranslationID("common.label.signOutButton"))} +

diff --git a/dictation_client/src/translation/de.json b/dictation_client/src/translation/de.json index d821ebc..cf14563 100644 --- a/dictation_client/src/translation/de.json +++ b/dictation_client/src/translation/de.json @@ -7,7 +7,8 @@ "internalServerError": "Verarbeitung fehlgeschlagen. Bitte versuchen Sie es später noch einmal.", "listEmpty": "Es gibt 0 Suchergebnisse.", "dialogConfirm": "Möchten Sie die Operation durchführen?", - "success": "Erfolgreich verarbeitet" + "success": "Erfolgreich verarbeitet", + "displayDialog": "(de)サインアウトしてもよろしいですか？" }, "label": { "cancel": "Abbrechen", @@ -22,7 +23,8 @@ "tier3": "(de)Distributor", "tier4": "(de)Dealer", "tier5": "(de)Customer", - "notSelected": "(de)None" + "notSelected": "(de)None", + "signOutButton": "(de)Sign out" } }, "topPage": { diff --git a/dictation_client/src/translation/en.json b/dictation_client/src/translation/en.json index f11c1ad..6ded9d8 100644 --- a/dictation_client/src/translation/en.json +++ b/dictation_client/src/translation/en.json @@ -7,7 +7,8 @@ "internalServerError": "Processing failed. Please try again later. ", "listEmpty": "There are 0 search results.", "dialogConfirm": "Do you want to perform the operation?", - "success": "Successfully Processed" + "success": "Successfully Processed", + "displayDialog": "サインアウトしてもよろしいですか？" }, "label": { "cancel": "Cancel", @@ -22,7 +23,8 @@ "tier3": "Distributor", "tier4": "Dealer", "tier5": "Customer", - "notSelected": "None" + "notSelected": "None", + "signOutButton": "Sign out" } }, "topPage": { diff --git a/dictation_client/src/translation/es.json b/dictation_client/src/translation/es.json index b96b55d..6dd82a1 100644 --- a/dictation_client/src/translation/es.json +++ b/dictation_client/src/translation/es.json @@ -7,7 +7,8 @@ "internalServerError": "El procesamiento falló. Por favor, inténtelo de nuevo más tarde.", "listEmpty": "Hay 0 resultados de búsqueda.", "dialogConfirm": "¿Quieres realizar la operación?", - "success": "Procesado con éxito" + "success": "Procesado con éxito", + "displayDialog": "(es)サインアウトしてもよろしいですか？" }, "label": { "cancel": "Cancelar", @@ -22,7 +23,8 @@ "tier3": "(es)Distributor", "tier4": "(es)Dealer", "tier5": "(es)Customer", - "notSelected": "(es)None" + "notSelected": "(es)None", + "signOutButton": "(es)Sign out" } }, "topPage": { diff --git a/dictation_client/src/translation/fr.json b/dictation_client/src/translation/fr.json index 750cfbf..f7d0fd1 100644 --- a/dictation_client/src/translation/fr.json +++ b/dictation_client/src/translation/fr.json @@ -7,7 +7,8 @@ "internalServerError": "Le traitement a échoué. Veuillez réessayer plus tard.", "listEmpty": "Il y a 0 résultats de recherche.", "dialogConfirm": "Voulez-vous effectuer l'opération?", - "success": "Traité avec succès" + "success": "Traité avec succès", + "displayDialog": "(fr)サインアウトしてもよろしいですか？" }, "label": { "cancel": "Annuler", @@ -22,7 +23,8 @@ "tier3": "(fr)Distributor", "tier4": "(fr)Dealer", "tier5": "(fr)Customer", - "notSelected": "(fr)None" + "notSelected": "(fr)None", + "signOutButton": "(fr)Sign out" } }, "topPage": {