diff --git a/src/Components/Event/EventEditor.tsx b/src/Components/Event/EventEditor.tsx
index ac344c73..a3f41f19 100644
--- a/src/Components/Event/EventEditor.tsx
+++ b/src/Components/Event/EventEditor.tsx
@@ -3,6 +3,7 @@ import { useBoolean } from "ahooks";
import dayjs from "dayjs";
import ReactMarkdown from 'react-markdown';
import MdEditor from 'react-markdown-editor-lite';
+import { useAuth } from "react-oidc-context";
import remarkGfm from 'remark-gfm';
import remarkIns from 'remark-ins';
import { Dic, MDDecsPlugins, MDUpdatePlugins } from "~/Helpers/Entities";
@@ -24,16 +25,17 @@ import { useEditForm } from "./useEditForm";
*
* @author Aloento
* @since 1.0.0
- * @version 0.3.0
+ * @version 0.4.1
*/
export function EventEditor({ Event }: { Event: Models.IEvent }) {
const { State, Actions, Validation, OnSubmit, Loading } = useEditForm(Event);
const [open, { setTrue, setFalse }] = useBoolean();
+ const auth = useAuth();
return <>
- Edit
+ Edit
setFalse());
}}>
- Actions.setType(e.target.value as EventType)}
- invalid={!!Validation.type}
- helperText={Validation.type}
- >
- {Object.values(EventType).slice(2, 5).map((type, i) =>
-
- {type}
- )}
-
+ {
+ IsIncident(Event.Type) &&
+ Actions.setType(e.target.value as EventType)}
+ invalid={!!Validation.type}
+ helperText={Validation.type}
+ >
+ {Object.values(EventType).slice(2, 5).map((type, i) =>
+
+ {type}
+ )}
+
+ }
- {GetStatusList(State.type)
+ {GetStatusList(State.type, Event.Status, (auth.user?.profile as any)?.groups)
.map((status, i) =>
{status}
diff --git a/src/Components/Event/EventExtract.tsx b/src/Components/Event/EventExtract.tsx
index 44edf1bb..5253bf14 100644
--- a/src/Components/Event/EventExtract.tsx
+++ b/src/Components/Event/EventExtract.tsx
@@ -7,7 +7,7 @@ import { useEventExtract } from "./useEventExtract";
/**
* @author Aloento
* @since 1.0.0
- * @version 0.1.0
+ * @version 0.2.0
*/
export function EventExtract({ Event }: { Event: Models.IEvent }) {
const { services, setServices, valServices, OnSubmit, Loading } = useEventExtract(Event);
@@ -16,7 +16,7 @@ export function EventExtract({ Event }: { Event: Models.IEvent }) {
return <>
- Extract Services
+ Extract Services
{
- if (IsIncident(x.Type) && x.End) {
+ if (x.Status === EventStatus.PendingReview || (IsIncident(x.Type) && x.End)) {
return false;
}
diff --git a/src/Components/Home/ServiceItem.css b/src/Components/Home/ServiceItem.css
deleted file mode 100644
index 2c3a6958..00000000
--- a/src/Components/Home/ServiceItem.css
+++ /dev/null
@@ -1,9 +0,0 @@
-.blue-dot {
- position: absolute !important;
- top: -10%;
- right: -10%;
-}
-
-.with-dot {
- position: relative;
-}
diff --git a/src/Components/Home/ServiceItem.tsx b/src/Components/Home/ServiceItem.tsx
index 7e17fd0d..9904cf30 100644
--- a/src/Components/Home/ServiceItem.tsx
+++ b/src/Components/Home/ServiceItem.tsx
@@ -7,7 +7,7 @@ import { useStatus } from "~/Services/Status";
import { Models } from "~/Services/Status.Models";
import { EventStatus, EventType, IsIncident, IsOpenStatus } from "../Event/Enums";
import { Indicator } from "./Indicator";
-import "./ServiceItem.css";
+
import serviceSlugMap from "./serviceSlugMap.json";
interface IServiceItem {
diff --git a/src/Components/Layout/MobileMenu.tsx b/src/Components/Layout/MobileMenu.tsx
index 8dde1fad..cb39c415 100644
--- a/src/Components/Layout/MobileMenu.tsx
+++ b/src/Components/Layout/MobileMenu.tsx
@@ -1,14 +1,23 @@
import { ScaleIconActionMenu, ScaleTelekomMobileFlyoutCanvas, ScaleTelekomMobileMenu, ScaleTelekomMobileMenuItem, ScaleTelekomNavFlyout, ScaleTelekomNavItem } from "@telekom/scale-components-react";
+import { chain } from "lodash";
+import { useMemo } from "react";
import { useAuth } from "react-oidc-context";
-import { Authorized } from "../Auth/With";
+import { EventStatus } from "~/Components/Event/Enums";
+import { useStatus } from "~/Services/Status";
+import { Authorized, Roles } from "../Auth/With";
/**
* @author Aloento
* @since 1.0.0
- * @version 0.1.0
+ * @version 0.3.0
*/
export function MobileMenu() {
const auth = useAuth();
+ const { DB } = useStatus();
+
+ const pendingCount = useMemo(() => chain(DB.Events)
+ .filter(e => e.Status === EventStatus.PendingReview)
+ .value().length, [DB]);
return (
@@ -39,8 +48,17 @@ export function MobileMenu() {
New Event
+ {
+ return pendingCount > 0 &&
+ groups.some(g => g === Roles.Operators || g === Roles.Admins || g === Roles.GitHub);
+ }}>
+
+ Reviews: {pendingCount}
+
+
+
auth.signoutSilent()}>
- Logout {auth.user?.profile.name}
+ Logout {auth.user?.profile.name || auth.user?.profile.preferred_username}
diff --git a/src/Components/Layout/ProfileMenu.tsx b/src/Components/Layout/ProfileMenu.tsx
index 7d9ea999..3625a1ab 100644
--- a/src/Components/Layout/ProfileMenu.tsx
+++ b/src/Components/Layout/ProfileMenu.tsx
@@ -13,21 +13,17 @@ export function ProfileMenu() {
-
-
-
+
+
+
+
+
Hi, {auth.user?.profile.name || auth.user?.profile.preferred_username}
-
-
- New Event
-
-
-
auth.signoutSilent()}>
Logout
diff --git a/src/Components/Layout/TopNavBar.tsx b/src/Components/Layout/TopNavBar.tsx
index 2e4225d8..0103b513 100644
--- a/src/Components/Layout/TopNavBar.tsx
+++ b/src/Components/Layout/TopNavBar.tsx
@@ -1,5 +1,9 @@
import { ScaleTelekomHeader, ScaleTelekomNavItem, ScaleTelekomNavList } from "@telekom/scale-components-react";
+import { chain } from "lodash";
+import { useMemo } from "react";
+import { EventStatus } from "~/Components/Event/Enums";
import { Dic } from "~/Helpers/Entities";
+import { useStatus } from "~/Services/Status";
import { Authorized } from "../Auth/With";
import { MobileMenu } from "./MobileMenu";
import { NavItem } from "./NavItem";
@@ -8,9 +12,15 @@ import { ProfileMenu } from "./ProfileMenu";
/**
* @author Aloento
* @since 1.0.0
- * @version 0.1.0
+ * @version 0.3.0
*/
export function TopNavBar() {
+ const { DB } = useStatus();
+
+ const pendingCount = useMemo(() => chain(DB.Events)
+ .filter(e => e.Status === EventStatus.PendingReview)
+ .value().length, [DB]);
+
return (
+
+
+
+
+ {pendingCount > 0 && }
+
diff --git a/src/Components/New/NewForm.tsx b/src/Components/New/NewForm.tsx
index 0e5d7094..fa81d3df 100644
--- a/src/Components/New/NewForm.tsx
+++ b/src/Components/New/NewForm.tsx
@@ -3,10 +3,12 @@ import dayjs from "dayjs";
import { orderBy } from "lodash";
import ReactMarkdown from 'react-markdown';
import MdEditor from 'react-markdown-editor-lite';
+import { useAuth } from "react-oidc-context";
import remarkGfm from 'remark-gfm';
import remarkIns from 'remark-ins';
import { Dic, MDDecsPlugins } from "~/Helpers/Entities";
import { useStatus } from "~/Services/Status";
+import { Roles } from "../Auth/With";
import { EventType, IsIncident } from "../Event/Enums";
import { useNewForm } from "./useNewForm";
@@ -25,11 +27,19 @@ import { useNewForm } from "./useNewForm";
*
* @author Aloento
* @since 1.0.0
- * @version 0.2.0
+ * @version 0.2.1
*/
export function NewForm() {
const { DB } = useStatus();
const { State, Actions, Validation, OnSubmit, Loading } = useNewForm();
+ const auth = useAuth();
+
+ const groups: string[] = (auth.user?.profile as any)?.groups || [];
+ const isCreatorOnly = !groups.includes(Roles.Operators) && !groups.includes(Roles.Admins) && !groups.includes(Roles.GitHub);
+
+ const availableTypes = isCreatorOnly
+ ? [EventType.Maintenance]
+ : Object.values(EventType).slice(1);
return (
<>
@@ -48,8 +58,9 @@ export function NewForm() {
onScale-change={(e) => Actions.setType(e.target.value as EventType)}
invalid={!!Validation.type}
helperText={Validation.type}
+ disabled={isCreatorOnly}
>
- {Object.values(EventType).slice(1).map((type, i) =>
+ {availableTypes.map((type, i) =>
{type}
)}
diff --git a/src/Pages/Home.tsx b/src/Pages/Home.tsx
index be8455f0..78c06df6 100644
--- a/src/Pages/Home.tsx
+++ b/src/Pages/Home.tsx
@@ -6,7 +6,8 @@ import { chain } from "lodash";
import { useEffect, useMemo, useState } from "react";
import { Helmet } from "react-helmet";
import { BehaviorSubject, Subject } from "rxjs";
-import { EventType, IsIncident, IsOpenStatus } from "~/Components/Event/Enums";
+import { Authorized, Roles } from "~/Components/Auth/With";
+import { EventStatus, EventType, IsIncident, IsOpenStatus } from "~/Components/Event/Enums";
import { EventGrid } from "~/Components/Home/EventGrid";
import "~/Components/Home/Home.css";
import { Indicator } from "~/Components/Home/Indicator";
@@ -34,7 +35,7 @@ const log = new Logger("Home");
* @component
* @author Aloento
* @since 1.0.0
- * @version 0.2.0
+ * @version 0.3.0
*/
export function Home() {
const { DB } = useStatus();
@@ -90,12 +91,32 @@ export function Home() {
: `${abnormalCount} components have issues, but don't worry, we are working on it.`
: "All Systems Operational";
+ const pendingCount = useMemo(() => {
+ const events = chain(DB.Events)
+ .filter(e => e.Status === EventStatus.PendingReview)
+ .value();
+
+ log.debug("Pending Maintenance", events);
+ return events.length;
+ }, [DB]);
+
return (
<>
{Dic.Name} {Dic.Prod}
+ {
+ return pendingCount > 0 &&
+ groups.some(g => g === Roles.Operators || g === Roles.Admins || g === Roles.GitHub);
+ }}>
+
+
+
-
+
-