From aff91489a98aa71e7ea7cdfad5d41203604e14aa Mon Sep 17 00:00:00 2001
From: John Duprey <jwd@johnwduprey.com>
Date: Tue, 13 Aug 2024 22:47:48 -0400
Subject: [PATCH 01/18] Add processor function support

Expects CIPP-API-Processor as folder name
---
 Tools/Start-CippDevEmulators.ps1 | 12 ++++++++++--
 1 file changed, 10 insertions(+), 2 deletions(-)

diff --git a/Tools/Start-CippDevEmulators.ps1 b/Tools/Start-CippDevEmulators.ps1
index b4f6ca696ffe..bde7511caac1 100644
--- a/Tools/Start-CippDevEmulators.ps1
+++ b/Tools/Start-CippDevEmulators.ps1
@@ -1,4 +1,12 @@
-Write-Host "Starting CIPP Dev Emulators"
+Write-Host 'Starting CIPP Dev Emulators'
+Get-Process node -ErrorAction SilentlyContinue | Stop-Process -ErrorAction SilentlyContinue
 $Path = (Get-Item $PSScriptRoot).Parent.Parent.FullName
-wt --title CIPP`; new-tab --title 'Azurite' -d $Path pwsh -c azurite`; new-tab --title 'FunctionApp' -d $Path\CIPP-API pwsh -c func start`; new-tab --title 'CIPP Frontend' -d $Path\CIPP pwsh -c npm run start`; new-tab --title 'SWA' -d $Path\CIPP pwsh -c npm run start-swa
+
+$Process = Read-Host -Prompt 'Start Process Function (y/N)?'
+
+if ($Process -eq 'y') {
+    wt --title CIPP`; new-tab --title 'Azurite' -d $Path pwsh -c azurite`; new-tab --title 'FunctionApp' -d $Path\CIPP-API pwsh -c func start`; new-tab --title 'CIPP Frontend' -d $Path\CIPP pwsh -c npm run start`; new-tab --title 'SWA' -d $Path\CIPP pwsh -c npm run start-swa`; new-tab --title 'CIPP-API-Processor' -d $Path\CIPP-API-Processor pwsh -c func start --port 7072
+} else {
+    wt --title CIPP`; new-tab --title 'Azurite' -d $Path pwsh -c azurite`; new-tab --title 'FunctionApp' -d $Path\CIPP-API pwsh -c func start`; new-tab --title 'CIPP Frontend' -d $Path\CIPP pwsh -c npm run start`; new-tab --title 'SWA' -d $Path\CIPP pwsh -c npm run start-swa
+}
 

From a7308f45f15892dba954ba834c744d15e92f788e Mon Sep 17 00:00:00 2001
From: John Duprey <jwd@johnwduprey.com>
Date: Tue, 13 Aug 2024 22:50:29 -0400
Subject: [PATCH 02/18] Add extension call to action support

---
 src/views/cipp/Extensions.jsx | 7 +++++++
 1 file changed, 7 insertions(+)

diff --git a/src/views/cipp/Extensions.jsx b/src/views/cipp/Extensions.jsx
index 5923599a6f66..84841ec3ec18 100644
--- a/src/views/cipp/Extensions.jsx
+++ b/src/views/cipp/Extensions.jsx
@@ -22,6 +22,7 @@ import CippButtonCard from 'src/components/contentcards/CippButtonCard.jsx'
 import { RFFCFormInput, RFFCFormSwitch } from 'src/components/forms/RFFComponents.jsx'
 import { Form } from 'react-final-form'
 import ExtensionMappings from 'src/views/cipp/ExtensionMappings.jsx'
+import ReactHtmlParser from 'react-html-parser'
 
 export default function CIPPExtensions() {
   const [listBackend, listBackendResult] = useLazyGenericGetRequestQuery()
@@ -121,6 +122,12 @@ export default function CIPPExtensions() {
                       clients.
                     </CippCallout>
                   )}
+                  {integration?.callToAction && (
+                    <CippCallout color="info">
+                      <FontAwesomeIcon icon="info-circle" className="me-2" />
+                      {ReactHtmlParser(integration.callToAction)}
+                    </CippCallout>
+                  )}
                   <CippButtonCard
                     title={integration.name}
                     titleType="big"

From 2cc024f083aac893e1bdc2f72d87d5bce6f6a8b9 Mon Sep 17 00:00:00 2001
From: John Duprey <jwd@johnwduprey.com>
Date: Tue, 13 Aug 2024 23:24:57 -0400
Subject: [PATCH 03/18] CIPP-SAM API Permissions

- Add new components
  - SettingsAppPermissions
  - CippAppPermissionBuilder
- Modify CippButtonCard, make isFetching not required and default false
- Modify CellTip & CellGenericFormat, allow for wrapping text
- Add onCreateOption to Creatable
- CSS tweaks
  - Make adjust CippTable filter z-index to not conflict with select search
- Add CIPP-SAM permission SuperAdmin section
---
 .../contentcards/CippButtonCard.jsx           |   4 +-
 src/components/forms/RFFComponents.jsx        |   6 +-
 src/components/tables/CellGenericFormat.jsx   |  12 +-
 src/components/tables/CellTip.jsx             |   4 +-
 .../utilities/CippAppPermissionBuilder.jsx    | 585 ++++++++++++++++++
 src/scss/_custom.scss                         |   6 +
 src/scss/_themes.scss                         |   1 +
 .../cipp/app-settings/SettingsSuperAdmin.jsx  | 212 +++++--
 .../components/SettingsAppPermissions.jsx     |  65 ++
 9 files changed, 821 insertions(+), 74 deletions(-)
 create mode 100644 src/components/utilities/CippAppPermissionBuilder.jsx
 create mode 100644 src/views/cipp/app-settings/components/SettingsAppPermissions.jsx

diff --git a/src/components/contentcards/CippButtonCard.jsx b/src/components/contentcards/CippButtonCard.jsx
index 8e74d5470693..8e280ab067d3 100644
--- a/src/components/contentcards/CippButtonCard.jsx
+++ b/src/components/contentcards/CippButtonCard.jsx
@@ -8,7 +8,7 @@ export default function CippButtonCard({
   titleType = 'normal',
   CardButton,
   children,
-  isFetching,
+  isFetching = false,
   className = 'h-100',
 }) {
   return (
@@ -32,6 +32,6 @@ CippButtonCard.propTypes = {
   titleType: PropTypes.string,
   CardButton: PropTypes.element.isRequired,
   children: PropTypes.element.isRequired,
-  isFetching: PropTypes.bool.isRequired,
+  isFetching: PropTypes.bool,
   className: PropTypes.string,
 }
diff --git a/src/components/forms/RFFComponents.jsx b/src/components/forms/RFFComponents.jsx
index 14163a033d62..30e096a71aa8 100644
--- a/src/components/forms/RFFComponents.jsx
+++ b/src/components/forms/RFFComponents.jsx
@@ -516,6 +516,7 @@ export const RFFSelectSearch = ({
   retainInput = true,
   isLoading = false,
   allowCreate = false,
+  onCreateOption,
   refreshFunction,
   ...props
 }) => {
@@ -589,7 +590,7 @@ export const RFFSelectSearch = ({
               )}
             </CFormLabel>
             {allowCreate ? (
-              <Creatable {...selectProps} isClearable={true} />
+              <Creatable {...selectProps} isClearable={true} onCreateOption={onCreateOption} />
             ) : (
               <Select {...selectProps} isClearable={!onChange} />
             )}
@@ -612,6 +613,9 @@ RFFSelectSearch.propTypes = {
   onInputChange: PropTypes.func,
   isLoading: PropTypes.bool,
   refreshFunction: PropTypes.func,
+  allowCreate: PropTypes.bool,
+  onCreateOption: PropTypes.func,
+  retainInput: PropTypes.bool,
   values: PropTypes.arrayOf(PropTypes.shape({ value: PropTypes.string, name: PropTypes.string }))
     .isRequired,
 }
diff --git a/src/components/tables/CellGenericFormat.jsx b/src/components/tables/CellGenericFormat.jsx
index 465a7dd25f37..27f06c04906a 100644
--- a/src/components/tables/CellGenericFormat.jsx
+++ b/src/components/tables/CellGenericFormat.jsx
@@ -24,13 +24,17 @@ function nocolour(iscolourless, content) {
 export function CellTip(cell, overflow = false) {
   return (
     <CTooltip content={String(cell)}>
-      <div className="celltip-content-nowrap">{String(cell)}</div>
+      {overflow ? (
+        <div className="celltip-content">{String(cell)}</div>
+      ) : (
+        <div className="celltip-content-nowrap">{String(cell)}</div>
+      )}
     </CTooltip>
   )
 }
 
 export const cellGenericFormatter =
-  ({ warning = false, reverse = false, colourless = true, noDataIsFalse } = {}) =>
+  ({ warning = false, reverse = false, colourless = true, noDataIsFalse, wrap = false } = {}) =>
   // eslint-disable-next-line react/display-name
   (row, index, column, id) => {
     const cell = column.selector(row)
@@ -51,6 +55,10 @@ export const cellGenericFormatter =
           </a>
         )
       }
+
+      if (wrap) {
+        return CellTip(cell, true)
+      }
       return CellTip(cell)
     }
     if (typeof cell === 'number') {
diff --git a/src/components/tables/CellTip.jsx b/src/components/tables/CellTip.jsx
index 399d504fc2eb..e6f5c403b968 100644
--- a/src/components/tables/CellTip.jsx
+++ b/src/components/tables/CellTip.jsx
@@ -23,11 +23,11 @@ export const CellTipButton = (value, display) => {
   )
 }
 
-export const CellTip = (value, overflow = false) => {
+export const CellTip = (value, wrap = false) => {
   if (!value) {
     return <div />
   }
-  if (!overflow) {
+  if (!wrap) {
     return (
       <CTooltip content={value}>
         <div className="celltip-content-nowrap">{String(value)}</div>
diff --git a/src/components/utilities/CippAppPermissionBuilder.jsx b/src/components/utilities/CippAppPermissionBuilder.jsx
new file mode 100644
index 000000000000..8e8051955097
--- /dev/null
+++ b/src/components/utilities/CippAppPermissionBuilder.jsx
@@ -0,0 +1,585 @@
+import React, { useEffect, useRef, useState } from 'react'
+import {
+  CButton,
+  CCallout,
+  CCol,
+  CForm,
+  CRow,
+  CAccordion,
+  CAccordionHeader,
+  CAccordionBody,
+  CAccordionItem,
+  CTooltip,
+} from '@coreui/react'
+import { Field, Form, FormSpy } from 'react-final-form'
+import { RFFCFormRadioList, RFFSelectSearch } from 'src/components/forms'
+import { useGenericGetRequestQuery, useLazyGenericPostRequestQuery } from 'src/store/api/app'
+import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
+import { TenantSelectorMultiple, ModalService, CippOffcanvas } from 'src/components/utilities'
+import PropTypes from 'prop-types'
+import { OnChange } from 'react-final-form-listeners'
+import { useListTenantsQuery } from 'src/store/api/tenants'
+import { OffcanvasListSection } from 'src/components/utilities/CippListOffcanvas'
+import CippButtonCard from 'src/components/contentcards/CippButtonCard'
+import { CippTable } from '../tables'
+import { Row } from 'react-bootstrap'
+import { cellGenericFormatter } from '../tables/CellGenericFormat'
+import Skeleton from 'react-loading-skeleton'
+import { uniqueId } from 'lodash-es'
+
+const CippAppPermissionBuilder = ({ onSubmit, currentPermissions = {}, isSubmitting }) => {
+  const [selectedApp, setSelectedApp] = useState([])
+  const [permissionsImported, setPermissionsImported] = useState(false)
+  const [newPermissions, setNewPermissions] = useState({})
+
+  const {
+    data: servicePrincipals = [],
+    isFetching: spFetching,
+    isSuccess: spSuccess,
+    isUninitialized: spUninitialized,
+    refetch: refetchSpList,
+  } = useGenericGetRequestQuery({
+    path: 'api/ExecServicePrincipals',
+  })
+
+  const removeServicePrincipal = (appId) => {
+    var servicePrincipal = selectedApp.find((sp) => sp?.appId === appId)
+    var newServicePrincipals = selectedApp.filter((sp) => sp?.appId !== appId)
+
+    ModalService.confirm({
+      title: 'Remove Service Principal',
+      body: `Are you sure you want to remove ${servicePrincipal.displayName}?`,
+      onConfirm: () => {
+        setSelectedApp(newServicePrincipals)
+      },
+    })
+  }
+
+  const confirmReset = () => {
+    ModalService.confirm({
+      title: 'Reset to Default',
+      body: 'Are you sure you want to reset all permissions to default?',
+      onConfirm: () => {
+        setSelectedApp([])
+        setPermissionsImported(false)
+      },
+    })
+  }
+
+  const handleSubmit = (values) => {
+    if (onSubmit) {
+      var postBody = {
+        Permissions: newPermissions,
+      }
+      onSubmit(postBody)
+    }
+  }
+
+  const addPermissionRow = (servicePrincipal, permissionType, permission) => {
+    var updatedPermissions = JSON.parse(JSON.stringify(newPermissions))
+    var currentPermission = updatedPermissions?.Permissions[servicePrincipal][permissionType]
+    var newPermission = []
+    if (currentPermission) {
+      currentPermission.map((perm) => {
+        if (perm.id.lower() !== permission.value.lower()) {
+          newPermission.push(perm)
+        }
+      })
+    }
+    newPermission.push({ id: permission.value, value: permission.label })
+
+    updatedPermissions.Permissions[servicePrincipal][permissionType] = newPermission
+    setNewPermissions(updatedPermissions)
+  }
+
+  const removePermissionRow = (servicePrincipal, permissionType, permissionId, permissionValue) => {
+    // modal confirm
+    ModalService.confirm({
+      title: 'Remove Permission',
+      body: `Are you sure you want to remove the permission: ${permissionValue}?`,
+      onConfirm: () => {
+        var updatedPermissions = JSON.parse(JSON.stringify(newPermissions))
+        var currentPermission = updatedPermissions?.Permissions[servicePrincipal][permissionType]
+        var newPermission = []
+        if (currentPermission) {
+          currentPermission.map((perm) => {
+            if (perm.id !== permissionId) {
+              newPermission.push(perm)
+            }
+          })
+        }
+        updatedPermissions.Permissions[servicePrincipal][permissionType] = newPermission
+        setNewPermissions(updatedPermissions)
+      },
+    })
+  }
+
+  useEffect(() => {
+    try {
+      var initialAppIds = Object.keys(currentPermissions?.Permissions)
+    } catch {
+      initialAppIds = []
+    }
+
+    if (spSuccess && selectedApp.length == 0 && initialAppIds.length == 0) {
+      var microsoftGraph = servicePrincipals?.Results?.find(
+        (sp) => sp?.appId === '00000003-0000-0000-c000-000000000000',
+      )
+      setSelectedApp([microsoftGraph])
+    } else if (spSuccess && initialAppIds.length > 0 && permissionsImported == false) {
+      var newApps = []
+      initialAppIds?.map((appId) => {
+        var newSp = servicePrincipals?.Results?.find((sp) => sp.appId === appId)
+        if (newSp) {
+          newApps.push(newSp)
+        }
+      })
+      newApps = newApps.sort((a, b) => {
+        return a.displayName.localeCompare(b.displayName)
+      })
+      setSelectedApp(newApps)
+      setNewPermissions(currentPermissions)
+      setPermissionsImported(true)
+    }
+  }, [
+    currentPermissions,
+    permissionsImported,
+    spSuccess,
+    selectedApp,
+    servicePrincipals,
+    setSelectedApp,
+    setPermissionsImported,
+    setNewPermissions,
+  ])
+
+  const ApiPermissionRow = ({ servicePrincipal = null }) => {
+    const [offcanvasVisible, setOffcanvasVisible] = useState(false)
+    return (
+      <>
+        {spSuccess && servicePrincipal !== null && (
+          <CRow>
+            <CCol xl={12}>
+              <CRow>
+                <CCol xl={11}>
+                  <p className="me-1">
+                    Manage the permissions for the {servicePrincipal.displayName}.
+                  </p>
+                </CCol>
+                <CCol xl={1} className="mx-auto">
+                  <CTooltip
+                    content={
+                      servicePrincipal.appId === '00000003-0000-0000-c000-000000000000'
+                        ? "You can't remove Microsoft Graph"
+                        : 'Remove Service Principal'
+                    }
+                  >
+                    <div>
+                      <CButton
+                        onClick={() => {
+                          removeServicePrincipal(servicePrincipal.appId)
+                        }}
+                        disabled={servicePrincipal.appId === '00000003-0000-0000-c000-000000000000'}
+                        className={`circular-button`}
+                      >
+                        <FontAwesomeIcon icon="times" />
+                      </CButton>
+                    </div>
+                  </CTooltip>
+                </CCol>
+              </CRow>
+              <CRow>
+                <CCol xl={12}>
+                  {servicePrincipal?.appRoles?.length > 0 ? (
+                    <>
+                      <CRow>
+                        <FormSpy subscription={{ values: true }}>
+                          {({ values }) => {
+                            return (
+                              <CRow>
+                                <CCol xl={6} sm={12}>
+                                  <RFFSelectSearch
+                                    name={
+                                      'Permissions.' +
+                                      servicePrincipal.appId +
+                                      '.applicationPermissions'
+                                    }
+                                    label="Application Permissions"
+                                    values={servicePrincipal?.appRoles
+                                      ?.filter((role) => {
+                                        return newPermissions?.Permissions[
+                                          servicePrincipal.appId
+                                        ]?.applicationPermissions?.find(
+                                          (perm) => perm.id === role.id,
+                                        )
+                                          ? false
+                                          : true
+                                      })
+                                      .map((role) => ({
+                                        name: role.value,
+                                        value: role.id,
+                                      }))
+                                      .sort((a, b) => a.name.localeCompare(b.name))}
+                                  />
+                                </CCol>
+                                <CCol xl={6} sm={12} className="mt-auto">
+                                  <CTooltip content="Add Permission">
+                                    <CButton
+                                      onClick={() => {
+                                        addPermissionRow(
+                                          servicePrincipal.appId,
+                                          'applicationPermissions',
+                                          values.Permissions[servicePrincipal?.appId]
+                                            .applicationPermissions,
+                                        )
+                                        values.Permissions[
+                                          servicePrincipal.appId
+                                        ].applicationPermissions = ''
+                                      }}
+                                      className={`circular-button`}
+                                    >
+                                      <FontAwesomeIcon icon="plus" />
+                                    </CButton>
+                                  </CTooltip>
+                                </CCol>
+                              </CRow>
+                            )
+                          }}
+                        </FormSpy>
+                      </CRow>
+                      <div className="px-4">
+                        <CippTable
+                          data={
+                            newPermissions?.Permissions[servicePrincipal?.appId]
+                              ?.applicationPermissions ?? []
+                          }
+                          title="Application Permissions"
+                          columns={[
+                            {
+                              selector: (row) => row.value,
+                              name: 'Permission',
+                              sortable: true,
+                              exportSelector: 'value',
+                              maxWidth: '30%',
+                              cell: cellGenericFormatter(),
+                            },
+                            {
+                              selector: (row) => row.id,
+                              name: 'Id',
+                              omit: true,
+                              exportSelector: 'id',
+                            },
+                            {
+                              selector: (row) =>
+                                servicePrincipal.appRoles.find((role) => role.id === row.id)
+                                  .description,
+                              name: 'Description',
+                              cell: cellGenericFormatter({ wrap: true }),
+                              maxWidth: '60%',
+                            },
+                            {
+                              name: 'Actions',
+                              cell: (row) => {
+                                return (
+                                  <CTooltip content="Remove Permission">
+                                    <CButton
+                                      onClick={() => {
+                                        removePermissionRow(
+                                          servicePrincipal.appId,
+                                          'applicationPermissions',
+                                          row.id,
+                                          row.value,
+                                        )
+                                      }}
+                                      color="danger"
+                                      variant="ghost"
+                                      size="sm"
+                                    >
+                                      <FontAwesomeIcon icon="trash" />
+                                    </CButton>
+                                  </CTooltip>
+                                )
+                              },
+                              maxWidth: '10%',
+                            },
+                          ]}
+                          dynamicColumns={false}
+                        />
+                      </div>
+                    </>
+                  ) : (
+                    <>
+                      <CCallout color="warning">
+                        <FontAwesomeIcon icon="exclamation-triangle" className="me-2" />
+                        No Application Permissions found.
+                      </CCallout>
+                    </>
+                  )}
+                </CCol>
+              </CRow>
+              <CRow>
+                <CCol xl={12}>
+                  <hr />
+                </CCol>
+              </CRow>
+              <CRow>
+                <CCol xl={12}>
+                  {servicePrincipal?.publishedPermissionScopes?.length == 0 && (
+                    <CCallout color="warning">
+                      <FontAwesomeIcon icon="exclamation-triangle" className="me-2" />
+                      No Published Delegated Permissions found.
+                    </CCallout>
+                  )}
+                  <FormSpy subscription={{ values: true }}>
+                    {({ values }) => {
+                      return (
+                        <CRow>
+                          <CCol xl={6} sm={12}>
+                            <RFFSelectSearch
+                              name={
+                                'Permissions.' + servicePrincipal.appId + '.delegatedPermissions'
+                              }
+                              label="Delegated Permissions"
+                              values={
+                                servicePrincipal?.publishedPermissionScopes?.length > 0
+                                  ? servicePrincipal?.publishedPermissionScopes
+                                      .filter((scopes) => {
+                                        return newPermissions?.Permissions[
+                                          servicePrincipal.appId
+                                        ]?.delegatedPermissions?.find(
+                                          (perm) => perm.id === scopes.id,
+                                        )
+                                          ? false
+                                          : true
+                                      })
+                                      .map((scope) => ({
+                                        name: scope.value,
+                                        value: scope.id,
+                                      }))
+                                      .sort((a, b) => a.name.localeCompare(b.name))
+                                  : []
+                              }
+                              allowCreate={true}
+                            />
+                          </CCol>
+                          <CCol xl={6} sm={12} className="mt-auto">
+                            <CTooltip content="Add Permission">
+                              <CButton
+                                onClick={() => {
+                                  addPermissionRow(
+                                    servicePrincipal.appId,
+                                    'delegatedPermissions',
+                                    values?.Permissions[servicePrincipal.appId]
+                                      .delegatedPermissions,
+                                  )
+                                  values.Permissions[servicePrincipal.appId].delegatedPermissions =
+                                    ''
+                                }}
+                                className={`circular-button`}
+                              >
+                                <FontAwesomeIcon icon="plus" />
+                              </CButton>
+                            </CTooltip>
+                          </CCol>
+                        </CRow>
+                      )
+                    }}
+                  </FormSpy>
+
+                  <div className="px-4 mb-3">
+                    <CippTable
+                      data={
+                        newPermissions?.Permissions[servicePrincipal?.appId]
+                          ?.delegatedPermissions ?? []
+                      }
+                      title="Delegated Permissions"
+                      columns={[
+                        {
+                          selector: (row) => row?.value,
+                          name: 'Permission',
+                          sortable: true,
+                          exportSelector: 'value',
+                          maxWidth: '30%',
+                          cell: cellGenericFormatter(),
+                        },
+                        {
+                          selector: (row) => row?.id,
+                          name: 'Id',
+                          omit: true,
+                          exportSelector: 'id',
+                        },
+                        {
+                          selector: (row) =>
+                            servicePrincipal.publishedPermissionScopes.find(
+                              (scope) => scope?.id === row?.id,
+                            )?.userConsentDescription ?? 'No Description',
+                          name: 'Description',
+                          cell: cellGenericFormatter({ wrap: true }),
+                          maxWidth: '60%',
+                        },
+                        {
+                          name: 'Actions',
+                          cell: (row) => {
+                            return (
+                              <CTooltip content="Remove Permission">
+                                <CButton
+                                  onClick={() => {
+                                    removePermissionRow(
+                                      servicePrincipal.appId,
+                                      'delegatedPermissions',
+                                      row.id,
+                                      row.value,
+                                    )
+                                  }}
+                                  color="danger"
+                                  variant="ghost"
+                                  size="sm"
+                                >
+                                  <FontAwesomeIcon icon="trash" />
+                                </CButton>
+                              </CTooltip>
+                            )
+                          },
+                          maxWidth: '10%',
+                        },
+                      ]}
+                      dynamicColumns={false}
+                    />
+                  </div>
+                </CCol>
+              </CRow>
+            </CCol>
+          </CRow>
+        )}
+      </>
+    )
+  }
+  ApiPermissionRow.propTypes = {
+    servicePrincipal: PropTypes.object,
+  }
+
+  return (
+    <>
+      {spFetching && <Skeleton />}
+      {spSuccess && (
+        <Form
+          onSubmit={handleSubmit}
+          render={({ handleSubmit, submitting, values }) => {
+            return (
+              <CForm onSubmit={handleSubmit}>
+                <CRow className="mb-3">
+                  <CCol xl={8} md={12} className="mb-3">
+                    <CRow className="mb-3">
+                      <CCol xl={8}>
+                        {servicePrincipals?.Metadata?.Success && (
+                          <RFFSelectSearch
+                            name="servicePrincipal"
+                            label="Service Principal"
+                            values={servicePrincipals?.Results.map((sp) => ({
+                              name: `${sp.displayName} (${sp.appId})`,
+                              value: sp.appId,
+                            }))}
+                            isLoading={spFetching}
+                            refreshFunction={() => refetchSpList()}
+                            allowCreate={true}
+                            onCreateOption={(newSp) => {
+                              console.log(newSp)
+                            }}
+                            placeholder="(Advanced) Select a Service Principal"
+                          />
+                        )}
+                      </CCol>
+                      <CCol xl={4} className="mt-auto">
+                        <FormSpy subscription={{ values: true }}>
+                          {({ values }) => {
+                            return (
+                              <CTooltip content="Add Service Principal">
+                                <CButton
+                                  onClick={(e) =>
+                                    setSelectedApp([
+                                      ...selectedApp,
+                                      servicePrincipals?.Results?.find(
+                                        (sp) => sp.appId === values.servicePrincipal.value,
+                                      ),
+                                    ])
+                                  }
+                                  disabled={!values.servicePrincipal}
+                                  className={`circular-button`}
+                                  title={'+'}
+                                >
+                                  <FontAwesomeIcon icon="plus" />
+                                </CButton>
+                              </CTooltip>
+                            )
+                          }}
+                        </FormSpy>
+                        <CTooltip content="Reset to Default">
+                          <CButton
+                            onClick={() => {
+                              confirmReset()
+                            }}
+                            className={`circular-button`}
+                            title={'+'}
+                          >
+                            <FontAwesomeIcon icon="rotate-left" />
+                          </CButton>
+                        </CTooltip>
+                      </CCol>
+                    </CRow>
+
+                    <CAccordion>
+                      <>
+                        {selectedApp?.length > 0 &&
+                          selectedApp?.map((sp, spIndex) => (
+                            <CAccordionItem
+                              itemKey={`sp-${spIndex}-${sp.appId}`}
+                              key={`accordion-item-${spIndex}-${sp.appId}`}
+                            >
+                              <CAccordionHeader>{sp.displayName}</CAccordionHeader>
+                              <CAccordionBody>
+                                <CRow>
+                                  <ApiPermissionRow servicePrincipal={sp} />
+                                </CRow>
+                              </CAccordionBody>
+                            </CAccordionItem>
+                          ))}
+                      </>
+                    </CAccordion>
+                  </CCol>
+
+                  <CCol xl={4} md={12}>
+                    <FormSpy subscription={{ values: true }}>
+                      {({ values }) => {
+                        return <></>
+                      }}
+                    </FormSpy>
+                  </CCol>
+                </CRow>
+                <CRow className="me-3">
+                  <CRow className="mb-3">
+                    <CCol xl={4} md={12}>
+                      <CButton className="me-2" type="submit" disabled={submitting}>
+                        <FontAwesomeIcon
+                          icon={isSubmitting ? 'circle-notch' : 'save'}
+                          spin={isSubmitting}
+                          className="me-2"
+                        />
+                        Save
+                      </CButton>
+                    </CCol>
+                  </CRow>
+                </CRow>
+              </CForm>
+            )
+          }}
+        />
+      )}
+    </>
+  )
+}
+CippAppPermissionBuilder.propTypes = {
+  onSubmit: PropTypes.func,
+  currentPermissions: PropTypes.object,
+  isSubmitting: PropTypes.bool,
+}
+
+export default CippAppPermissionBuilder
diff --git a/src/scss/_custom.scss b/src/scss/_custom.scss
index 60d5abcc0cdd..b118641b872e 100644
--- a/src/scss/_custom.scss
+++ b/src/scss/_custom.scss
@@ -501,6 +501,7 @@ h3.underline:after {
   .react-select__menu {
     background-color: var(--cipp-search-bg);
     border: 1px solid var(--cipp-search-border-color);
+    z-index: 1000;
   }
 
   .react-select__option {
@@ -655,6 +656,11 @@ h3.underline:after {
   white-space: nowrap;
   overflow: hidden;
 }
+.celltip-content {
+  display: inline-block;
+  white-space: normal;
+  overflow: ellipsis;
+}
 
 .select-width {
   min-width: 100%;
diff --git a/src/scss/_themes.scss b/src/scss/_themes.scss
index f05c2be45f9b..4f94d5b0892c 100644
--- a/src/scss/_themes.scss
+++ b/src/scss/_themes.scss
@@ -434,6 +434,7 @@
   --cui-dropdown-link-color: var(--cyberdrain-light);
   --cui-dropdown-link-hover-bg: var(--cyberdrain-accent-blue);
   --cui-dropdown-link-hover-color: var(--cyberdrain-light);
+  --cui-dropdown-zindex: 990;
   --cui-footer-bg: #242424;
   --cui-footer-color: var(--cyberdrain-light);
   --cui-footer-border-color: #121212;
diff --git a/src/views/cipp/app-settings/SettingsSuperAdmin.jsx b/src/views/cipp/app-settings/SettingsSuperAdmin.jsx
index e6c7c8facc8e..842c53ae8cc2 100644
--- a/src/views/cipp/app-settings/SettingsSuperAdmin.jsx
+++ b/src/views/cipp/app-settings/SettingsSuperAdmin.jsx
@@ -1,24 +1,30 @@
 import { useGenericGetRequestQuery, useLazyGenericPostRequestQuery } from 'src/store/api/app.js'
 import { CAccordion, CButton, CCol, CForm, CLink, CRow, CSpinner } from '@coreui/react'
 import { Form } from 'react-final-form'
-import { RFFCFormRadio } from 'src/components/forms/index.js'
+import { RFFCFormRadio, RFFCFormSwitch } from 'src/components/forms/index.js'
 import React from 'react'
 import { CippCallout } from 'src/components/layout/index.js'
 import CippAccordionItem from 'src/components/contentcards/CippAccordionItem'
 import SettingsCustomRoles from 'src/views/cipp/app-settings/components/SettingsCustomRoles'
 import CippButtonCard from 'src/components/contentcards/CippButtonCard'
 import SettingsSAMRoles from './components/SettingsSAMRoles'
+import SettingsAppPermissions from './components/SettingsAppPermissions'
 
 export function SettingsSuperAdmin() {
   const partnerConfig = useGenericGetRequestQuery({
     path: '/api/ExecPartnerMode',
     params: { Action: 'ListCurrent' },
   })
+  const offloadConfig = useGenericGetRequestQuery({
+    path: '/api/ExecOffloadFunctions',
+    params: { Action: 'ListCurrent' },
+  })
 
-  const [submitWebhook, webhookCreateResult] = useLazyGenericPostRequestQuery()
+  const [execPartnerMode, execPartnerModeResult] = useLazyGenericPostRequestQuery()
+  const [execOffloadFunctions, execOffloadFunctionsResult] = useLazyGenericPostRequestQuery()
 
   const onSubmit = (values) => {
-    submitWebhook({
+    execPartnerMode({
       path: '/api/ExecPartnerMode',
       values: values,
     }).then((res) => {})
@@ -28,9 +34,33 @@ export function SettingsSuperAdmin() {
       form="submitForm"
       type="submit"
       color="primary"
-      disabled={webhookCreateResult.isFetching}
+      disabled={execPartnerModeResult.isFetching}
     >
-      {webhookCreateResult.isFetching ? (
+      {execPartnerModeResult.isFetching ? (
+        <>
+          <CSpinner size="sm" className="me-2" />
+        </>
+      ) : (
+        'Save'
+      )}
+    </CButton>
+  )
+
+  const onSubmitOffload = (values) => {
+    execOffloadFunctions({
+      path: '/api/ExecOffloadFunctions',
+      values: values,
+    }).then((res) => {})
+  }
+
+  const buttonCardOffload = (
+    <CButton
+      form="offloadForm"
+      type="submit"
+      color="primary"
+      disabled={execOffloadFunctionsResult.isFetching}
+    >
+      {execOffloadFunctionsResult.isFetching ? (
         <>
           <CSpinner size="sm" className="me-2" />
         </>
@@ -42,71 +72,119 @@ export function SettingsSuperAdmin() {
 
   return (
     <>
-      <CippButtonCard
-        title="Tenant Mode"
-        titleType="big"
-        isFetching={partnerConfig.isFetching}
-        CardButton={buttonCard}
-      >
-        <>
-          <>
-            <CRow>
-              <CCol sm={12} md={6} lg={8} className="mb-3">
-                <p className="me-1">
-                  The configuration settings below should only be modified by a super admin. Super
-                  admins can configure what tenant mode CIPP operates in. See
-                  <CLink
-                    href="https://docs.cipp.app/setup/installation/owntenant"
-                    target="_blank"
-                    className="m-1"
-                  >
-                    our documentation
-                  </CLink>
-                  for more information on how to configure these modes and what they mean.
-                </p>
-              </CCol>
-            </CRow>
-            <CRow>
-              <CCol sm={12} md={12} className="mb-3">
-                <p className="fw-lighter">Tenant Mode</p>
-                <Form
-                  onSubmit={onSubmit}
-                  initialValues={partnerConfig.data}
-                  render={({ handleSubmit }) => (
-                    <>
-                      {partnerConfig.isFetching && <CSpinner size="sm" className="me-2" />}
-                      <CForm id="submitForm" onSubmit={handleSubmit}>
-                        <RFFCFormRadio
-                          name="TenantMode"
-                          label="Multi Tenant - GDAP Mode"
-                          value="default"
-                        />
-                        <RFFCFormRadio
-                          name="TenantMode"
-                          label="Multi Tenant - Add Partner Tenant"
-                          value="PartnerTenantAvailable"
-                        />
-                        <RFFCFormRadio
-                          name="TenantMode"
-                          label="Single Tenant - Own Tenant Mode"
-                          value="owntenant"
-                        />
-                      </CForm>
-                    </>
+      <CRow className="mb-3">
+        <CCol sm={12} md={6}>
+          <CippButtonCard
+            title="Tenant Mode"
+            titleType="big"
+            isFetching={partnerConfig.isFetching}
+            CardButton={buttonCard}
+          >
+            <>
+              <>
+                <CRow>
+                  <CCol sm={12} md={6} lg={8} className="mb-3">
+                    <p className="me-1">
+                      The configuration settings below should only be modified by a super admin.
+                      Super admins can configure what tenant mode CIPP operates in. See
+                      <CLink
+                        href="https://docs.cipp.app/setup/installation/owntenant"
+                        target="_blank"
+                        className="m-1"
+                      >
+                        our documentation
+                      </CLink>
+                      for more information on how to configure these modes and what they mean.
+                    </p>
+                  </CCol>
+                </CRow>
+                <CRow>
+                  <CCol sm={12} md={12} className="mb-3">
+                    <p className="fw-lighter">Tenant Mode</p>
+                    <Form
+                      onSubmit={onSubmit}
+                      initialValues={partnerConfig.data}
+                      render={({ handleSubmit }) => (
+                        <>
+                          <CForm id="submitForm" onSubmit={handleSubmit}>
+                            <RFFCFormRadio
+                              name="TenantMode"
+                              label="Multi Tenant - GDAP Mode"
+                              value="default"
+                            />
+                            <RFFCFormRadio
+                              name="TenantMode"
+                              label="Multi Tenant - Add Partner Tenant"
+                              value="PartnerTenantAvailable"
+                            />
+                            <RFFCFormRadio
+                              name="TenantMode"
+                              label="Single Tenant - Own Tenant Mode"
+                              value="owntenant"
+                            />
+                          </CForm>
+                        </>
+                      )}
+                    />
+                    {execPartnerModeResult.isSuccess && (
+                      <CippCallout color="info" dismissible>
+                        {execPartnerModeResult?.data?.results}
+                      </CippCallout>
+                    )}
+                  </CCol>
+                </CRow>
+              </>
+            </>
+          </CippButtonCard>
+        </CCol>
+        <CCol sm={12} md={6}>
+          <CippButtonCard
+            title="Offload Functions to Processor"
+            titleType="big"
+            isFetching={offloadConfig.isFetching}
+            CardButton={buttonCardOffload}
+          >
+            <>
+              <CRow>
+                <CCol sm={12} lg={8}>
+                  <p className="me-1">
+                    This mode enables offloading some of the more processor intensive functions to a
+                    separate function app. This can be useful in environments where the CIPP server
+                    is under heavy load.
+                  </p>
+                  <h5>Current Functions</h5>
+                  <ul>
+                    <li>Audit Logs</li>
+                  </ul>
+                </CCol>
+              </CRow>
+              <CRow>
+                <CCol sm={12} md={12}>
+                  <Form
+                    onSubmit={onSubmitOffload}
+                    initialValues={offloadConfig.data}
+                    render={({ handleSubmit }) => (
+                      <>
+                        <CForm id="offloadForm" onSubmit={handleSubmit}>
+                          <RFFCFormSwitch name="OffloadFunctions" label="Offload Functions" />
+                        </CForm>
+                      </>
+                    )}
+                  />
+                  {execOffloadFunctionsResult.isSuccess && (
+                    <CippCallout color="info" dismissible>
+                      {execOffloadFunctionsResult?.data?.results}
+                    </CippCallout>
                   )}
-                />
-                {webhookCreateResult.isSuccess && (
-                  <CippCallout color="info" dismissible>
-                    {webhookCreateResult?.data?.results}
-                  </CippCallout>
-                )}
-              </CCol>
-            </CRow>
-          </>
-        </>
-      </CippButtonCard>
+                </CCol>
+              </CRow>
+            </>
+          </CippButtonCard>
+        </CCol>
+      </CRow>
       <SettingsCustomRoles />
       <SettingsSAMRoles />
+      <SettingsAppPermissions />
     </>
   )
 }
diff --git a/src/views/cipp/app-settings/components/SettingsAppPermissions.jsx b/src/views/cipp/app-settings/components/SettingsAppPermissions.jsx
new file mode 100644
index 000000000000..c3b6da3ffbd7
--- /dev/null
+++ b/src/views/cipp/app-settings/components/SettingsAppPermissions.jsx
@@ -0,0 +1,65 @@
+import React, { useRef, useState } from 'react'
+import {
+  CButton,
+  CCallout,
+  CCol,
+  CForm,
+  CRow,
+  CAccordion,
+  CAccordionHeader,
+  CAccordionBody,
+  CAccordionItem,
+} from '@coreui/react'
+import { Field, Form, FormSpy } from 'react-final-form'
+import { RFFCFormRadioList, RFFSelectSearch } from 'src/components/forms'
+import { useGenericGetRequestQuery, useLazyGenericPostRequestQuery } from 'src/store/api/app'
+import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
+import { TenantSelectorMultiple, ModalService, CippOffcanvas } from 'src/components/utilities'
+import PropTypes from 'prop-types'
+import { OnChange } from 'react-final-form-listeners'
+import { useListTenantsQuery } from 'src/store/api/tenants'
+import { OffcanvasListSection } from 'src/components/utilities/CippListOffcanvas'
+import CippButtonCard from 'src/components/contentcards/CippButtonCard'
+import CippAppPermissionBuilder from 'src/components/utilities/CippAppPermissionBuilder'
+
+const SettingsAppPermissions = () => {
+  const [genericPostRequest, postResults] = useLazyGenericPostRequestQuery()
+  const handleSubmit = (values) => {
+    genericPostRequest({
+      path: 'api/ExecSAMAppPermissions?Action=Update',
+      values: values,
+    })
+  }
+
+  const { data: samAppPermissions = [], isFetching: samAppPermissionsFetching } =
+    useGenericGetRequestQuery({
+      path: 'api/ExecSAMAppPermissions',
+    })
+
+  return (
+    <CippButtonCard title="CIPP-SAM API Permissions" titleType="big">
+      <>
+        <p className="me-1">Manage the permissions for the CIPP-SAM App Registration and CPV.</p>
+        <p className="small">
+          <FontAwesomeIcon icon="triangle-exclamation" className="me-2" /> This functionality is in
+          beta and should be treated as such. Removing permissions from the CIPP-SAM App is not
+          advised.
+        </p>
+
+        <CippAppPermissionBuilder
+          onSubmit={handleSubmit}
+          currentPermissions={samAppPermissions}
+          isSubmitting={postResults.isFetching}
+        />
+
+        {postResults.data && (
+          <CCallout color="success" className="mt-3">
+            {postResults?.data?.Results}
+          </CCallout>
+        )}
+      </>
+    </CippButtonCard>
+  )
+}
+
+export default SettingsAppPermissions

From edf117865221e349bae8b4ace45f4f33da544b14 Mon Sep 17 00:00:00 2001
From: John Duprey <jwd@johnwduprey.com>
Date: Wed, 14 Aug 2024 00:18:41 -0400
Subject: [PATCH 04/18] Handle default permission objects

---
 .../utilities/CippAppPermissionBuilder.jsx       | 16 ++++++++++++++++
 1 file changed, 16 insertions(+)

diff --git a/src/components/utilities/CippAppPermissionBuilder.jsx b/src/components/utilities/CippAppPermissionBuilder.jsx
index 8e8051955097..cc1fff477abb 100644
--- a/src/components/utilities/CippAppPermissionBuilder.jsx
+++ b/src/components/utilities/CippAppPermissionBuilder.jsx
@@ -77,6 +77,13 @@ const CippAppPermissionBuilder = ({ onSubmit, currentPermissions = {}, isSubmitt
 
   const addPermissionRow = (servicePrincipal, permissionType, permission) => {
     var updatedPermissions = JSON.parse(JSON.stringify(newPermissions))
+
+    if (!updatedPermissions?.Permissions[servicePrincipal]) {
+      updatedPermissions.Permissions[servicePrincipal] = {
+        applicationPermissions: [],
+        delegatedPermissions: [],
+      }
+    }
     var currentPermission = updatedPermissions?.Permissions[servicePrincipal][permissionType]
     var newPermission = []
     if (currentPermission) {
@@ -126,6 +133,15 @@ const CippAppPermissionBuilder = ({ onSubmit, currentPermissions = {}, isSubmitt
         (sp) => sp?.appId === '00000003-0000-0000-c000-000000000000',
       )
       setSelectedApp([microsoftGraph])
+      setNewPermissions({
+        Permissions: {
+          '00000003-0000-0000-c000-000000000000': {
+            applicationPermissions: [],
+            delegatedPermissions: [],
+          },
+        },
+      })
+      setPermissionsImported(true)
     } else if (spSuccess && initialAppIds.length > 0 && permissionsImported == false) {
       var newApps = []
       initialAppIds?.map((appId) => {

From 197c6a5eede04669bffa45a976ca9cd11d2f8bb8 Mon Sep 17 00:00:00 2001
From: John Duprey <jwd@johnwduprey.com>
Date: Wed, 14 Aug 2024 00:21:54 -0400
Subject: [PATCH 05/18] remove permissions when SP is deleted

---
 src/components/utilities/CippAppPermissionBuilder.jsx | 3 +++
 1 file changed, 3 insertions(+)

diff --git a/src/components/utilities/CippAppPermissionBuilder.jsx b/src/components/utilities/CippAppPermissionBuilder.jsx
index cc1fff477abb..1d0a11cf1366 100644
--- a/src/components/utilities/CippAppPermissionBuilder.jsx
+++ b/src/components/utilities/CippAppPermissionBuilder.jsx
@@ -51,6 +51,9 @@ const CippAppPermissionBuilder = ({ onSubmit, currentPermissions = {}, isSubmitt
       body: `Are you sure you want to remove ${servicePrincipal.displayName}?`,
       onConfirm: () => {
         setSelectedApp(newServicePrincipals)
+        var updatedPermissions = JSON.parse(JSON.stringify(newPermissions))
+        delete updatedPermissions.Permissions[appId]
+        setNewPermissions(updatedPermissions)
       },
     })
   }

From 630e4e1c6de5cee30265c29c82d75cf9bcdd29dd Mon Sep 17 00:00:00 2001
From: John Duprey <jwd@johnwduprey.com>
Date: Wed, 14 Aug 2024 00:54:47 -0400
Subject: [PATCH 06/18] Update CippAppPermissionBuilder.jsx

---
 .../utilities/CippAppPermissionBuilder.jsx    | 92 +++++++++++++++++++
 1 file changed, 92 insertions(+)

diff --git a/src/components/utilities/CippAppPermissionBuilder.jsx b/src/components/utilities/CippAppPermissionBuilder.jsx
index 1d0a11cf1366..6f52e44f30ec 100644
--- a/src/components/utilities/CippAppPermissionBuilder.jsx
+++ b/src/components/utilities/CippAppPermissionBuilder.jsx
@@ -124,6 +124,75 @@ const CippAppPermissionBuilder = ({ onSubmit, currentPermissions = {}, isSubmitt
     })
   }
 
+  const generateManifest = (appDisplayName = 'CIPP-SAM', prompt = false) => {
+    if (prompt) {
+      // modal input form for appDisplayName
+      ModalService.prompt({
+        title: 'Generate Manifest',
+        body: 'Please enter the display name for the application.',
+        onConfirm: (value) => {
+          generateManifest({ appDisplayName: value })
+        },
+      })
+    } else {
+      var manifest = {
+        isFallbackPublicClient: true,
+        signInAudience: 'AzureADMultipleOrgs',
+        displayName: appDisplayName,
+        web: {
+          redirectUris: [
+            'https://login.microsoftonline.com/common/oauth2/nativeclient',
+            'https://localhost',
+            'http://localhost',
+            'http://localhost:8400',
+          ],
+        },
+        requiredResourceAccess: [],
+      }
+
+      selectedApp.map((sp) => {
+        var appRoles = newPermissions?.Permissions[sp.appId]?.applicationPermissions
+        var delegatedPermissions = newPermissions?.Permissions[sp.appId]?.delegatedPermissions
+        var requiredResourceAccess = {
+          resourceAppId: sp.appId,
+          resourceAccess: [],
+        }
+        appRoles.map((role) => {
+          requiredResourceAccess.resourceAccess.push({
+            id: role.id,
+            type: 'Role',
+          })
+        })
+        delegatedPermissions.map((perm) => {
+          // permission not a guid skip
+          if (/^[0-9a-f]{8}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{12}$/i.test(perm.id)) {
+            requiredResourceAccess.resourceAccess.push({
+              id: perm.id,
+              type: 'Scope',
+            })
+          }
+        })
+        if (requiredResourceAccess.resourceAccess.length > 0) {
+          manifest.requiredResourceAccess.push(requiredResourceAccess)
+        }
+      })
+
+      var fileName = `${appDisplayName.replace(' ', '-')}.json`
+      if (appDisplayName === 'CIPP-SAM') {
+        fileName = 'SAMManifest.json'
+      }
+
+      var blob = new Blob([JSON.stringify(manifest, null, 2)], { type: 'application/json' })
+      var url = URL.createObjectURL(blob)
+      var a = document.createElement('a')
+      a.href = url
+      a.download = `${fileName}.json`
+      a.click()
+    }
+  }
+
+  const importManifest = () => {}
+
   useEffect(() => {
     try {
       var initialAppIds = Object.keys(currentPermissions?.Permissions)
@@ -542,6 +611,29 @@ const CippAppPermissionBuilder = ({ onSubmit, currentPermissions = {}, isSubmitt
                             <FontAwesomeIcon icon="rotate-left" />
                           </CButton>
                         </CTooltip>
+                        <CTooltip content="Download Manifest">
+                          <CButton
+                            onClick={() => {
+                              generateManifest()
+                            }}
+                            className={`circular-button`}
+                            title={'+'}
+                          >
+                            <FontAwesomeIcon icon="download" />
+                          </CButton>
+                        </CTooltip>
+
+                        <CTooltip content="Import Manifest">
+                          <CButton
+                            onClick={() => {
+                              importManifest()
+                            }}
+                            className={`circular-button`}
+                            title={'+'}
+                          >
+                            <FontAwesomeIcon icon="upload" />
+                          </CButton>
+                        </CTooltip>
                       </CCol>
                     </CRow>
 

From b43119323cfe5dfe193c92c34b70c77f4a48a19e Mon Sep 17 00:00:00 2001
From: John Duprey <jwd@johnwduprey.com>
Date: Wed, 14 Aug 2024 13:19:38 -0400
Subject: [PATCH 07/18] CIPP-SAM Permissions, Bugfixes and error cleanup

- Add additional permissions download
- Cleanup console errors
- Fix issues with settings tabs
---
 .../contentcards/CippButtonCard.jsx           |   4 +-
 src/components/tables/CippTable.jsx           |  16 +-
 .../utilities/CippActionsOffcanvas.jsx        |   5 +-
 .../utilities/CippAppPermissionBuilder.jsx    |  51 +++-
 .../utilities/CippCodeOffcanvas.jsx           |   4 +-
 .../app-settings/SettingsNotifications.jsx    | 276 +++++++++---------
 .../cipp/app-settings/SettingsPartner.jsx     |  27 +-
 .../SettingsWebhookSubscriptions.jsx          |   1 +
 .../components/SettingsSAMRoles.jsx           |   3 +-
 9 files changed, 215 insertions(+), 172 deletions(-)

diff --git a/src/components/contentcards/CippButtonCard.jsx b/src/components/contentcards/CippButtonCard.jsx
index 8e280ab067d3..a34acbd66142 100644
--- a/src/components/contentcards/CippButtonCard.jsx
+++ b/src/components/contentcards/CippButtonCard.jsx
@@ -22,7 +22,7 @@ export default function CippButtonCard({
         {isFetching && <Skeleton />}
         {children}
       </CCardBody>
-      <CCardFooter>{CardButton}</CCardFooter>
+      {CardButton && <CCardFooter>{CardButton}</CCardFooter>}
     </CCard>
   )
 }
@@ -30,7 +30,7 @@ export default function CippButtonCard({
 CippButtonCard.propTypes = {
   title: PropTypes.string.isRequired,
   titleType: PropTypes.string,
-  CardButton: PropTypes.element.isRequired,
+  CardButton: PropTypes.element,
   children: PropTypes.element.isRequired,
   isFetching: PropTypes.bool,
   className: PropTypes.string,
diff --git a/src/components/tables/CippTable.jsx b/src/components/tables/CippTable.jsx
index 04ede5a4c204..698ce52d176a 100644
--- a/src/components/tables/CippTable.jsx
+++ b/src/components/tables/CippTable.jsx
@@ -63,7 +63,7 @@ const FilterComponent = ({ filterText, onFilter, onClear, filterlist, onFilterPr
           {filterlist &&
             filterlist.map((item, idx) => {
               return (
-                <CDropdownItem key={idx} onClick={() => onFilterPreset(item.filter)}>
+                <CDropdownItem key={`filter-${idx}`} onClick={() => onFilterPreset(item.filter)}>
                   {item.filterName}
                 </CDropdownItem>
               )
@@ -722,7 +722,7 @@ export default function CippTable({
                 {dataKeys() &&
                   dataKeys().map((item, idx) => {
                     return (
-                      <CDropdownItem key={idx} onClick={() => addColumn(item)}>
+                      <CDropdownItem key={`select-${idx}`} onClick={() => addColumn(item)}>
                         {updatedColumns.find(
                           (o) => o.exportSelector === item && o?.omit !== true,
                         ) && <FontAwesomeIcon icon={faCheck} />}{' '}
@@ -820,7 +820,7 @@ export default function CippTable({
             <CDropdownMenu>
               {actionsList.map((item, idx) => {
                 return (
-                  <CDropdownItem key={idx} onClick={() => executeselectedAction(item)}>
+                  <CDropdownItem key={`actions-${idx}`} onClick={() => executeselectedAction(item)}>
                     {item.label}
                   </CDropdownItem>
                 )
@@ -885,6 +885,7 @@ export default function CippTable({
     updatedColumns,
     addColumn,
     setGraphFilter,
+    isFetching,
   ])
   const tablePageSize = useSelector((state) => state.app.tablePageSize)
   const [codeCopied, setCodeCopied] = useState(false)
@@ -950,8 +951,8 @@ export default function CippTable({
                     const results = message.data?.Results
                     const displayResults = Array.isArray(results) ? results.join(', ') : results
                     return (
-                      <>
-                        <li key={`message-${idx}`}>
+                      <React.Fragment key={`message-${idx}`}>
+                        <li>
                           {displayResults}
                           <CopyToClipboard text={displayResults} onCopy={() => onCodeCopied()}>
                             <CButton
@@ -968,7 +969,7 @@ export default function CippTable({
                             </CButton>
                           </CopyToClipboard>
                         </li>
-                      </>
+                      </React.Fragment>
                     )
                   })}
                 {loopRunning && (
@@ -1008,11 +1009,12 @@ export default function CippTable({
               progressPending={isFetching}
               progressComponent={<CSpinner color="info" component="div" />}
               paginationRowsPerPageOptions={[25, 50, 100, 200, 500]}
+              keyField={keyField}
               {...rest}
             />
             {selectedRows.length >= 1 && <CCallout>Selected {selectedRows.length} items</CCallout>}
             <CippCodeOffCanvas
-              row={data}
+              row={data ?? {}}
               hideButton={true}
               state={codeOffcanvasVisible}
               hideFunction={() => setCodeOffcanvasVisible(false)}
diff --git a/src/components/utilities/CippActionsOffcanvas.jsx b/src/components/utilities/CippActionsOffcanvas.jsx
index e543a511ffb1..7287af9722da 100644
--- a/src/components/utilities/CippActionsOffcanvas.jsx
+++ b/src/components/utilities/CippActionsOffcanvas.jsx
@@ -38,11 +38,11 @@ import { faGlobe } from '@fortawesome/free-solid-svg-icons'
 import { cellGenericFormatter } from '../tables/CellGenericFormat'
 import ReactSelect from 'react-select'
 
-const CippOffcanvasCard = ({ action, key }) => {
+const CippOffcanvasCard = ({ action }) => {
   const [offcanvasVisible, setOffcanvasVisible] = useState(false)
   return (
     <>
-      <CCard key={key} className="border-top-dark border-top-3 mb-3">
+      <CCard className="border-top-dark border-top-3 mb-3">
         <CCardHeader className="d-flex justify-content-between align-items-center">
           <CCardTitle>Report Name: {action.label}</CCardTitle>
         </CCardHeader>
@@ -95,7 +95,6 @@ const CippOffcanvasCard = ({ action, key }) => {
 }
 CippOffcanvasCard.propTypes = {
   action: PropTypes.object,
-  key: PropTypes.object,
 }
 
 export default function CippActionsOffcanvas(props) {
diff --git a/src/components/utilities/CippAppPermissionBuilder.jsx b/src/components/utilities/CippAppPermissionBuilder.jsx
index 6f52e44f30ec..d179285693f1 100644
--- a/src/components/utilities/CippAppPermissionBuilder.jsx
+++ b/src/components/utilities/CippAppPermissionBuilder.jsx
@@ -15,17 +15,15 @@ import { Field, Form, FormSpy } from 'react-final-form'
 import { RFFCFormRadioList, RFFSelectSearch } from 'src/components/forms'
 import { useGenericGetRequestQuery, useLazyGenericPostRequestQuery } from 'src/store/api/app'
 import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
-import { TenantSelectorMultiple, ModalService, CippOffcanvas } from 'src/components/utilities'
+import { TenantSelectorMultiple, ModalService } from 'src/components/utilities'
 import PropTypes from 'prop-types'
 import { OnChange } from 'react-final-form-listeners'
 import { useListTenantsQuery } from 'src/store/api/tenants'
-import { OffcanvasListSection } from 'src/components/utilities/CippListOffcanvas'
 import CippButtonCard from 'src/components/contentcards/CippButtonCard'
 import { CippTable } from '../tables'
 import { Row } from 'react-bootstrap'
 import { cellGenericFormatter } from '../tables/CellGenericFormat'
 import Skeleton from 'react-loading-skeleton'
-import { uniqueId } from 'lodash-es'
 
 const CippAppPermissionBuilder = ({ onSubmit, currentPermissions = {}, isSubmitting }) => {
   const [selectedApp, setSelectedApp] = useState([])
@@ -91,7 +89,7 @@ const CippAppPermissionBuilder = ({ onSubmit, currentPermissions = {}, isSubmitt
     var newPermission = []
     if (currentPermission) {
       currentPermission.map((perm) => {
-        if (perm.id.lower() !== permission.value.lower()) {
+        if (perm.id !== permission.value) {
           newPermission.push(perm)
         }
       })
@@ -150,6 +148,8 @@ const CippAppPermissionBuilder = ({ onSubmit, currentPermissions = {}, isSubmitt
         requiredResourceAccess: [],
       }
 
+      var additionalPermissions = []
+
       selectedApp.map((sp) => {
         var appRoles = newPermissions?.Permissions[sp.appId]?.applicationPermissions
         var delegatedPermissions = newPermissions?.Permissions[sp.appId]?.delegatedPermissions
@@ -157,6 +157,10 @@ const CippAppPermissionBuilder = ({ onSubmit, currentPermissions = {}, isSubmitt
           resourceAppId: sp.appId,
           resourceAccess: [],
         }
+        var additionalRequiredResourceAccess = {
+          resourceAppId: sp.appId,
+          resourceAccess: [],
+        }
         appRoles.map((role) => {
           requiredResourceAccess.resourceAccess.push({
             id: role.id,
@@ -170,11 +174,19 @@ const CippAppPermissionBuilder = ({ onSubmit, currentPermissions = {}, isSubmitt
               id: perm.id,
               type: 'Scope',
             })
+          } else {
+            additionalRequiredResourceAccess.resourceAccess.push({
+              id: perm.id,
+              type: 'Scope',
+            })
           }
         })
         if (requiredResourceAccess.resourceAccess.length > 0) {
           manifest.requiredResourceAccess.push(requiredResourceAccess)
         }
+        if (additionalRequiredResourceAccess.resourceAccess.length > 0) {
+          additionalPermissions.push(additionalRequiredResourceAccess)
+        }
       })
 
       var fileName = `${appDisplayName.replace(' ', '-')}.json`
@@ -186,8 +198,28 @@ const CippAppPermissionBuilder = ({ onSubmit, currentPermissions = {}, isSubmitt
       var url = URL.createObjectURL(blob)
       var a = document.createElement('a')
       a.href = url
-      a.download = `${fileName}.json`
+      a.download = `${fileName}`
       a.click()
+      URL.revokeObjectURL(url)
+
+      if (additionalPermissions.length > 0) {
+        ModalService.confirm({
+          title: 'Additional Permissions',
+          body: 'Some permissions are not supported in the manifest. Would you like to download them?',
+          confirmLabel: 'Download',
+          onConfirm: () => {
+            var additionalBlob = new Blob([JSON.stringify(additionalPermissions, null, 2)], {
+              type: 'application/json',
+            })
+            var additionalUrl = URL.createObjectURL(additionalBlob)
+            var additionalA = document.createElement('a')
+            additionalA.href = additionalUrl
+            additionalA.download = 'AdditionalPermissions.json'
+            additionalA.click()
+            URL.revokeObjectURL(additionalUrl)
+          },
+        })
+      }
     }
   }
 
@@ -213,7 +245,6 @@ const CippAppPermissionBuilder = ({ onSubmit, currentPermissions = {}, isSubmitt
           },
         },
       })
-      setPermissionsImported(true)
     } else if (spSuccess && initialAppIds.length > 0 && permissionsImported == false) {
       var newApps = []
       initialAppIds?.map((appId) => {
@@ -241,7 +272,6 @@ const CippAppPermissionBuilder = ({ onSubmit, currentPermissions = {}, isSubmitt
   ])
 
   const ApiPermissionRow = ({ servicePrincipal = null }) => {
-    const [offcanvasVisible, setOffcanvasVisible] = useState(false)
     return (
       <>
         {spSuccess && servicePrincipal !== null && (
@@ -336,6 +366,7 @@ const CippAppPermissionBuilder = ({ onSubmit, currentPermissions = {}, isSubmitt
                       </CRow>
                       <div className="px-4">
                         <CippTable
+                          reportName={`${servicePrincipal.displayName} Application Permissions`}
                           data={
                             newPermissions?.Permissions[servicePrincipal?.appId]
                               ?.applicationPermissions ?? []
@@ -475,6 +506,7 @@ const CippAppPermissionBuilder = ({ onSubmit, currentPermissions = {}, isSubmitt
 
                   <div className="px-4 mb-3">
                     <CippTable
+                      reportName={`${servicePrincipal.displayName} Delegated Permissions`}
                       data={
                         newPermissions?.Permissions[servicePrincipal?.appId]
                           ?.delegatedPermissions ?? []
@@ -648,7 +680,10 @@ const CippAppPermissionBuilder = ({ onSubmit, currentPermissions = {}, isSubmitt
                               <CAccordionHeader>{sp.displayName}</CAccordionHeader>
                               <CAccordionBody>
                                 <CRow>
-                                  <ApiPermissionRow servicePrincipal={sp} />
+                                  <ApiPermissionRow
+                                    servicePrincipal={sp}
+                                    key={`apirow-${spIndex}`}
+                                  />
                                 </CRow>
                               </CAccordionBody>
                             </CAccordionItem>
diff --git a/src/components/utilities/CippCodeOffcanvas.jsx b/src/components/utilities/CippCodeOffcanvas.jsx
index a9b5cf41a055..10920c368722 100644
--- a/src/components/utilities/CippCodeOffcanvas.jsx
+++ b/src/components/utilities/CippCodeOffcanvas.jsx
@@ -44,7 +44,7 @@ function CippCodeOffCanvas({
         addedClass="offcanvas-large"
         placement="end"
         visible={visible}
-        id={row}
+        id={crypto.randomUUID()}
         hideFunction={hideFunction}
       >
         <Editor
@@ -99,7 +99,7 @@ function CippCodeOffCanvas({
 }
 
 CippCodeOffCanvas.propTypes = {
-  row: PropTypes.object,
+  row: PropTypes.oneOfType([PropTypes.object, PropTypes.array]),
   state: PropTypes.bool,
   hideFunction: PropTypes.func,
   type: PropTypes.string,
diff --git a/src/views/cipp/app-settings/SettingsNotifications.jsx b/src/views/cipp/app-settings/SettingsNotifications.jsx
index 781d2ac72e6a..f38bb2f1fd1f 100644
--- a/src/views/cipp/app-settings/SettingsNotifications.jsx
+++ b/src/views/cipp/app-settings/SettingsNotifications.jsx
@@ -64,145 +64,147 @@ export function SettingsNotifications() {
         }
         isFetching={notificationListResult.isFetching}
       >
-        {notificationListResult.isUninitialized && listNotification()}
-        {notificationListResult.isFetching ||
-          (generateAlertResult.isFetching && (
-            <FontAwesomeIcon icon={faCircleNotch} spin className="me-2" size="1x" />
-          ))}
-        {!notificationListResult.isFetching && notificationListResult.error && (
-          <CippCallout color="danger">Error loading data</CippCallout>
-        )}
-        {notificationListResult.isSuccess && (
-          <Form
-            initialValuesEqual={() => true}
-            initialValues={{
-              ...notificationListResult.data,
-              logsToInclude: notificationListResult.data?.logsToInclude?.map((m) => ({
-                label: m,
-                value: m,
-              })),
-              Severity: notificationListResult.data?.Severity?.map((s) => ({
-                label: s,
-                value: s,
-              })),
-            }}
-            onSubmit={onSubmit}
-            render={({ handleSubmit, submitting, values }) => {
-              return (
-                <CForm id="notificationform" onSubmit={handleSubmit}>
-                  {notificationConfigResult.isFetching && (
-                    <CippCallout color="success">
-                      <CSpinner>Loading</CSpinner>
-                    </CippCallout>
-                  )}
-                  {notificationConfigResult.isSuccess && !notificationConfigResult.isFetching && (
-                    <CippCallout color="success" dismissible>
-                      {notificationConfigResult.data?.Results}
-                    </CippCallout>
-                  )}
-                  {notificationConfigResult.isError && !notificationConfigResult.isFetching && (
-                    <CippCallout color="danger">
-                      Could not connect to API: {notificationConfigResult.error.message}
-                    </CippCallout>
-                  )}
-                  <CCol>
-                    <CCol>
-                      <RFFCFormInput
-                        type="text"
-                        name="email"
-                        label="E-mail (Separate multiple E-mails with commas e.g.: matt@example.com, joe@sample.com)"
-                      />
-                    </CCol>
-                    <CCol>
-                      <RFFCFormInput type="text" name="webhook" label="Webhook" />
-                    </CCol>
-                    <CCol>
-                      <RFFSelectSearch
-                        multi={true}
-                        label="Choose which logs you'd like to receive alerts from. This notification will be sent every 15 minutes."
-                        name="logsToInclude"
-                        values={[
-                          { value: 'Updates', name: 'Updates Status' },
-                          { value: 'Standards', name: 'All Standards' },
-                          { value: 'TokensUpdater', name: 'Token Events' },
-                          {
-                            value: 'ExecDnsConfig',
-                            name: 'Changing DNS Settings',
-                          },
-                          {
-                            value: 'ExecExcludeLicenses',
-                            name: 'Adding excluded licenses',
-                          },
-                          {
-                            value: 'ExecExcludeTenant',
-                            name: 'Adding excluded tenants',
-                          },
-                          { value: 'EditUser', name: 'Editing a user' },
-                          {
-                            value: 'ChocoApp',
-                            name: 'Adding or deploying applications',
-                          },
-                          {
-                            value: 'AddAPDevice',
-                            name: 'Adding autopilot devices',
-                          },
-                          { value: 'EditTenant', name: 'Editing a tenant' },
-                          { value: 'AddMSPApp', name: 'Adding an MSP app' },
-                          { value: 'AddUser', name: 'Adding a user' },
-                          { value: 'AddGroup', name: 'Adding a group' },
-                          { value: 'NewTenant', name: 'Adding a tenant' },
-                          {
-                            value: 'ExecOffboardUser',
-                            name: 'Executing the offboard wizard',
-                          },
-                        ]}
-                      />
-                    </CCol>
-                    <CCol className="mb-3">
-                      <RFFSelectSearch
-                        multi={true}
-                        label="Choose which severity of alert you want to be notified for."
-                        name="Severity"
-                        values={[
-                          { value: 'Alert', name: 'Alert' },
-                          { value: 'Error', name: 'Error' },
-                          { value: 'Info', name: 'Info' },
-                          { value: 'Warning', name: 'Warning' },
-                          { value: 'Critical', name: 'Critical' },
-                        ]}
-                      />
-                    </CCol>
-                    <CCol>
-                      <RFFCFormSwitch
-                        name="onePerTenant"
-                        label="Receive one email per tenant"
-                        value={false}
-                      />
-                    </CCol>
-                    <CCol>
-                      <RFFCFormSwitch
-                        name="sendtoIntegration"
-                        label="Send notifications to configured integration(s)"
-                        value={false}
-                      />
-                    </CCol>
+        <>
+          {notificationListResult.isUninitialized && listNotification()}
+          {notificationListResult.isFetching ||
+            (generateAlertResult.isFetching && (
+              <FontAwesomeIcon icon={faCircleNotch} spin className="me-2" size="1x" />
+            ))}
+          {!notificationListResult.isFetching && notificationListResult.error && (
+            <CippCallout color="danger">Error loading data</CippCallout>
+          )}
+          {notificationListResult.isSuccess && (
+            <Form
+              initialValuesEqual={() => true}
+              initialValues={{
+                ...notificationListResult.data,
+                logsToInclude: notificationListResult.data?.logsToInclude?.map((m) => ({
+                  label: m,
+                  value: m,
+                })),
+                Severity: notificationListResult.data?.Severity?.map((s) => ({
+                  label: s,
+                  value: s,
+                })),
+              }}
+              onSubmit={onSubmit}
+              render={({ handleSubmit, submitting, values }) => {
+                return (
+                  <CForm id="notificationform" onSubmit={handleSubmit}>
+                    {notificationConfigResult.isFetching && (
+                      <CippCallout color="success">
+                        <CSpinner>Loading</CSpinner>
+                      </CippCallout>
+                    )}
+                    {notificationConfigResult.isSuccess && !notificationConfigResult.isFetching && (
+                      <CippCallout color="success" dismissible>
+                        {notificationConfigResult.data?.Results}
+                      </CippCallout>
+                    )}
+                    {notificationConfigResult.isError && !notificationConfigResult.isFetching && (
+                      <CippCallout color="danger">
+                        Could not connect to API: {notificationConfigResult.error.message}
+                      </CippCallout>
+                    )}
                     <CCol>
-                      <RFFCFormSwitch
-                        name="includeTenantId"
-                        label="Include Tenant ID in alerts"
-                        value={false}
-                      />
+                      <CCol>
+                        <RFFCFormInput
+                          type="text"
+                          name="email"
+                          label="E-mail (Separate multiple E-mails with commas e.g.: matt@example.com, joe@sample.com)"
+                        />
+                      </CCol>
+                      <CCol>
+                        <RFFCFormInput type="text" name="webhook" label="Webhook" />
+                      </CCol>
+                      <CCol>
+                        <RFFSelectSearch
+                          multi={true}
+                          label="Choose which logs you'd like to receive alerts from. This notification will be sent every 15 minutes."
+                          name="logsToInclude"
+                          values={[
+                            { value: 'Updates', name: 'Updates Status' },
+                            { value: 'Standards', name: 'All Standards' },
+                            { value: 'TokensUpdater', name: 'Token Events' },
+                            {
+                              value: 'ExecDnsConfig',
+                              name: 'Changing DNS Settings',
+                            },
+                            {
+                              value: 'ExecExcludeLicenses',
+                              name: 'Adding excluded licenses',
+                            },
+                            {
+                              value: 'ExecExcludeTenant',
+                              name: 'Adding excluded tenants',
+                            },
+                            { value: 'EditUser', name: 'Editing a user' },
+                            {
+                              value: 'ChocoApp',
+                              name: 'Adding or deploying applications',
+                            },
+                            {
+                              value: 'AddAPDevice',
+                              name: 'Adding autopilot devices',
+                            },
+                            { value: 'EditTenant', name: 'Editing a tenant' },
+                            { value: 'AddMSPApp', name: 'Adding an MSP app' },
+                            { value: 'AddUser', name: 'Adding a user' },
+                            { value: 'AddGroup', name: 'Adding a group' },
+                            { value: 'NewTenant', name: 'Adding a tenant' },
+                            {
+                              value: 'ExecOffboardUser',
+                              name: 'Executing the offboard wizard',
+                            },
+                          ]}
+                        />
+                      </CCol>
+                      <CCol className="mb-3">
+                        <RFFSelectSearch
+                          multi={true}
+                          label="Choose which severity of alert you want to be notified for."
+                          name="Severity"
+                          values={[
+                            { value: 'Alert', name: 'Alert' },
+                            { value: 'Error', name: 'Error' },
+                            { value: 'Info', name: 'Info' },
+                            { value: 'Warning', name: 'Warning' },
+                            { value: 'Critical', name: 'Critical' },
+                          ]}
+                        />
+                      </CCol>
+                      <CCol>
+                        <RFFCFormSwitch
+                          name="onePerTenant"
+                          label="Receive one email per tenant"
+                          value={false}
+                        />
+                      </CCol>
+                      <CCol>
+                        <RFFCFormSwitch
+                          name="sendtoIntegration"
+                          label="Send notifications to configured integration(s)"
+                          value={false}
+                        />
+                      </CCol>
+                      <CCol>
+                        <RFFCFormSwitch
+                          name="includeTenantId"
+                          label="Include Tenant ID in alerts"
+                          value={false}
+                        />
+                      </CCol>
                     </CCol>
-                  </CCol>
-                </CForm>
-              )
-            }}
-          />
-        )}
-        <small>
-          Use the button below to save the changes, or generate a test alert. The test alert will be
-          processed in a batch with other alerts
-        </small>
+                  </CForm>
+                )
+              }}
+            />
+          )}
+          <small>
+            Use the button below to save the changes, or generate a test alert. The test alert will
+            be processed in a batch with other alerts
+          </small>
+        </>
       </CippButtonCard>
     </CCol>
   )
diff --git a/src/views/cipp/app-settings/SettingsPartner.jsx b/src/views/cipp/app-settings/SettingsPartner.jsx
index b569b9c33c24..823844ac56b5 100644
--- a/src/views/cipp/app-settings/SettingsPartner.jsx
+++ b/src/views/cipp/app-settings/SettingsPartner.jsx
@@ -24,6 +24,7 @@ import React, { useEffect } from 'react'
 import { CippCallout } from 'src/components/layout/index.js'
 import { CippCodeBlock } from 'src/components/utilities'
 import { CellDate } from 'src/components/tables'
+import Skeleton from 'react-loading-skeleton'
 
 /**
  * Sets the notification settings.
@@ -148,17 +149,21 @@ export function SettingsPartner() {
                     render={({ handleSubmit }) => (
                       <>
                         <CForm onSubmit={handleSubmit}>
-                          <RFFSelectSearch
-                            name="EventType"
-                            label="Event Types"
-                            values={webhookEvents.data?.Results?.map((event) => ({
-                              name: event,
-                              value: event,
-                            }))}
-                            multi={true}
-                            refreshFunction={() => webhookEvents.refetch()}
-                            helpText="Select the events you want to receive notifications for."
-                          />
+                          {webhookEvents.isSuccess ? (
+                            <RFFSelectSearch
+                              name="EventType"
+                              label="Event Types"
+                              values={webhookEvents.data?.Results?.map((event) => ({
+                                name: event,
+                                value: event,
+                              }))}
+                              multi={true}
+                              refreshFunction={() => webhookEvents.refetch()}
+                              helpText="Select the events you want to receive notifications for."
+                            />
+                          ) : (
+                            <Skeleton />
+                          )}
                           <RFFCFormSwitch
                             name="standardsExcludeAllTenants"
                             helpText='Enabling this feature excludes tenants from any top-level
diff --git a/src/views/cipp/app-settings/SettingsWebhookSubscriptions.jsx b/src/views/cipp/app-settings/SettingsWebhookSubscriptions.jsx
index 965e13b57b90..61d74b736f06 100644
--- a/src/views/cipp/app-settings/SettingsWebhookSubscriptions.jsx
+++ b/src/views/cipp/app-settings/SettingsWebhookSubscriptions.jsx
@@ -49,6 +49,7 @@ export function SettingsWebhookSubscriptions() {
           path: 'api/ExecWebhookSubscriptions',
           reportName: `Log Subscriptions`,
           tableProps: {
+            keyField: 'RowKey',
             selectableRows: true,
             actionsList: [
               {
diff --git a/src/views/cipp/app-settings/components/SettingsSAMRoles.jsx b/src/views/cipp/app-settings/components/SettingsSAMRoles.jsx
index ebc8310b6abd..fdce15fb39cd 100644
--- a/src/views/cipp/app-settings/components/SettingsSAMRoles.jsx
+++ b/src/views/cipp/app-settings/components/SettingsSAMRoles.jsx
@@ -14,11 +14,10 @@ import { Field, Form, FormSpy } from 'react-final-form'
 import { RFFCFormRadioList, RFFSelectSearch } from 'src/components/forms'
 import { useGenericGetRequestQuery, useLazyGenericPostRequestQuery } from 'src/store/api/app'
 import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
-import { TenantSelectorMultiple, ModalService, CippOffcanvas } from 'src/components/utilities'
+import { TenantSelectorMultiple, ModalService } from 'src/components/utilities'
 import PropTypes from 'prop-types'
 import { OnChange } from 'react-final-form-listeners'
 import { useListTenantsQuery } from 'src/store/api/tenants'
-import { OffcanvasListSection } from 'src/components/utilities/CippListOffcanvas'
 import CippButtonCard from 'src/components/contentcards/CippButtonCard'
 import GDAPRoles from 'src/data/GDAPRoles'
 

From 8c2061159063bfd082c18b389c8968e69280c14d Mon Sep 17 00:00:00 2001
From: John Duprey <jwd@johnwduprey.com>
Date: Wed, 14 Aug 2024 15:21:14 -0400
Subject: [PATCH 08/18] Permission builder

---
 .../utilities/CippAppPermissionBuilder.jsx    | 187 +++++++++++++++---
 src/components/utilities/CippDropzone.jsx     |  38 +++-
 2 files changed, 193 insertions(+), 32 deletions(-)

diff --git a/src/components/utilities/CippAppPermissionBuilder.jsx b/src/components/utilities/CippAppPermissionBuilder.jsx
index d179285693f1..93b1b9abef8c 100644
--- a/src/components/utilities/CippAppPermissionBuilder.jsx
+++ b/src/components/utilities/CippAppPermissionBuilder.jsx
@@ -1,4 +1,4 @@
-import React, { useEffect, useRef, useState } from 'react'
+import React, { useEffect, useRef, useState, useCallback } from 'react'
 import {
   CButton,
   CCallout,
@@ -15,7 +15,12 @@ import { Field, Form, FormSpy } from 'react-final-form'
 import { RFFCFormRadioList, RFFSelectSearch } from 'src/components/forms'
 import { useGenericGetRequestQuery, useLazyGenericPostRequestQuery } from 'src/store/api/app'
 import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
-import { TenantSelectorMultiple, ModalService } from 'src/components/utilities'
+import {
+  TenantSelectorMultiple,
+  ModalService,
+  CippOffcanvas,
+  CippCodeBlock,
+} from 'src/components/utilities'
 import PropTypes from 'prop-types'
 import { OnChange } from 'react-final-form-listeners'
 import { useListTenantsQuery } from 'src/store/api/tenants'
@@ -24,11 +29,19 @@ import { CippTable } from '../tables'
 import { Row } from 'react-bootstrap'
 import { cellGenericFormatter } from '../tables/CellGenericFormat'
 import Skeleton from 'react-loading-skeleton'
+import CippDropzone from './CippDropzone'
+import { Editor } from '@monaco-editor/react'
+import { useSelector } from 'react-redux'
+import { CippCallout } from '../layout'
 
 const CippAppPermissionBuilder = ({ onSubmit, currentPermissions = {}, isSubmitting }) => {
   const [selectedApp, setSelectedApp] = useState([])
   const [permissionsImported, setPermissionsImported] = useState(false)
   const [newPermissions, setNewPermissions] = useState({})
+  const [importedManifest, setImportedManifest] = useState(null)
+  const [manifestVisible, setManifestVisible] = useState(false)
+  const currentTheme = useSelector((state) => state.app.currentTheme)
+  const [calloutMessage, setCalloutMessage] = useState(null)
 
   const {
     data: servicePrincipals = [],
@@ -63,6 +76,8 @@ const CippAppPermissionBuilder = ({ onSubmit, currentPermissions = {}, isSubmitt
       onConfirm: () => {
         setSelectedApp([])
         setPermissionsImported(false)
+        setManifestVisible(false)
+        setCalloutMessage('Permissions reset to default.')
       },
     })
   }
@@ -161,26 +176,30 @@ const CippAppPermissionBuilder = ({ onSubmit, currentPermissions = {}, isSubmitt
           resourceAppId: sp.appId,
           resourceAccess: [],
         }
-        appRoles.map((role) => {
-          requiredResourceAccess.resourceAccess.push({
-            id: role.id,
-            type: 'Role',
-          })
-        })
-        delegatedPermissions.map((perm) => {
-          // permission not a guid skip
-          if (/^[0-9a-f]{8}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{12}$/i.test(perm.id)) {
+        if (appRoles) {
+          appRoles.map((role) => {
             requiredResourceAccess.resourceAccess.push({
-              id: perm.id,
-              type: 'Scope',
+              id: role.id,
+              type: 'Role',
             })
-          } else {
-            additionalRequiredResourceAccess.resourceAccess.push({
-              id: perm.id,
-              type: 'Scope',
-            })
-          }
-        })
+          })
+        }
+        if (delegatedPermissions) {
+          delegatedPermissions.map((perm) => {
+            // permission not a guid skip
+            if (/^[0-9a-f]{8}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{12}$/i.test(perm.id)) {
+              requiredResourceAccess.resourceAccess.push({
+                id: perm.id,
+                type: 'Scope',
+              })
+            } else {
+              additionalRequiredResourceAccess.resourceAccess.push({
+                id: perm.id,
+                type: 'Scope',
+              })
+            }
+          })
+        }
         if (requiredResourceAccess.resourceAccess.length > 0) {
           manifest.requiredResourceAccess.push(requiredResourceAccess)
         }
@@ -223,7 +242,69 @@ const CippAppPermissionBuilder = ({ onSubmit, currentPermissions = {}, isSubmitt
     }
   }
 
-  const importManifest = () => {}
+  const importManifest = () => {
+    var updatedPermissions = { Permissions: {} }
+    var manifest = importedManifest
+    var requiredResourceAccess = manifest.requiredResourceAccess
+    var selectedServicePrincipals = []
+
+    requiredResourceAccess.map((resourceAccess) => {
+      var sp = servicePrincipals?.Results?.find((sp) => sp.appId === resourceAccess.resourceAppId)
+      if (sp) {
+        var appRoles = []
+        var delegatedPermissions = []
+        selectedServicePrincipals.push(sp)
+        resourceAccess.resourceAccess.map((access) => {
+          if (access.type === 'Role') {
+            var role = sp.appRoles.find((role) => role.id === access.id)
+            if (role) {
+              appRoles.push({
+                id: role.id,
+                value: role.value,
+              })
+            }
+          } else if (access.type === 'Scope') {
+            var scope = sp.publishedPermissionScopes.find((scope) => scope.id === access.id)
+            if (scope) {
+              delegatedPermissions.push({
+                id: scope.id,
+                value: scope.value,
+              })
+            }
+          }
+        })
+        updatedPermissions.Permissions[sp.appId] = {
+          applicationPermissions: appRoles,
+          delegatedPermissions: delegatedPermissions,
+        }
+      }
+    })
+    setNewPermissions(updatedPermissions)
+    setSelectedApp(selectedServicePrincipals)
+    setImportedManifest(null)
+    setPermissionsImported(true)
+    setManifestVisible(false)
+    setCalloutMessage('Manifest imported successfully.')
+  }
+
+  const onManifestImport = useCallback((acceptedFiles) => {
+    acceptedFiles.forEach((file) => {
+      const reader = new FileReader()
+      reader.onabort = () => console.log('file reading was aborted')
+      reader.onerror = () => console.log('file reading has failed')
+      reader.onload = () => {
+        console.log(reader.result)
+        try {
+          var manifest = JSON.parse(reader.result)
+          setImportedManifest(manifest)
+          console.log(importedManifest)
+        } catch {
+          console.log('invalid manifest')
+        }
+      }
+      reader.readAsText(file)
+    })
+  }, [])
 
   useEffect(() => {
     try {
@@ -658,7 +739,7 @@ const CippAppPermissionBuilder = ({ onSubmit, currentPermissions = {}, isSubmitt
                         <CTooltip content="Import Manifest">
                           <CButton
                             onClick={() => {
-                              importManifest()
+                              setManifestVisible(true)
                             }}
                             className={`circular-button`}
                             title={'+'}
@@ -668,7 +749,67 @@ const CippAppPermissionBuilder = ({ onSubmit, currentPermissions = {}, isSubmitt
                         </CTooltip>
                       </CCol>
                     </CRow>
-
+                    <CippOffcanvas
+                      title="Import Manifest"
+                      id="importManifest"
+                      visible={manifestVisible}
+                      onHide={() => {
+                        setManifestVisible(false)
+                      }}
+                      addedClass="offcanvas-large"
+                      placement="end"
+                    >
+                      <CRow>
+                        <CCol xl={12}>
+                          <p>
+                            Import a JSON application manifest to set permissions. This will
+                            overwrite any existing permissions.
+                          </p>
+                        </CCol>
+                      </CRow>
+                      <CRow>
+                        <CCol xl={12}>
+                          <CippDropzone
+                            onDrop={onManifestImport}
+                            accept={{ 'application/json': ['.json'] }}
+                            dropMessage="Drag a JSON app manifest here, or click to select one."
+                            maxFiles={1}
+                            returnCard={false}
+                          />
+                        </CCol>
+                      </CRow>
+                      {importedManifest && (
+                        <>
+                          <CRow className="mt-4">
+                            <CCol xl={12}>
+                              <CButton onClick={() => importManifest()}>
+                                <FontAwesomeIcon icon="save" className="me-2" /> Import
+                              </CButton>
+                            </CCol>
+                          </CRow>
+                          <CRow className="mt-3">
+                            <CCol xl={12}>
+                              <h4>Preview</h4>
+                              <CippCodeBlock
+                                code={JSON.stringify(importedManifest, null, 2)}
+                                language="json"
+                                showLineNumbers={false}
+                              />
+                            </CCol>
+                          </CRow>
+                        </>
+                      )}
+                    </CippOffcanvas>
+                    {calloutMessage && (
+                      <CRow>
+                        <CCol>
+                          <CippCallout dismissible={true} color="info">
+                            <FontAwesomeIcon icon="info-circle" className="me-2" />
+                            {calloutMessage}
+                          </CippCallout>
+                        </CCol>
+                      </CRow>
+                    )}
                     <CAccordion>
                       <>
                         {selectedApp?.length > 0 &&
diff --git a/src/components/utilities/CippDropzone.jsx b/src/components/utilities/CippDropzone.jsx
index e42ab066ae6f..4623b03401bd 100644
--- a/src/components/utilities/CippDropzone.jsx
+++ b/src/components/utilities/CippDropzone.jsx
@@ -49,21 +49,40 @@ const Container = styled.div`
   transition: border 0.24s ease-in-out;
 `
 
-const CippDropzone = ({ title, onDrop, dropMessage, accept, maxFiles = 1, ...props }) => {
+const CippDropzone = ({
+  title,
+  onDrop,
+  dropMessage,
+  accept,
+  maxFiles = 1,
+  returnCard = true,
+  ...props
+}) => {
   const { getRootProps, getInputProps, isFocused, isDragAccept, isDragReject } = useDropzone({
     onDrop,
     accept: accept,
     maxFiles: maxFiles,
   })
   return (
-    <CippContentCard title={title} {...props}>
-      <div className="container my-2">
-        <Container {...getRootProps({ isFocused, isDragAccept, isDragReject })}>
-          <input {...getInputProps()} />
-          <span>{dropMessage}</span>
-        </Container>
-      </div>
-    </CippContentCard>
+    <>
+      {returnCard ? (
+        <CippContentCard title={title} {...props}>
+          <div className="container my-2">
+            <Container {...getRootProps({ isFocused, isDragAccept, isDragReject })}>
+              <input {...getInputProps()} />
+              <span>{dropMessage}</span>
+            </Container>
+          </div>
+        </CippContentCard>
+      ) : (
+        <div className="container my-2">
+          <Container {...getRootProps({ isFocused, isDragAccept, isDragReject })}>
+            <input {...getInputProps()} />
+            <span>{dropMessage}</span>
+          </Container>
+        </div>
+      )}
+    </>
   )
 }
 
@@ -73,6 +92,7 @@ CippDropzone.propTypes = {
   dropMessage: PropTypes.string,
   accept: PropTypes.object,
   maxFiles: PropTypes.number,
+  returnCard: PropTypes.bool,
 }
 
 export default CippDropzone

From 7e87b2a1cdde1d23a885f31aa829bbbf02966ad5 Mon Sep 17 00:00:00 2001
From: John Duprey <jwd@johnwduprey.com>
Date: Wed, 14 Aug 2024 16:09:56 -0400
Subject: [PATCH 09/18] Create service principal capabilities

---
 .../utilities/CippAppPermissionBuilder.jsx        | 15 +++++++++++++--
 1 file changed, 13 insertions(+), 2 deletions(-)

diff --git a/src/components/utilities/CippAppPermissionBuilder.jsx b/src/components/utilities/CippAppPermissionBuilder.jsx
index 93b1b9abef8c..e4c2ee3bfdf8 100644
--- a/src/components/utilities/CippAppPermissionBuilder.jsx
+++ b/src/components/utilities/CippAppPermissionBuilder.jsx
@@ -13,7 +13,7 @@ import {
 } from '@coreui/react'
 import { Field, Form, FormSpy } from 'react-final-form'
 import { RFFCFormRadioList, RFFSelectSearch } from 'src/components/forms'
-import { useGenericGetRequestQuery, useLazyGenericPostRequestQuery } from 'src/store/api/app'
+import { useGenericGetRequestQuery, useLazyGenericGetRequestQuery } from 'src/store/api/app'
 import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
 import {
   TenantSelectorMultiple,
@@ -53,6 +53,8 @@ const CippAppPermissionBuilder = ({ onSubmit, currentPermissions = {}, isSubmitt
     path: 'api/ExecServicePrincipals',
   })
 
+  const [createServicePrincipal, createResult] = useLazyGenericGetRequestQuery()
+
   const removeServicePrincipal = (appId) => {
     var servicePrincipal = selectedApp.find((sp) => sp?.appId === appId)
     var newServicePrincipals = selectedApp.filter((sp) => sp?.appId !== appId)
@@ -91,6 +93,15 @@ const CippAppPermissionBuilder = ({ onSubmit, currentPermissions = {}, isSubmitt
     }
   }
 
+  const onCreateServicePrincipal = (appId) => {
+    createServicePrincipal({
+      path: 'api/ExecServicePrincipals?Action=Create&AppId=' + appId,
+    }).then(() => {
+      refetchSpList()
+      setCalloutMessage(createResult?.data?.Results)
+    })
+  }
+
   const addPermissionRow = (servicePrincipal, permissionType, permission) => {
     var updatedPermissions = JSON.parse(JSON.stringify(newPermissions))
 
@@ -683,7 +694,7 @@ const CippAppPermissionBuilder = ({ onSubmit, currentPermissions = {}, isSubmitt
                             refreshFunction={() => refetchSpList()}
                             allowCreate={true}
                             onCreateOption={(newSp) => {
-                              console.log(newSp)
+                              onCreateServicePrincipal(newSp)
                             }}
                             placeholder="(Advanced) Select a Service Principal"
                           />

From f22f756ed8dec5115bf0c12bf232b3bc7df9a36b Mon Sep 17 00:00:00 2001
From: John Duprey <jwd@johnwduprey.com>
Date: Wed, 14 Aug 2024 18:39:29 -0400
Subject: [PATCH 10/18] Permission builder

---
 .../utilities/CippAppPermissionBuilder.jsx    | 79 +++++++++++++++++++
 .../components/SettingsAppPermissions.jsx     | 13 ++-
 2 files changed, 88 insertions(+), 4 deletions(-)

diff --git a/src/components/utilities/CippAppPermissionBuilder.jsx b/src/components/utilities/CippAppPermissionBuilder.jsx
index e4c2ee3bfdf8..c986b67145f2 100644
--- a/src/components/utilities/CippAppPermissionBuilder.jsx
+++ b/src/components/utilities/CippAppPermissionBuilder.jsx
@@ -821,6 +821,85 @@ const CippAppPermissionBuilder = ({ onSubmit, currentPermissions = {}, isSubmitt
                         </CCol>
                       </CRow>
                     )}
+
+                    {newPermissions?.MissingPermissions &&
+                      newPermissions?.Type === 'Table' &&
+                      Object.keys(newPermissions?.MissingPermissions).length > 0 && (
+                        <CRow>
+                          <CCol>
+                            <CCallout color="warning">
+                              <CRow>
+                                <CCol xl={10} sm={12}>
+                                  <FontAwesomeIcon icon="exclamation-triangle" className="me-2" />
+                                  <b>New Permissions Available</b>
+                                  {Object.keys(newPermissions?.MissingPermissions).map((perm) => {
+                                    // translate appid to display name
+                                    var sp = servicePrincipals?.Results?.find(
+                                      (sp) => sp.appId === perm,
+                                    )
+                                    return (
+                                      <div key={`missing-${perm}`}>
+                                        {sp?.displayName}:{' '}
+                                        {Object.keys(newPermissions?.MissingPermissions[perm]).map(
+                                          (type) => {
+                                            return (
+                                              <>
+                                                {newPermissions?.MissingPermissions[perm][type]
+                                                  .length > 0 && (
+                                                  <span key={`missing-${perm}-${type}`}>
+                                                    {type == 'applicationPermissions'
+                                                      ? 'Application'
+                                                      : 'Delegated'}{' '}
+                                                    -{' '}
+                                                    {newPermissions?.MissingPermissions[perm][type]
+                                                      .map((p) => {
+                                                        return p.value
+                                                      })
+                                                      .join(', ')}
+                                                  </span>
+                                                )}
+                                              </>
+                                            )
+                                          },
+                                        )}
+                                      </div>
+                                    )
+                                  })}
+                                </CCol>
+                                <CCol xl={2} sm={12} className="my-auto">
+                                  <CTooltip content="Add Missing Permissions">
+                                    <CButton
+                                      onClick={() => {
+                                        var updatedPermissions = JSON.parse(
+                                          JSON.stringify(newPermissions),
+                                        )
+                                        Object.keys(newPermissions?.MissingPermissions).map(
+                                          (perm) => {
+                                            Object.keys(
+                                              newPermissions?.MissingPermissions[perm],
+                                            ).map((type) => {
+                                              newPermissions?.MissingPermissions[perm][type].map(
+                                                (p) => {
+                                                  updatedPermissions.Permissions[perm][type].push(p)
+                                                },
+                                              )
+                                            })
+                                          },
+                                        )
+                                        updatedPermissions.MissingPermissions = {}
+                                        setNewPermissions(updatedPermissions)
+                                      }}
+                                      className={`circular-button float-end`}
+                                    >
+                                      <FontAwesomeIcon icon="wrench" />
+                                    </CButton>
+                                  </CTooltip>
+                                </CCol>
+                              </CRow>
+                            </CCallout>
+                          </CCol>
+                        </CRow>
+                      )}
                     <CAccordion>
                       <>
                         {selectedApp?.length > 0 &&
diff --git a/src/views/cipp/app-settings/components/SettingsAppPermissions.jsx b/src/views/cipp/app-settings/components/SettingsAppPermissions.jsx
index c3b6da3ffbd7..d36dffb0b597 100644
--- a/src/views/cipp/app-settings/components/SettingsAppPermissions.jsx
+++ b/src/views/cipp/app-settings/components/SettingsAppPermissions.jsx
@@ -28,13 +28,18 @@ const SettingsAppPermissions = () => {
     genericPostRequest({
       path: 'api/ExecSAMAppPermissions?Action=Update',
       values: values,
+    }).then(() => {
+      refetchSam()
     })
   }
 
-  const { data: samAppPermissions = [], isFetching: samAppPermissionsFetching } =
-    useGenericGetRequestQuery({
-      path: 'api/ExecSAMAppPermissions',
-    })
+  const {
+    data: samAppPermissions = [],
+    isFetching: samAppPermissionsFetching,
+    refetch: refetchSam,
+  } = useGenericGetRequestQuery({
+    path: 'api/ExecSAMAppPermissions',
+  })
 
   return (
     <CippButtonCard title="CIPP-SAM API Permissions" titleType="big">

From d642177ad73c52b5f621de97377161f70108c2aa Mon Sep 17 00:00:00 2001
From: John Duprey <jwd@johnwduprey.com>
Date: Fri, 16 Aug 2024 12:17:38 -0400
Subject: [PATCH 11/18] Fix CellTable item count for single objects

---
 src/components/tables/CellTable.jsx | 11 ++++++++++-
 1 file changed, 10 insertions(+), 1 deletion(-)

diff --git a/src/components/tables/CellTable.jsx b/src/components/tables/CellTable.jsx
index cfcbd5403065..2186a406fe6b 100644
--- a/src/components/tables/CellTable.jsx
+++ b/src/components/tables/CellTable.jsx
@@ -23,6 +23,15 @@ export default function cellTable(
   if (columnProp === undefined || columnProp === null) {
     columnProp = []
   } else {
+    var objectLength = 1
+    var lengthText = 'Item'
+    if (columnProp instanceof Array) {
+      objectLength = columnProp.length
+      if (objectLength > 1) {
+        lengthText = 'Items'
+      }
+    }
+
     if (!Array.isArray(columnProp) && typeof columnProp === 'object') {
       columnProp = Object.keys(columnProp).map((key) => {
         return {
@@ -93,7 +102,7 @@ export default function cellTable(
       size="sm"
       onClick={() => handleTable({ columnProp })}
     >
-      {columnProp.length} Items
+      {objectLength} {lengthText}
     </CButton>
   )
 }

From 22c72644a9da76cffcc9c2d4a8e1c1725eddc824 Mon Sep 17 00:00:00 2001
From: John Duprey <jwd@johnwduprey.com>
Date: Fri, 16 Aug 2024 17:29:11 -0400
Subject: [PATCH 12/18] Huntress RogueApps

- Add new scripted alert
- Update alert wizard to accept a description property for scripted alerts
---
 src/data/alerts.json                          |  6 +++++
 .../tenant/administration/AlertWizard.jsx     | 24 +++++++++++++++++++
 2 files changed, 30 insertions(+)

diff --git a/src/data/alerts.json b/src/data/alerts.json
index 835216740c4d..13f18265caf4 100644
--- a/src/data/alerts.json
+++ b/src/data/alerts.json
@@ -99,5 +99,11 @@
     "name": "DeviceCompliance",
     "label": "Alert on device compliance issues",
     "recommendedRunInterval": "4h"
+  },
+  {
+    "name": "HuntressRogueApps",
+    "label": "Alert on Huntress Rogue Apps detected",
+    "recommendedRunInterval": "4h",
+    "description": "Huntress has provided a repository of known rogue apps that are commonly used in BEC, data exfiltration and other Microsoft 365 attacks. This alert will notify you if any of these apps are detected in the selected tenant(s). For more information, see <a href='https://huntresslabs.github.io/rogueapps/' target='_blank'>https://huntresslabs.github.io/rogueapps/</a>."
   }
 ]
diff --git a/src/views/tenant/administration/AlertWizard.jsx b/src/views/tenant/administration/AlertWizard.jsx
index 9b5253ef7351..e444c11ec123 100644
--- a/src/views/tenant/administration/AlertWizard.jsx
+++ b/src/views/tenant/administration/AlertWizard.jsx
@@ -21,6 +21,7 @@ import auditLogSchema from 'src/data/AuditLogSchema.json'
 import auditLogTemplates from 'src/data/AuditLogTemplates.json'
 import Skeleton from 'react-loading-skeleton'
 import { required } from 'src/validators'
+import HtmlParser from 'react-html-parser'
 
 const AlertWizard = () => {
   const tenantDomain = useSelector((state) => state.app.currentTenant.defaultDomainName)
@@ -112,6 +113,18 @@ const AlertWizard = () => {
     }
   }
 
+  const getScriptDescription = () => {
+    const values = currentFormState?.values
+    if (values) {
+      const command = values.command?.value
+      if (command?.description) {
+        return HtmlParser(command.description)
+      } else {
+        return null
+      }
+    }
+  }
+
   const setAuditForm = (e) => {
     const preset = presetValues.find((p) => p.value === e.value)
     setAuditFormState(preset.template)
@@ -368,6 +381,16 @@ const AlertWizard = () => {
                       render={({ handleSubmit, submitting, values }) => {
                         return (
                           <CForm id="alertForm" onSubmit={handleSubmit}>
+                            {getScriptDescription() && (
+                              <CRow className="mb-3">
+                                <CCol>
+                                  <CCallout color="info">
+                                    <FontAwesomeIcon icon="info-circle" className="me-2" />
+                                    {getScriptDescription()}
+                                  </CCallout>
+                                </CCol>
+                              </CRow>
+                            )}
                             <CRow className="mb-3">
                               <CCol>
                                 <RFFSelectSearch
@@ -382,6 +405,7 @@ const AlertWizard = () => {
                                 />
                               </CCol>
                             </CRow>
+
                             <Condition when="command.value.requiresInput" is={true}>
                               <CRow className="mb-3">
                                 <CCol>

From b86f0dd65321e28ff61a0752147fc2595c024d59 Mon Sep 17 00:00:00 2001
From: Chris Brannon <ChrisBr@nnon.tech>
Date: Sat, 17 Aug 2024 17:03:54 -0400
Subject: [PATCH 13/18] Assign & Unassign Teams Voice User Numbers

---
 src/views/teams-share/teams/BusinessVoice.jsx | 249 ++++++++++++++----
 1 file changed, 194 insertions(+), 55 deletions(-)

diff --git a/src/views/teams-share/teams/BusinessVoice.jsx b/src/views/teams-share/teams/BusinessVoice.jsx
index 6c132806d8bf..ada434df6895 100644
--- a/src/views/teams-share/teams/BusinessVoice.jsx
+++ b/src/views/teams-share/teams/BusinessVoice.jsx
@@ -1,68 +1,207 @@
-import React from 'react'
+import React, { useState } from 'react'
+import { CButton } from '@coreui/react'
 import { useSelector } from 'react-redux'
 import { CellBoolean } from 'src/components/tables'
 import { CippPageList } from 'src/components/layout'
-
-const Formatter = (cell) => CellBoolean({ cell })
-const columns = [
-  {
-    name: 'Assigned to User',
-    selector: (row) => row['AssignedTo'],
-    sortable: true,
-    exportSelector: 'AssignedTo',
-  },
-  {
-    name: 'Phone Number',
-    selector: (row) => row['TelephoneNumber'],
-    sortable: true,
-    exportSelector: 'TelephoneNumber',
-  },
-  {
-    name: 'Number Type',
-    selector: (row) => row['NumberType'],
-    sortable: true,
-    exportSelector: 'NumberType',
-  },
-  {
-    name: 'Country',
-    selector: (row) => row['IsoCountryCode'],
-    sortable: true,
-    exportSelector: 'IsCountryCode',
-  },
-  {
-    name: 'Location',
-    selector: (row) => row['PlaceName'],
-    sortable: true,
-    exportSelector: 'PlaceName',
-  },
-  {
-    name: 'Activation State',
-    selector: (row) => row['ActivationState'],
-    formatter: Formatter,
-    exportSelector: 'ActivationState',
-    sortable: true,
-  },
-  {
-    name: 'Operator Connect',
-    selector: (row) => row['IsOperatorConnect'],
-    formatter: Formatter,
-    sortable: true,
-    exportSelector: 'IsOperatorConnect',
-  },
-  {
-    name: 'Purchased on',
-    selector: (row) => row['AcquisitionDate'],
-    sortable: true,
-    exportSelector: 'AcquisitionDate',
-  },
-]
+import { TitleButton } from 'src/components/buttons'
+import { CippActionsOffcanvas } from 'src/components/utilities'
+import { faEllipsisV } from '@fortawesome/free-solid-svg-icons'
+import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
 
 const BusinessVoice = () => {
   const tenant = useSelector((state) => state.app.currentTenant)
+  const Offcanvas = (row, rowIndex, formatExtraData) => {
+    const tenant = useSelector((state) => state.app.currentTenant)
+    const [ocVisible, setOCVisible] = useState(false)
+    return (
+      <>
+        <CButton size="sm" color="link" onClick={() => setOCVisible(true)}>
+          <FontAwesomeIcon icon={faEllipsisV} />
+        </CButton>
+        <CippActionsOffcanvas
+          title="Extended Information"
+          extendedInfo={[
+            {
+              label: 'Phone Number',
+              value: `${row.TelephoneNumber ?? ' '}`,
+            },
+            {
+              label: 'Licensed Usage',
+              value: `${usageFormatter(row.AcquiredCapabilities) ?? ' '}`,
+            },
+            {
+              label: 'Assignment Status',
+              value: `${row.AssignmentStatus ?? ' '}`,
+            },
+            {
+              label: 'Assigned to User',
+              value: `${row.AssignedTo ?? ' '}`,
+            },
+          ]}
+          actions={[
+            {
+              label: 'Assign User',
+              color: 'info',
+              modal: true,
+              modalType: 'POST',
+              modalBody: {
+                PhoneNumber: row.TelephoneNumber,
+                TenantFilter: tenant.defaultDomainName,
+                PhoneNumberType: row.NumberType,
+                locationOnly: false,
+              },
+              modalUrl: `/api/ExecTeamsVoicePhoneNumberAssignment`,
+              modalDropdown: {
+                url: `/api/listUsers?TenantFilter=${tenant.defaultDomainName}`,
+                labelField: 'displayName',
+                valueField: 'userPrincipalName',
+              },
+              modalMessage: 'Select the User to assign.',
+            },
+            {
+              label: 'Unassign User',
+              color: 'info',
+              modal: true,
+              modalType: 'POST',
+              modalBody: {
+                PhoneNumber: row.TelephoneNumber,
+                TenantFilter: tenant.defaultDomainName,
+                AssignedTo: row.AssignedTo,
+                PhoneNumberType: row.NumberType,
+              },
+              modalUrl: `/api/ExecRemoveTeamsVoicePhoneNumberAssignment`,
+              modalMessage: 'Are you sure you want to remove the assignment?',
+            },
+            {
+              label: 'Set Emergency Location',
+              color: 'info',
+              modal: true,
+              modalType: 'POST',
+              modalBody: {
+                PhoneNumber: row.TelephoneNumber,
+                TenantFilter: tenant.defaultDomainName,
+                locationOnly: true,
+              },
+              modalUrl: `/api/ExecTeamsVoicePhoneNumberAssignment`,
+              modalDropdown: {
+                url: `/api/ListTeamsLisLocation?TenantFilter=${tenant.defaultDomainName}`,
+                labelField: 'Description',
+                valueField: 'LocationId',
+              },
+              modalMessage: 'Select the Emergency Location.',
+            },
+          ]}
+          placement="end"
+          visible={ocVisible}
+          id={row.id}
+          hideFunction={() => setOCVisible(false)}
+        />
+      </>
+    )
+  }
+  const Formatter = (cell) => CellBoolean({ cell })
+  const usageFormatter = (cell) => {
+    if (cell.includes('UserAssignment')) {
+      return 'User'
+    }
+    if (cell.includes('FirstPartyAppAssignment')) {
+      return 'Voice App'
+    }
+    if (cell.includes('ConferenceAssignment')) {
+      return 'Conference'
+    }
+    return cell[0]
+  }
+  const columns = [
+    {
+      name: 'Assigned to User',
+      selector: (row) => row['AssignedTo'],
+      sortable: true,
+      exportSelector: 'AssignedTo',
+    },
+    {
+      name: 'Phone Number',
+      selector: (row) => row['TelephoneNumber'],
+      sortable: true,
+      exportSelector: 'TelephoneNumber',
+    },
+    {
+      name: 'Assignment Status',
+      selector: (row) => row['AssignmentStatus'],
+      sortable: true,
+      exportSelector: 'AssignmentStatus',
+    },
+    {
+      name: 'Number Type',
+      selector: (row) => row['NumberType'],
+      sortable: true,
+      exportSelector: 'NumberType',
+    },
+    {
+      name: 'Licensed Usage',
+      selector: (row) => usageFormatter(row['AcquiredCapabilities']),
+      sortable: true,
+      exportSelector: 'AcquiredCapabilities',
+    },
+    {
+      name: 'Country',
+      selector: (row) => row['IsoCountryCode'],
+      sortable: true,
+      exportSelector: 'IsCountryCode',
+    },
+    {
+      name: 'Location',
+      selector: (row) => row['PlaceName'],
+      sortable: true,
+      exportSelector: 'PlaceName',
+    },
+    {
+      name: 'Activation State',
+      selector: (row) => row['ActivationState'],
+      formatter: Formatter,
+      exportSelector: 'ActivationState',
+      sortable: true,
+    },
+    {
+      name: 'Operator Connect',
+      selector: (row) => row['IsOperatorConnect'],
+      formatter: Formatter,
+      sortable: true,
+      exportSelector: 'IsOperatorConnect',
+    },
+    {
+      name: 'Purchased on',
+      selector: (row) => row['AcquisitionDate'],
+      sortable: true,
+      exportSelector: 'AcquisitionDate',
+    },
+    {
+      name: 'Actions',
+      cell: Offcanvas,
+    },
+  ]
+  const titleButtons = (
+    <div style={{ display: 'flex', alignItems: 'right' }}>
+      <div style={{ marginLeft: '10px' }}>
+        <TitleButton
+          key="block-caller"
+          href="/teams-share/teams/business-voice-block-caller"
+          title="Block Caller"
+        />
+      </div>
+    </div>
+  )
   return (
     <CippPageList
       title="Teams Business Voice"
+      //titleButton={titleButtons}
       datatable={{
+        filterlist: [
+          {
+            filterName: 'Unassigned User Numbers',
+            filter: 'Complex: AssignmentStatus eq Unassigned; AcquiredCapabilities like UserAssignment',
+          },
+        ],
         columns,
         path: '/api/ListTeamsVoice',
         reportName: `${tenant?.defaultDomainName}-BusinessVoice`,

From 58e59823900b68e93921d88055abd9cf03c4c52b Mon Sep 17 00:00:00 2001
From: Chris Brannon <ChrisBr@nnon.tech>
Date: Sat, 17 Aug 2024 17:26:25 -0400
Subject: [PATCH 14/18] Formatting Issue

---
 src/views/teams-share/teams/BusinessVoice.jsx | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/src/views/teams-share/teams/BusinessVoice.jsx b/src/views/teams-share/teams/BusinessVoice.jsx
index ada434df6895..5f2c0d32598a 100644
--- a/src/views/teams-share/teams/BusinessVoice.jsx
+++ b/src/views/teams-share/teams/BusinessVoice.jsx
@@ -199,7 +199,8 @@ const BusinessVoice = () => {
         filterlist: [
           {
             filterName: 'Unassigned User Numbers',
-            filter: 'Complex: AssignmentStatus eq Unassigned; AcquiredCapabilities like UserAssignment',
+            filter:
+              'Complex: AssignmentStatus eq Unassigned; AcquiredCapabilities like UserAssignment',
           },
         ],
         columns,

From cc0eda1b7ac6c105c1ae5f70b9a817102117b88e Mon Sep 17 00:00:00 2001
From: KelvinTegelaar <Kelvin@limenetworks.nl>
Date: Sun, 18 Aug 2024 18:29:48 +0200
Subject: [PATCH 15/18] Fixes jitadmin issues

---
 src/views/identity/administration/DeployJITAdmin.jsx | 9 ++++++---
 1 file changed, 6 insertions(+), 3 deletions(-)

diff --git a/src/views/identity/administration/DeployJITAdmin.jsx b/src/views/identity/administration/DeployJITAdmin.jsx
index 81d23666fa61..146ab7d6fef1 100644
--- a/src/views/identity/administration/DeployJITAdmin.jsx
+++ b/src/views/identity/administration/DeployJITAdmin.jsx
@@ -47,10 +47,13 @@ const DeployJITAdmin = () => {
   const onSubmit = (values) => {
     const startTime = Math.floor(startDate.getTime() / 1000)
     const endTime = Math.floor(endDate.getTime() / 1000)
+
     const shippedValues = {
       TenantFilter: tenantDomain,
-      UserId: values.UserId?.value,
-      UserPrincipalName: `${values.username}@${values.domain}`,
+      UserId: values.UserId?.value.id,
+      UserPrincipalName: values.username
+        ? `${values.username}@${values.domain}`
+        : values.UserId?.value.userPrincipalName,
       FirstName: values.FirstName,
       LastName: values.LastName,
       useraction: values.useraction,
@@ -168,7 +171,7 @@ const DeployJITAdmin = () => {
                             <RFFSelectSearch
                               label={'Users in ' + tenantDomain}
                               values={users?.Results?.map((user) => ({
-                                value: user.id,
+                                value: { userPrincipalName: user.userPrincipalName, id: user.id },
                                 name: `${user.displayName} <${user.userPrincipalName}>`,
                               }))}
                               placeholder={!usersIsFetching ? 'Select user' : 'Loading...'}

From e6258b92973e6ca8c9fc7ead4f1852f476d81682 Mon Sep 17 00:00:00 2001
From: MoltenTesseract <pc.wizz2005@gmail.com>
Date: Mon, 19 Aug 2024 14:44:09 +1000
Subject: [PATCH 16/18] Fix delete rule confirmation text

The delete popup incorrectly asked to confirm to disable the rule, not delete it.
---
 src/views/email-exchange/connectors/ConnectorList.jsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/views/email-exchange/connectors/ConnectorList.jsx b/src/views/email-exchange/connectors/ConnectorList.jsx
index c18d5eeb0004..1f3829abcb1d 100644
--- a/src/views/email-exchange/connectors/ConnectorList.jsx
+++ b/src/views/email-exchange/connectors/ConnectorList.jsx
@@ -57,7 +57,7 @@ const Offcanvas = (row, rowIndex, formatExtraData) => {
             modal: true,
             icon: <FontAwesomeIcon icon={faTrash} className="me-2" />,
             modalUrl: `/api/RemoveExConnector?TenantFilter=${tenant.defaultDomainName}&GUID=${row.Guid}&Type=${row.cippconnectortype}`,
-            modalMessage: 'Are you sure you want to disable this rule?',
+            modalMessage: 'Are you sure you want to delete this rule?',
           },
         ]}
         placement="end"

From aaa50b96f810c51e2f7c3fa9ba167ce201166682 Mon Sep 17 00:00:00 2001
From: KelvinTegelaar <Kelvin@limenetworks.nl>
Date: Mon, 19 Aug 2024 18:58:09 +0200
Subject: [PATCH 17/18] version up

---
 package.json              | 2 +-
 public/version_latest.txt | 2 +-
 version_latest.txt        | 2 +-
 3 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/package.json b/package.json
index 41b4ceedb492..b74d149fe82e 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "cipp",
-  "version": "6.2.2",
+  "version": "6.3.0",
   "description": "The CyberDrain Improved Partner Portal is a portal to help manage administration for Microsoft Partners.",
   "homepage": "https://cipp.app/",
   "bugs": {
diff --git a/public/version_latest.txt b/public/version_latest.txt
index ca06394388d6..798e38995c4d 100644
--- a/public/version_latest.txt
+++ b/public/version_latest.txt
@@ -1 +1 @@
-6.2.2
+6.3.0
diff --git a/version_latest.txt b/version_latest.txt
index ca06394388d6..798e38995c4d 100644
--- a/version_latest.txt
+++ b/version_latest.txt
@@ -1 +1 @@
-6.2.2
+6.3.0

From b3d79e60f23a239c9c049a3d79d4a5240854af58 Mon Sep 17 00:00:00 2001
From: John Duprey <jwd@johnwduprey.com>
Date: Mon, 19 Aug 2024 13:16:47 -0400
Subject: [PATCH 18/18] Fix reset mfa

---
 src/views/identity/administration/Users.jsx | 10 +++++-----
 1 file changed, 5 insertions(+), 5 deletions(-)

diff --git a/src/views/identity/administration/Users.jsx b/src/views/identity/administration/Users.jsx
index 4d236659ad7f..eb0cd4f29f6c 100644
--- a/src/views/identity/administration/Users.jsx
+++ b/src/views/identity/administration/Users.jsx
@@ -99,10 +99,10 @@ const Offcanvas = (row, rowIndex, formatExtraData) => {
           },
           {
             label: 'Rerequire MFA registration',
-            link: entraLink,
             color: 'info',
-            target: '_blank',
-            external: true,
+            modal: true,
+            modalUrl: `/api/ExecResetMFA?TenantFilter=${tenant.defaultDomainName}&ID=${row.userPrincipalName}`,
+            modalMessage: 'Are you sure you want to reset MFA for this user?',
           },
           {
             label: 'Send MFA Push',
@@ -527,8 +527,8 @@ const Users = (row) => {
             {
               label: 'Rerequire MFA registration',
               modal: true,
-              modalUrl: `/api/ExecResetMFA?TenantFilter=!Tenant&ID=!id`,
-              modalMessage: 'Are you sure you want to enable MFA for these users?',
+              modalUrl: `/api/ExecResetMFA?TenantFilter=!Tenant&ID=!userPrincipalName`,
+              modalMessage: 'Are you sure you want to reset MFA for these users?',
             },
             {
               label: 'Set Per-User MFA',