From 25072f558fda1724337f4cb8574e8f3b64e1af45 Mon Sep 17 00:00:00 2001 From: "maruyama.t" Date: Thu, 8 Jun 2023 09:22:06 +0000 Subject: [PATCH] =?UTF-8?q?Merged=20PR=20132:=20=E7=94=BB=E9=9D=A2?= =?UTF-8?q?=E5=AE=9F=E8=A3=85=EF=BC=88=E3=83=9A=E3=83=BC=E3=82=B8=E3=83=98?= =?UTF-8?q?=E3=83=83=E3=83=80=E4=BF=AE=E6=AD=A3=EF=BC=89?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit ## 概要 [Task1840: 画面実装（ページヘッダ修正）](https://paruru.nds-tyo.co.jp:8443/tfs/ReciproCollection/fa4924a4-d079-4fab-9fb5-a9a11eb205f0/_workitems/edit/1840) - JWTからアクセストークン内のロールを確認する - 管理者権限（admin）を持たない場合はライセンスタブを表示しない ## レビューポイント - ライセンスタブを表示しない処理を.filterで行ってるが、問題ないか ## UIの変更 - ライセンスタブの表示非表示 ## 動作確認状況 - ローカルで確認、adminユーザで表示されること ![image.png](https://dev.azure.com/ODMSCloud/6023ff7b-d41c-4fa7-9c6f-f576ba48c07c/_apis/git/repositories/302da463-a2d7-40f9-b2bb-6e8edf324fa9/pullRequests/132/attachments/image.png) standardユーザで表示されないことを確認 ![image (2).png](https://dev.azure.com/ODMSCloud/6023ff7b-d41c-4fa7-9c6f-f576ba48c07c/_apis/git/repositories/302da463-a2d7-40f9-b2bb-6e8edf324fa9/pullRequests/132/attachments/image%20%282%29.png) ## 補足 - `// userRole: "user" | "partner"; ログインユーザーのロールに応じてタブの活性非活性に使用する想定` の記述は今回使わなかったので削除しました。 --- .../src/components/auth/constants.ts | 18 ++++++++++++++ .../src/components/header/constants.ts | 24 ++++++++++++++----- .../src/components/header/index.tsx | 1 - .../src/components/header/loginedHeader.tsx | 11 +++++---- dictation_client/src/features/auth/utils.ts | 15 ++++++++++++ 5 files changed, 58 insertions(+), 11 deletions(-) create mode 100644 dictation_client/src/components/auth/constants.ts diff --git a/dictation_client/src/components/auth/constants.ts b/dictation_client/src/components/auth/constants.ts new file mode 100644 index 0000000..55e074a --- /dev/null +++ b/dictation_client/src/components/auth/constants.ts @@ -0,0 +1,18 @@ +/** + * 管理ロール + * @const {string[]} + */ +export const ADMIN_ROLES = { + ADMIN: "admin", + STANDARD: "standard", +} as const; + +/** + * ロール + * @const {string[]} + */ +export const USER_ROLES = { + NONE: "none", + AUTHOR: "author", + TYPIST: "typist", +} as const; diff --git a/dictation_client/src/components/header/constants.ts b/dictation_client/src/components/header/constants.ts index fe99f60..e0a16c1 100644 --- a/dictation_client/src/components/header/constants.ts +++ b/dictation_client/src/components/header/constants.ts @@ -1,12 +1,24 @@ import { HeaderMenus, LoginedPaths } from "./types"; +export const HEADER_MENUS_ACCOUNT = "Account"; +export const HEADER_MENUS_USER = "User"; +export const HEADER_MENUS_LICENSE = "License"; +export const HEADER_MENUS_DICTATIONS = "Dictations"; +export const HEADER_MENUS_WORKFLOW = "Workflow"; +export const HEADER_MENUS_XXX = "XXX"; // XXX 仮のタブ + export const HEADER_MENUS: { label: HeaderMenus; path: LoginedPaths }[] = [ - { label: "Account", path: "/account" }, - { label: "Dictations", path: "/dictations" }, - { label: "License", path: "/license" }, - { label: "User", path: "/user" }, - { label: "Workflow", path: "/workflow" }, - { label: "XXX", path: "/xxx" }, // XXX 仮のタブ + { label: HEADER_MENUS_ACCOUNT, path: "/account" }, + { label: HEADER_MENUS_DICTATIONS, path: "/dictations" }, + { label: HEADER_MENUS_LICENSE, path: "/license" }, + { label: HEADER_MENUS_USER, path: "/user" }, + { label: HEADER_MENUS_WORKFLOW, path: "/workflow" }, + { label: HEADER_MENUS_XXX, path: "/xxx" }, // XXX 仮のタブ ]; export const HEADER_NAME = "ODMS Cloud"; + +/** + * adminのみに表示するヘッダータブ + */ +export const ADMIN_ONLY_TABS = [HEADER_MENUS_LICENSE]; diff --git a/dictation_client/src/components/header/index.tsx b/dictation_client/src/components/header/index.tsx index 150c3c5..0cd0085 100644 --- a/dictation_client/src/components/header/index.tsx +++ b/dictation_client/src/components/header/index.tsx @@ -6,7 +6,6 @@ import { isLoginPaths } from "./utils"; interface HeaderProps { userName?: string; - // userRole: string; ログインユーザーのロールに応じてタブの活性非活性に使用する想定 } // ヘッダー切り替え用のcomponent const Header: React.FC = (props) => { diff --git a/dictation_client/src/components/header/loginedHeader.tsx b/dictation_client/src/components/header/loginedHeader.tsx index 25f6c82..7acc934 100644 --- a/dictation_client/src/components/header/loginedHeader.tsx +++ b/dictation_client/src/components/header/loginedHeader.tsx @@ -1,13 +1,13 @@ import React from "react"; +import { isAdminUser } from "features/auth/utils"; import styles from "./loginedHeader.module.scss"; import logo from "../../assets/images/OMS_logo_black.svg"; import ac from "../../assets/images/account_circle.svg"; import { LoginedPaths } from "./types"; -import { HEADER_MENUS, HEADER_NAME } from "./constants"; +import { ADMIN_ONLY_TABS, HEADER_MENUS, HEADER_NAME } from "./constants"; interface HeaderProps { - // userRole: "user" | "partner"; ログインユーザーのロールに応じてタブの活性非活性に使用する想定 name: string; activePath: LoginedPaths; } @@ -15,7 +15,10 @@ interface HeaderProps { // ログイン後のヘッダー const LoginedHeader: React.FC = (props: HeaderProps) => { const { name, activePath } = props; - + const isAdmin = isAdminUser(); + const filteredMenus = isAdmin + ? HEADER_MENUS + : HEADER_MENUS.filter((item) => !ADMIN_ONLY_TABS.includes(item.label)); return (
@@ -24,7 +27,7 @@ const LoginedHeader: React.FC = (props: HeaderProps) => {
{HEADER_NAME}