From b495148a69874520e75a4e9b817d127d3eeb1ee1 Mon Sep 17 00:00:00 2001 From: Daniel Valdivia Date: Thu, 10 Dec 2020 21:49:20 -0800 Subject: [PATCH] Set Operator Logo for Operator Mode (#503) --- portal-ui/src/ProtectedRoutes.tsx | 13 ++++++-- portal-ui/src/actions.ts | 18 ++++++++--- portal-ui/src/icons/minio_operator_logo.svg | 32 +++++++++++++++++++ portal-ui/src/reducer.ts | 19 +++++++---- .../src/screens/Console/Account/Account.tsx | 7 ++-- .../Console/Buckets/ViewBucket/ViewBucket.tsx | 7 ++-- portal-ui/src/screens/Console/Menu/Menu.tsx | 6 ++-- portal-ui/src/screens/Console/Menu/types.ts | 1 + portal-ui/src/types.ts | 8 +++++ 9 files changed, 90 insertions(+), 21 deletions(-) create mode 100644 portal-ui/src/icons/minio_operator_logo.svg diff --git a/portal-ui/src/ProtectedRoutes.tsx b/portal-ui/src/ProtectedRoutes.tsx index dbcfb5969..07d3528a7 100644 --- a/portal-ui/src/ProtectedRoutes.tsx +++ b/portal-ui/src/ProtectedRoutes.tsx @@ -18,9 +18,10 @@ import React, { useEffect, useState } from "react"; import { Redirect } from "react-router-dom"; import { connect } from "react-redux"; import { AppState } from "./store"; -import { userLoggedIn } from "./actions"; +import { consoleOperatorMode, userLoggedIn } from "./actions"; import api from "./common/api"; import { saveSessionResponse } from "./screens/Console/actions"; +import { ISessionResponse } from "./screens/Console/types"; const mapState = (state: AppState) => ({ loggedIn: state.system.loggedIn, @@ -28,6 +29,7 @@ const mapState = (state: AppState) => ({ const connector = connect(mapState, { userLoggedIn, + consoleOperatorMode, saveSessionResponse, }); @@ -35,6 +37,7 @@ interface ProtectedRouteProps { loggedIn: boolean; Component: any; userLoggedIn: typeof userLoggedIn; + consoleOperatorMode: typeof consoleOperatorMode; saveSessionResponse: typeof saveSessionResponse; } @@ -42,16 +45,22 @@ const ProtectedRoute = ({ Component, loggedIn, userLoggedIn, + consoleOperatorMode, saveSessionResponse, }: ProtectedRouteProps) => { const [sessionLoading, setSessionLoading] = useState(true); useEffect(() => { api .invoke("GET", `/api/v1/session`) - .then((res) => { + .then((res: ISessionResponse) => { saveSessionResponse(res); userLoggedIn(true); setSessionLoading(false); + // check for tenants presence, that indicates we are in operator mode + if (res.pages.includes("/tenants")) { + consoleOperatorMode(true); + document.title = "MinIO Operator"; + } }) .catch(() => setSessionLoading(false)); }, [saveSessionResponse]); diff --git a/portal-ui/src/actions.ts b/portal-ui/src/actions.ts index 85e6c40ff..60f1965d4 100644 --- a/portal-ui/src/actions.ts +++ b/portal-ui/src/actions.ts @@ -16,35 +16,43 @@ import { MENU_OPEN, + OPERATOR_MODE, SERVER_IS_LOADING, SERVER_NEEDS_RESTART, - USER_LOGGED + USER_LOGGED, } from "./types"; export function userLoggedIn(loggedIn: boolean) { return { type: USER_LOGGED, - logged: loggedIn + logged: loggedIn, + }; +} + +export function consoleOperatorMode(operatorMode: boolean) { + return { + type: OPERATOR_MODE, + operatorMode: operatorMode, }; } export function setMenuOpen(open: boolean) { return { type: MENU_OPEN, - open: open + open: open, }; } export function serverNeedsRestart(needsRestart: boolean) { return { type: SERVER_NEEDS_RESTART, - needsRestart: needsRestart + needsRestart: needsRestart, }; } export function serverIsLoading(isLoading: boolean) { return { type: SERVER_IS_LOADING, - isLoading: isLoading + isLoading: isLoading, }; } diff --git a/portal-ui/src/icons/minio_operator_logo.svg b/portal-ui/src/icons/minio_operator_logo.svg new file mode 100644 index 000000000..6d6fa453b --- /dev/null +++ b/portal-ui/src/icons/minio_operator_logo.svg @@ -0,0 +1,32 @@ + + + + + + + + + + + + + + + + + + + + + + diff --git a/portal-ui/src/reducer.ts b/portal-ui/src/reducer.ts index 4b4332654..9772c3d12 100644 --- a/portal-ui/src/reducer.ts +++ b/portal-ui/src/reducer.ts @@ -16,20 +16,22 @@ import { MENU_OPEN, + OPERATOR_MODE, SERVER_IS_LOADING, SERVER_NEEDS_RESTART, SystemActionTypes, SystemState, - USER_LOGGED + USER_LOGGED, } from "./types"; const initialState: SystemState = { loggedIn: false, + operatorMode: false, session: "", userName: "", sidebarOpen: true, serverNeedsRestart: false, - serverIsLoading: false + serverIsLoading: false, }; export function systemReducer( @@ -40,23 +42,28 @@ export function systemReducer( case USER_LOGGED: return { ...state, - loggedIn: action.logged + loggedIn: action.logged, + }; + case OPERATOR_MODE: + return { + ...state, + operatorMode: action.operatorMode, }; case MENU_OPEN: return { ...state, - sidebarOpen: action.open + sidebarOpen: action.open, }; case SERVER_NEEDS_RESTART: return { ...state, - serverNeedsRestart: action.needsRestart + serverNeedsRestart: action.needsRestart, }; case SERVER_IS_LOADING: return { ...state, - serverIsLoading: action.isLoading + serverIsLoading: action.isLoading, }; default: return state; diff --git a/portal-ui/src/screens/Console/Account/Account.tsx b/portal-ui/src/screens/Console/Account/Account.tsx index 4ea75506f..1a157d708 100644 --- a/portal-ui/src/screens/Console/Account/Account.tsx +++ b/portal-ui/src/screens/Console/Account/Account.tsx @@ -105,9 +105,10 @@ const Account = ({ classes }: IServiceAccountsProps) => { newServiceAccount, setNewServiceAccount, ] = useState(null); - const [changePasswordModalOpen, setChangePasswordModalOpen] = useState< - boolean - >(false); + const [ + changePasswordModalOpen, + setChangePasswordModalOpen, + ] = useState(false); useEffect(() => { fetchRecords(); diff --git a/portal-ui/src/screens/Console/Buckets/ViewBucket/ViewBucket.tsx b/portal-ui/src/screens/Console/Buckets/ViewBucket/ViewBucket.tsx index 3e7a4fdc5..effd2028c 100644 --- a/portal-ui/src/screens/Console/Buckets/ViewBucket/ViewBucket.tsx +++ b/portal-ui/src/screens/Console/Buckets/ViewBucket/ViewBucket.tsx @@ -217,9 +217,10 @@ const ViewBucket = ({ classes, match }: IViewBucketProps) => { ); const [curTab, setCurTab] = useState(0); const [addScreenOpen, setAddScreenOpen] = useState(false); - const [enableEncryptionScreenOpen, setEnableEncryptionScreenOpen] = useState< - boolean - >(false); + const [ + enableEncryptionScreenOpen, + setEnableEncryptionScreenOpen, + ] = useState(false); const [deleteOpen, setDeleteOpen] = useState(false); const [selectedEvent, setSelectedEvent] = useState(null); const [bucketSize, setBucketSize] = useState("0"); diff --git a/portal-ui/src/screens/Console/Menu/Menu.tsx b/portal-ui/src/screens/Console/Menu/Menu.tsx index 1bc478154..8141a3333 100644 --- a/portal-ui/src/screens/Console/Menu/Menu.tsx +++ b/portal-ui/src/screens/Console/Menu/Menu.tsx @@ -27,6 +27,7 @@ import { Divider, withStyles } from "@material-ui/core"; import { createStyles, Theme } from "@material-ui/core/styles"; import history from "../../../history"; import logo from "../../../icons/minio_console_logo.svg"; +import operator_logo from "../../../icons/minio_operator_logo.svg"; import { AppState } from "../../../store"; import { userLoggedIn } from "../../../actions"; import api from "../../../common/api"; @@ -149,6 +150,7 @@ const styles = (theme: Theme) => const mapState = (state: AppState) => ({ open: state.system.loggedIn, + operatorMode: state.system.operatorMode, }); const connector = connect(mapState, { userLoggedIn }); @@ -165,7 +167,7 @@ const menuStateBuilder = () => { return elements; }; -const Menu = ({ userLoggedIn, classes, pages }: IMenuProps) => { +const Menu = ({ userLoggedIn, classes, pages, operatorMode }: IMenuProps) => { const [menuOpen, setMenuOpen] = useState(menuStateBuilder()); const logout = () => { @@ -337,7 +339,7 @@ const Menu = ({ userLoggedIn, classes, pages }: IMenuProps) => { return (
- logo + logo
{menuGroups.map((groupMember, index) => { diff --git a/portal-ui/src/screens/Console/Menu/types.ts b/portal-ui/src/screens/Console/Menu/types.ts index c56427818..21494a82c 100644 --- a/portal-ui/src/screens/Console/Menu/types.ts +++ b/portal-ui/src/screens/Console/Menu/types.ts @@ -20,4 +20,5 @@ export interface IMenuProps { classes: any; userLoggedIn: typeof userLoggedIn; pages: string[]; + operatorMode: boolean; } diff --git a/portal-ui/src/types.ts b/portal-ui/src/types.ts index 90f74e045..4bb022c40 100644 --- a/portal-ui/src/types.ts +++ b/portal-ui/src/types.ts @@ -16,6 +16,7 @@ export interface SystemState { loggedIn: boolean; + operatorMode: boolean; sidebarOpen: boolean; session: string; userName: string; @@ -24,6 +25,7 @@ export interface SystemState { } export const USER_LOGGED = "USER_LOGGED"; +export const OPERATOR_MODE = "OPERATOR_MODE"; export const MENU_OPEN = "MENU_OPEN"; export const SERVER_NEEDS_RESTART = "SERVER_NEEDS_RESTART"; export const SERVER_IS_LOADING = "SERVER_IS_LOADING"; @@ -33,6 +35,11 @@ interface UserLoggedAction { logged: boolean; } +interface OperatorModeAction { + type: typeof OPERATOR_MODE; + operatorMode: boolean; +} + interface SetMenuOpenAction { type: typeof MENU_OPEN; open: boolean; @@ -50,6 +57,7 @@ interface ServerIsLoading { export type SystemActionTypes = | UserLoggedAction + | OperatorModeAction | SetMenuOpenAction | ServerNeedsRestartAction | ServerIsLoading;