Merge pull request #188 from KelvinTegelaar/dev

pull[bot] · web-flow · commit c803c23620d1 · 2025-03-23T09:17:06.000Z
[pull] dev from KelvinTegelaar:dev
diff --git a/src/components/CippComponents/CippGdapActions.jsx b/src/components/CippComponents/CippGdapActions.jsx
@@ -0,0 +1,97 @@
+import { EyeIcon } from "@heroicons/react/24/outline";
+import {
+  AdminPanelSettings,
+  GppBad,
+  HourglassBottom,
+  LockReset,
+  OpenInNew,
+  PlayArrow,
+} from "@mui/icons-material";
+import { Alert, Typography } from "@mui/material";
+
+export const CippGdapActions = () => [
+  {
+    label: "View Relationship",
+    link: "/tenant/gdap-management/relationships/relationship?id=[id]",
+    color: "primary",
+    icon: <EyeIcon />,
+  },
+  {
+    label: "Start Onboarding",
+    link: "/tenant/gdap-management/onboarding/start?id=[id]",
+    color: "primary",
+    icon: <PlayArrow />,
+    showInActionsMenu: true,
+  },
+  {
+    label: "Open Relationship in Partner Center",
+    link: "https://partner.microsoft.com/en-us/dashboard/commerce2/customers/[customer.tenantId]/adminrelationships/[id]",
+    color: "info",
+    icon: <OpenInNew />,
+    showInActionsMenu: true,
+  },
+  {
+    label: "Enable automatic extension",
+    type: "GET",
+    url: "/api/ExecAutoExtendGDAP",
+    data: { ID: "id" },
+    confirmText: "Are you sure you want to enable auto-extend for this relationship?",
+    color: "info",
+    icon: <HourglassBottom />,
+  },
+  {
+    label: "Remove Global Administrator from Relationship",
+    type: "GET",
+    url: "/api/ExecGDAPRemoveGArole",
+    data: { GDAPID: "id" },
+    confirmText: "Are you sure you want to remove Global Administrator from this relationship?",
+    color: "danger",
+    icon: <AdminPanelSettings />,
+  },
+  {
+    label: "Reset Group Mappings",
+    type: "POST",
+    url: "/api/ExecGDAPAccessAssignment",
+    icon: <LockReset />,
+    data: { Id: "id", Action: "ResetMappings" },
+    fields: [
+      {
+        name: "RoleTemplateId",
+        label: "Role Template",
+        placeholder: "Select a role template to apply to this relationship.",
+        type: "select",
+        api: {
+          url: "/api/ExecGDAPRoleTemplate",
+          queryKey: "GDAPRoleTemplate",
+          dataKey: "Results",
+          valueField: "TemplateId",
+          labelField: "TemplateId",
+          showRefresh: true,
+        },
+      },
+    ],
+    confirmText: (
+      <>
+        <Typography variant="body1">
+          Are you sure you want to reset the group mappings for this relationship?
+        </Typography>
+        <Alert severity="warning">
+          This action will remove all existing group mappings and apply the selected role template
+          to the relationship. Use this to fix incorrect group mappings or permission overlap issues
+          (e.g removing AdminAgents or HelpdeskAgents).
+        </Alert>
+      </>
+    ),
+  },
+  {
+    label: "Terminate Relationship",
+    type: "GET",
+    url: "/api/ExecDeleteGDAPRelationship",
+    data: { GDAPID: "id" },
+    confirmText: "Are you sure you want to terminate this relationship?",
+    color: "error",
+    icon: <GppBad />,
+  },
+];
+
+export default CippGdapActions;
diff --git a/src/components/CippTable/CippDataTable.js b/src/components/CippTable/CippDataTable.js
@@ -53,6 +53,7 @@ export const CippDataTable = (props) => {
     incorrectDataMessage = "Data not in correct format",
     onChange,
     filters,
+    maxHeightOffset = "380px",
   } = props;
   const [columnVisibility, setColumnVisibility] = useState(initialColumnVisibility);
   const [configuredSimpleColumns, setConfiguredSimpleColumns] = useState(simpleColumns);
@@ -156,7 +157,15 @@ export const CippDataTable = (props) => {
 
   // Apply the modeInfo directly
   const [modeInfo] = useState(
-    utilTableMode(columnVisibility, simple, actions, configuredSimpleColumns, offCanvas, onChange)
+    utilTableMode(
+      columnVisibility,
+      simple,
+      actions,
+      configuredSimpleColumns,
+      offCanvas,
+      onChange,
+      maxHeightOffset
+    )
   );
   //create memoized version of usedColumns, and usedData
   const memoizedColumns = useMemo(() => usedColumns, [usedColumns]);
diff --git a/src/components/CippTable/util-tablemode.js b/src/components/CippTable/util-tablemode.js
@@ -6,7 +6,8 @@ export const utilTableMode = (
   actions,
   simpleColumns,
   offCanvas,
-  onChange
+  onChange,
+  maxHeightOffset = "380px"
 ) => {
   const settings = useSettings();
   if (mode === true) {
@@ -20,7 +21,7 @@ export const utilTableMode = (
         rowsPerPageOptions: [25, 50, 100, 250, 500],
       },
       muiTableContainerProps: {
-        sx: { maxHeight: `calc(100vh - 380px)` },
+        sx: { maxHeight: `calc(100vh - ${maxHeightOffset})` },
       },
       initialState: {
         columnOrder: [...simpleColumns],
@@ -57,7 +58,7 @@ export const utilTableMode = (
         rowsPerPageOptions: [25, 50, 100, 250, 500],
       },
       muiTableContainerProps: {
-        sx: { maxHeight: `calc(100vh - 380px)` },
+        sx: { maxHeight: `calc(100vh - ${maxHeightOffset})` },
       },
       displayColumnDefOptions: {
         "mrt-row-actions": {
diff --git a/src/components/actions-menu.js b/src/components/actions-menu.js
@@ -57,7 +57,7 @@ export const ActionsMenu = (props) => {
         }}
       >
         {actions
-          ?.filter((action) => !action.link)
+          ?.filter((action) => !action.link || action.showInActionsMenu)
           .map((action, index) => (
             <MenuItem
               disabled={handleActionDisabled(data, action)}
diff --git a/src/layouts/HeaderedTabbedLayout.jsx b/src/layouts/HeaderedTabbedLayout.jsx
@@ -18,7 +18,16 @@ import {
 import { ActionsMenu } from "/src/components/actions-menu";
 
 export const HeaderedTabbedLayout = (props) => {
-  const { children, tabOptions, title, subtitle, actions, actionsData, isFetching = false } = props;
+  const {
+    children,
+    tabOptions,
+    title,
+    subtitle,
+    actions,
+    actionsData,
+    isFetching = false,
+    backUrl,
+  } = props;
 
   const router = useRouter();
   const pathname = usePathname();
@@ -53,7 +62,7 @@ export const HeaderedTabbedLayout = (props) => {
             <div>
               <Button
                 color="inherit"
-                onClick={() => router.back()}
+                onClick={() => (backUrl ? router.push(backUrl) : router.back())}
                 startIcon={
                   <SvgIcon fontSize="small">
                     <ArrowLeftIcon />
@@ -108,7 +117,15 @@ export const HeaderedTabbedLayout = (props) => {
               <Divider />
             </div>
           </Stack>
-          {children}
+          <Box
+            sx={{
+              flexGrow: 1,
+              overflow: "auto",
+              height: "calc(100vh - 400px)",
+            }}
+          >
+            {children}
+          </Box>
         </Stack>
       </Container>
     </Box>
diff --git a/src/pages/tenant/gdap-management/relationships/index.js b/src/pages/tenant/gdap-management/relationships/index.js
@@ -2,64 +2,11 @@ import { TabbedLayout } from "/src/layouts/TabbedLayout";
 import { Layout as DashboardLayout } from "/src/layouts/index.js";
 import tabOptions from "../tabOptions";
 import CippTablePage from "/src/components/CippComponents/CippTablePage";
-import { EyeIcon } from "@heroicons/react/24/outline";
-import {
-  AdminPanelSettings,
-  GppBad,
-  HourglassBottom,
-  OpenInNew,
-  PlayArrow,
-} from "@mui/icons-material";
+import CippGdapActions from "/src/components/CippComponents/CippGdapActions";
 
 const pageTitle = "GDAP Relationships";
 
-const actions = [
-  {
-    label: "View Relationship",
-    link: "/tenant/gdap-management/relationships/relationship?id=[id]",
-    color: "primary",
-    icon: <EyeIcon />,
-  },
-  {
-    label: "Start Onboarding",
-    link: "/tenant/gdap-management/onboarding/start?id=[id]",
-    color: "primary",
-    icon: <PlayArrow />,
-  },
-  {
-    label: "Open Relationship in Partner Center",
-    link: "https://partner.microsoft.com/en-us/dashboard/commerce2/customers/[customer.tenantId]/adminrelationships/[id]",
-    color: "info",
-    icon: <OpenInNew />,
-  },
-  {
-    label: "Enable automatic extension",
-    type: "GET",
-    url: "/api/ExecAutoExtendGDAP",
-    data: { ID: "id" },
-    confirmText: "Are you sure you want to enable auto-extend for this relationship?",
-    color: "info",
-    icon: <HourglassBottom />,
-  },
-  {
-    label: "Remove Global Administrator from Relationship",
-    type: "GET",
-    url: "/api/ExecGDAPRemoveGArole",
-    data: { GDAPID: "id" },
-    confirmText: "Are you sure you want to remove Global Administrator from this relationship?",
-    color: "danger",
-    icon: <AdminPanelSettings />,
-  },
-  {
-    label: "Terminate Relationship",
-    type: "GET",
-    url: "/api/ExecDeleteGDAPRelationship",
-    data: { GDAPID: "id" },
-    confirmText: "Are you sure you want to terminate this relationship?",
-    color: "error",
-    icon: <GppBad />,
-  },
-];
+const actions = CippGdapActions();
 
 const simpleColumns = [
   "customer.displayName",
diff --git a/src/pages/tenant/gdap-management/relationships/relationship/index.js b/src/pages/tenant/gdap-management/relationships/relationship/index.js
@@ -15,11 +15,13 @@ import CIPPDefaultGDAPRoles from "/src/data/CIPPDefaultGDAPRoles.json";
 import { CippCopyToClipBoard } from "../../../../../components/CippComponents/CippCopyToClipboard";
 import { Schedule } from "@mui/icons-material";
 import { useEffect, useState } from "react";
+import CippGdapActions from "../../../../../components/CippComponents/CippGdapActions";
 
 const Page = () => {
   const router = useRouter();
   const { id } = router.query;
   const [relationshipProperties, setRelationshipProperties] = useState([]);
+  const [relationshipData, setRelationshipData] = useState({});
 
   const relationshipRequest = ApiGetCall({
     url: `/api/ListGraphRequest?Endpoint=tenantRelationships/delegatedAdminRelationships/${id}`,
@@ -67,7 +69,7 @@ const Page = () => {
   useEffect(() => {
     if (relationshipRequest.isSuccess) {
       const data = relationshipRequest?.data?.Results?.[0];
-
+      setRelationshipData(data);
       var properties = [
         {
           label: "Customer",
@@ -135,6 +137,9 @@ const Page = () => {
       title={title}
       subtitle={subtitle}
       isFetching={relationshipRequest.isLoading}
+      actions={CippGdapActions()}
+      actionsData={relationshipData}
+      backUrl="/tenant/gdap-management/relationships"
     >
       {relationshipRequest.isLoading && <CippFormSkeleton layout={[2, 1, 2, 2]} />}
       {relationshipRequest.isSuccess && (
diff --git a/src/pages/tenant/gdap-management/relationships/relationship/mappings.js b/src/pages/tenant/gdap-management/relationships/relationship/mappings.js
@@ -1,19 +1,10 @@
 import { Layout as DashboardLayout } from "/src/layouts/index.js";
-import { useSettings } from "/src/hooks/use-settings";
 import { useRouter } from "next/router";
 import { ApiGetCall } from "/src/api/ApiCall";
-import CippFormSkeleton from "/src/components/CippFormPages/CippFormSkeleton";
 import { HeaderedTabbedLayout } from "/src/layouts/HeaderedTabbedLayout";
 import tabOptions from "./tabOptions.json";
-import { Box, Grid, Stack } from "@mui/system";
 import { CippTimeAgo } from "../../../../../components/CippComponents/CippTimeAgo";
-import { getCippTranslation } from "../../../../../utils/get-cipp-translation";
-import { CippPropertyListCard } from "../../../../../components/CippCards/CippPropertyListCard";
-import { getCippFormatting } from "../../../../../utils/get-cipp-formatting";
 import { CippDataTable } from "../../../../../components/CippTable/CippDataTable";
-import { Alert, Divider, Link, Typography } from "@mui/material";
-import CIPPDefaultGDAPRoles from "/src/data/CIPPDefaultGDAPRoles.json";
-import { CippCopyToClipBoard } from "../../../../../components/CippComponents/CippCopyToClipboard";
 import { Schedule } from "@mui/icons-material";
 
 const Page = () => {
@@ -56,6 +47,7 @@ const Page = () => {
       title={title}
       subtitle={subtitle}
       isFetching={relationshipRequest.isLoading}
+      backUrl="/tenant/gdap-management/relationships"
     >
       {id && (
         <CippDataTable
@@ -67,6 +59,7 @@ const Page = () => {
             queryKey: `AccessAssignments-${id}`,
           }}
           simpleColumns={["group.displayName", "status", "createdDateTime", "roles", "members"]}
+          maxHeightOffset="550px"
         />
       )}
     </HeaderedTabbedLayout>
diff --git a/src/pages/tenant/gdap-management/roles/add.js b/src/pages/tenant/gdap-management/roles/add.js

Original file line number	Diff line number	Diff line change
`@@ -57,7 +57,7 @@ export const ActionsMenu = (props) => {`
`57`	`57`	`}}`
`58`	`58`	`>`
`59`	`59`	`{actions`
`60`		`- ?.filter((action) => !action.link)`
	`60`	`+ ?.filter((action) => !action.link \|\| action.showInActionsMenu)`
`61`	`61`	`.map((action, index) => (`
`62`	`62`	`<MenuItem`
`63`	`63`	`disabled={handleActionDisabled(data, action)}`