From 1311b171f95e9c918c07737388b042803d3c9983 Mon Sep 17 00:00:00 2001
From: Prakash Senthil Vel <23444145+prakashsvmx@users.noreply.github.com>
Date: Wed, 15 Jun 2022 23:54:13 +0000
Subject: [PATCH] UX menu toggle and license badge icon (#2127)
---
portal-ui/src/icons/MenuToggleIcon.tsx | 38 +++++++++++
.../src/screens/Console/Menu/LicenseBadge.tsx | 67 +++++++++++++++++++
.../src/screens/Console/Menu/MenuItem.tsx | 1 +
.../src/screens/Console/Menu/MenuToggle.tsx | 4 +-
portal-ui/src/screens/Console/Menu/types.ts | 1 +
portal-ui/src/screens/Console/valid-routes.ts | 2 +
6 files changed, 111 insertions(+), 2 deletions(-)
create mode 100644 portal-ui/src/icons/MenuToggleIcon.tsx
create mode 100644 portal-ui/src/screens/Console/Menu/LicenseBadge.tsx
diff --git a/portal-ui/src/icons/MenuToggleIcon.tsx b/portal-ui/src/icons/MenuToggleIcon.tsx
new file mode 100644
index 0000000000..f695d28f52
--- /dev/null
+++ b/portal-ui/src/icons/MenuToggleIcon.tsx
@@ -0,0 +1,38 @@
+// This file is part of MinIO Console Server
+// Copyright (c) 2022 MinIO, Inc.
+//
+// This program is free software: you can redistribute it and/or modify
+// it under the terms of the GNU Affero General Public License as published by
+// the Free Software Foundation, either version 3 of the License, or
+// (at your option) any later version.
+//
+// This program is distributed in the hope that it will be useful,
+// but WITHOUT ANY WARRANTY; without even the implied warranty of
+// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+// GNU Affero General Public License for more details.
+//
+// You should have received a copy of the GNU Affero General Public License
+// along with this program. If not, see .
+
+import * as React from "react";
+import { SVGProps } from "react";
+
+const MenuToggleIcon = (props: SVGProps) => (
+
+);
+
+export default MenuToggleIcon;
diff --git a/portal-ui/src/screens/Console/Menu/LicenseBadge.tsx b/portal-ui/src/screens/Console/Menu/LicenseBadge.tsx
new file mode 100644
index 0000000000..d0511b9384
--- /dev/null
+++ b/portal-ui/src/screens/Console/Menu/LicenseBadge.tsx
@@ -0,0 +1,67 @@
+// This file is part of MinIO Console Server
+// Copyright (c) 2022 MinIO, Inc.
+//
+// This program is free software: you can redistribute it and/or modify
+// it under the terms of the GNU Affero General Public License as published by
+// the Free Software Foundation, either version 3 of the License, or
+// (at your option) any later version.
+//
+// This program is distributed in the hope that it will be useful,
+// but WITHOUT ANY WARRANTY; without even the implied warranty of
+// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+// GNU Affero General Public License for more details.
+//
+// You should have received a copy of the GNU Affero General Public License
+// along with this program. If not, see .
+
+import React from "react";
+import { useSelector } from "react-redux";
+import { AppState } from "../../../store";
+import { Box } from "@mui/material";
+import { CircleIcon } from "../../../icons";
+
+const LicenseBadge = () => {
+ const licenseInfo = useSelector(
+ (state: AppState) => state?.system?.licenseInfo
+ );
+
+ const { plan = "" } = licenseInfo || {};
+
+ if (plan) {
+ return null;
+ }
+
+ return (
+
+
+
+
+
+ );
+};
+
+export default LicenseBadge;
diff --git a/portal-ui/src/screens/Console/Menu/MenuItem.tsx b/portal-ui/src/screens/Console/Menu/MenuItem.tsx
index 3af3f4c287..48a1dbcbc0 100644
--- a/portal-ui/src/screens/Console/Menu/MenuItem.tsx
+++ b/portal-ui/src/screens/Console/Menu/MenuItem.tsx
@@ -150,6 +150,7 @@ const MenuItem = ({
...}>
+ {page.badge ? : null}
)}
diff --git a/portal-ui/src/screens/Console/Menu/MenuToggle.tsx b/portal-ui/src/screens/Console/Menu/MenuToggle.tsx
index efbf56bf12..730bb4b525 100644
--- a/portal-ui/src/screens/Console/Menu/MenuToggle.tsx
+++ b/portal-ui/src/screens/Console/Menu/MenuToggle.tsx
@@ -18,13 +18,13 @@ import React, { Fragment, Suspense, useEffect } from "react";
import OperatorLogo from "../../../icons/OperatorLogo";
import { LoginMinIOLogo, VersionIcon } from "../../../icons";
import { Box, IconButton } from "@mui/material";
-import { ChevronLeft } from "@mui/icons-material";
import MenuIcon from "@mui/icons-material/Menu";
import LicensedConsoleLogo from "../Common/Components/LicensedConsoleLogo";
import { useSelector } from "react-redux";
import useApi from "../Common/Hooks/useApi";
import { setLicenseInfo } from "../../../systemSlice";
import { AppState, useAppDispatch } from "../../../store";
+import MenuToggleIcon from "../../../icons/MenuToggleIcon";
type MenuToggleProps = {
isOpen: boolean;
@@ -151,7 +151,7 @@ const MenuToggle = ({ isOpen, onToggle }: MenuToggleProps) => {
}}
size="small"
>
- {isOpen ? : }
+ {isOpen ? : }
);
diff --git a/portal-ui/src/screens/Console/Menu/types.ts b/portal-ui/src/screens/Console/Menu/types.ts
index 5353fb591b..07179d4eaf 100644
--- a/portal-ui/src/screens/Console/Menu/types.ts
+++ b/portal-ui/src/screens/Console/Menu/types.ts
@@ -28,6 +28,7 @@ export interface IMenuItem {
fsHidden?: boolean;
customPermissionFnc?: any;
children?: IMenuItem[];
+ badge?: any;
}
export interface IRouteRule {
diff --git a/portal-ui/src/screens/Console/valid-routes.ts b/portal-ui/src/screens/Console/valid-routes.ts
index 1c8f374992..23027bcd65 100644
--- a/portal-ui/src/screens/Console/valid-routes.ts
+++ b/portal-ui/src/screens/Console/valid-routes.ts
@@ -55,6 +55,7 @@ import {
} from "../../icons";
import SettingsIcon from "../../icons/SettingsIcon";
import React from "react";
+import LicenseBadge from "./Menu/LicenseBadge";
export const validRoutes = (
features: string[] | null | undefined,
@@ -247,6 +248,7 @@ export const validRoutes = (
name: "License",
id: "license",
icon: LicenseIcon,
+ badge: LicenseBadge,
forceDisplay: true,
},
{