Dev to release

.github/workflows/CodeQL_Analyser.yml

@@ -1,8 +1,6 @@
 ---
 name: 'CodeQL'
-on: # yamllint disable-line rule:truthy
- push:
- branches: [master, main, dev, react]
+on: # yamllint disable-line rule:truthy
  pull_request:
  branches: [master, main, dev, react]
  schedule:

.github/workflows/Node_Project_Check.yml

@@ -1,10 +1,6 @@
 ---
 name: NodeJS Project Check
-on: # yamllint disable-line rule:truthy
- push:
- branches:
- - main
- - dev
+on: # yamllint disable-line rule:truthy
  pull_request:
  branches:
  - main

.github/workflows/Run_Linters.yml

@@ -1,11 +1,6 @@
 ---
 name: Lint Code Base
-on: # yamllint disable-line rule:truthy
- push:
- branches:
- - master
- - main
- - dev
+on: # yamllint disable-line rule:truthy
  pull_request_target:
  branches:
  - master

.vscode/launch.json

@@ -14,6 +14,21 @@
  "type": "node-terminal",
  "preLaunchTask": "RunAllTasks",
  "resolveSourceMapLocations": ["${workspaceFolder}/**", "!**/node_modules/**"]
+ },
+ {
+ "name": "Launch Edge",
+ "request": "launch",
+ "type": "pwa-msedge",
+ "url": "https://localhost:4280",
+ "webRoot": "${workspaceFolder}"
+ },
+ {
+ "name": "Attach to Edge",
+ "port": 9222,
+ "request": "attach",
+ "type": "pwa-msedge",
+ "urlFilter": "https://localhost:4280/*",
+ "webRoot": "${workspaceFolder}"
  }
  ],
  "compounds": [

public/version_latest.txt

@@ -1 +1 @@
-2.2.0
+2.3.0

src/_nav.js

@@ -105,26 +105,40 @@ const _nav = [
  },
  {
  component: CNavItem,
- name: 'List Licences',
+ name: 'Alerts Wizard',
+ to: '/tenant/administration/alertswizard',
+ },
+
+ {
+ component: CNavItem,
+ name: 'List Scheduled Alerts',
+ to: '/tenant/administration/alertsqueue',
+ },
+ ],
+ },
+ {
+ component: CNavGroup,
+ name: 'Reports',
+ section: 'Reports',
+ to: '/tenant/reports',
+ icon: <FontAwesomeIcon icon={faChartBar} className="nav-icon" />,
+ items: [
+ {
+ component: CNavItem,
+ name: 'Graph Explorer',
+ to: '/tenant/administration/graph-explorer',
+ },
+ {
+ component: CNavItem,
+ name: 'Licence Report',
  to: '/tenant/administration/list-licenses',
  },
+
  {
  component: CNavItem,
  name: 'Conditional Access Policies',
  to: '/tenant/administration/conditional-access-policies',
  },
- // Temp removed due to not ready for release
- // {
- // component: CNavItem,
- // name: 'Alerts Wizard',
- // to: '/tenant/administration/alertswizard',
- // },
- // Temp removed due to not ready for release
- // {
- // component: CNavItem,
- // name: 'List Scheduled Alerts',
- // to: '/tenant/administration/alertsqueue',
- // },
  ],
  },
  {

src/components/layout/CippContentCard.js

@@ -7,6 +7,7 @@ export default function CippContentCard({
  title,
  children,
  icon,
+ button,
  bodyClass = null,
  className = null,
 }) {
@@ -15,6 +16,7 @@ export default function CippContentCard({
  <CCardHeader className="d-flex justify-content-between align-items-center">
  <CCardTitle>{title}</CCardTitle>
  {icon ? <FontAwesomeIcon icon={icon} /> : null}
+ {button ? button : null}
  </CCardHeader>
  <CCardBody className={bodyClass}>{children}</CCardBody>
  </CCard>
@@ -25,6 +27,7 @@ CippContentCard.propTypes = {
  title: PropTypes.string.isRequired,
  children: PropTypes.arrayOf(PropTypes.element).isRequired,
  icon: PropTypes.object,
+ button: PropTypes.element,
  bodyClass: PropTypes.string,
  className: PropTypes.string,
 }

src/components/layout/CippMasonry.js

@@ -5,6 +5,11 @@ import { CContainer, CCol } from '@coreui/react'
 
 export function CippMasonryItem({ size, children, className = null }) {
  const columnSizes = {
+ card: {
+ xs: 12,
+ lg: 2,
+ xl: 3,
+ },
  single: {
  xs: 12,
  lg: 6,
@@ -20,6 +25,16 @@ export function CippMasonryItem({ size, children, className = null }) {
  lg: 12,
  xl: 12,
  },
+ full: {
+ xs: 12,
+ lg: 12,
+ xl: 12,
+ },
+ half: {
+ xs: 12,
+ lg: 6,
+ xl: 6,
+ },
  }
 
  return (
@@ -30,12 +45,35 @@ export function CippMasonryItem({ size, children, className = null }) {
 }
 
 CippMasonryItem.propTypes = {
- size: PropTypes.oneOf(['single', 'double', 'triple']),
+ size: PropTypes.oneOf(['single', 'double', 'triple', 'full', 'half']),
  children: PropTypes.object,
  className: PropTypes.string,
 }
 
-export function CippMasonry({ children, className = null }) {
+export function CippMasonry({ columns = 3, children, className = null }) {
+ const numberOfColumns = {
+ 1: {
+ xs: 12,
+ lg: 12,
+ xl: 12,
+ },
+ 2: {
+ xs: 12,
+ lg: 6,
+ xl: 6,
+ },
+ 3: {
+ xs: 12,
+ lg: 4,
+ xl: 4,
+ },
+ 4: {
+ xs: 12,
+ lg: 3,
+ xl: 3,
+ },
+ }
+
  const CippMasonryOptions = {
  transitionDuration: 0,
  percentPosition: true,
@@ -50,14 +88,15 @@ export function CippMasonry({ children, className = null }) {
  options={CippMasonryOptions}
  enableResizableChildren={true}
  >
- <CCol className="cipp-masonry-sizer" xl={4} lg={6} xs={12}></CCol>
+ <CCol className="cipp-masonry-sizer" {...numberOfColumns[columns]}></CCol>
  {children}
  </Masonry>
  </CContainer>
  )
 }
 
 CippMasonry.propTypes = {
+ columns: PropTypes.oneOf([1, 2, 3]),
  children: PropTypes.array,
  className: PropTypes.string,
 }

src/components/tables/CippTable.js

@@ -34,22 +34,15 @@ const customSort = (rows, selector, direction) => {
  // use the selector to resolve your field names by passing the sort comparitors
  let aField
  let bField
- if (typeof selector(a) === 'string') {
- aField = selector(a).toLowerCase()
- } else {
- aField = selector(a)
- }
- if (typeof selector(b) === 'string') {
- bField = selector(b).toLowerCase()
- } else {
- bField = selector(b)
- }
+
+ aField = selector(a)
+ bField = selector(b)
 
  let comparison = 0
 
- if (aField > bField) {
+ if (aField?.toString().localeCompare(bField, 'en', { numeric: true }) > 0) {
  comparison = 1
- } else if (aField < bField) {
+ } else if (aField?.toString().localeCompare(bField, 'en', { numeric: true }) < 0) {
  comparison = -1
  }
 

src/components/utilities/CippActionsOffcanvas.js

@@ -10,6 +10,9 @@ import { useNavigate } from 'react-router-dom'
 export default function CippActionsOffcanvas(props) {
  const [genericGetRequest, getResults] = useLazyGenericGetRequestQuery()
  const handleLink = useNavigate()
+ const handleExternalLink = (link) => {
+ window.open(link, '_blank')
+ }
  const handleModal = (modalMessage, modalUrl) => {
  ModalService.confirm({
  body: (
@@ -21,28 +24,37 @@ export default function CippActionsOffcanvas(props) {
  onConfirm: () => genericGetRequest({ path: modalUrl }),
  })
  }
- const handleOnClick = (link, modal, modalMessage, modalUrl) => {
+ const handleOnClick = (link, modal, modalMessage, modalUrl, external) => {
  if (link) {
- handleLink(link)
+ if (external) {
+ handleExternalLink(link)
+ } else {
+ handleLink(link)
+ }
  } else if (modal) {
  handleModal(modalMessage, modalUrl)
  }
  }
  const extendedInfoContent = <CippOffcanvasTable rows={props.extendedInfo} guid={props.id} />
  const actionsContent = props.actions.map((action, index) => (
- <CListGroup layout="horizontal-md" key={index}>
- <CListGroupItem
- className="cipp-action"
- component="button"
- color={action.color}
- onClick={() =>
- handleOnClick(action.link, action.modal, action.modalMessage, action.modalUrl)
- }
- >
- {action.icon}
- {action.label}
- </CListGroupItem>
- </CListGroup>
+ <CListGroupItem
+ className="cipp-action"
+ component="button"
+ color={action.color}
+ onClick={() =>
+ handleOnClick(
+ action.link,
+ action.modal,
+ action.modalMessage,
+ action.modalUrl,
+ action.external,
+ )
+ }
+ key={index}
+ >
+ {action.icon}
+ {action.label}
+ </CListGroupItem>
  ))
  return (
  <CippOffcanvas
@@ -64,7 +76,7 @@ export default function CippActionsOffcanvas(props) {
  <COffcanvasTitle>Extended Information</COffcanvasTitle>
  {extendedInfoContent}
  {<COffcanvasTitle>Actions</COffcanvasTitle>}
- {actionsContent}
+ <CListGroup layout="verical-md">{actionsContent}</CListGroup>
  </CippOffcanvas>
  )
 }
@@ -86,6 +98,7 @@ const CippActionsOffcanvasPropTypes = {
  modal: PropTypes.bool,
  modalUrl: PropTypes.string,
  modalMessage: PropTypes.string,
+ external: PropTypes.bool,
  }),
  ).isRequired,
  rowIndex: PropTypes.number,

src/routes.js

@@ -20,6 +20,7 @@ const MFAReport = React.lazy(() => import('src/views/identity/reports/MFAReport'
 const Tenants = React.lazy(() => import('src/views/tenant/administration/Tenants'))
 const AlertWizard = React.lazy(() => import('src/views/tenant/administration/AlertWizard'))
 const AlertsQueue = React.lazy(() => import('src/views/tenant/administration/ListAlertsQueue'))
+const GraphExplorer = React.lazy(() => import('src/views/tenant/administration/GraphExplorer'))
 
 const Domains = React.lazy(() => import('src/views/tenant/administration/Domains'))
 const EditTenant = React.lazy(() => import('src/views/tenant/administration/EditTenant'))
@@ -103,6 +104,9 @@ const EditContact = React.lazy(() => import('src/views/email-exchange/administra
 const EditMailboxPermissions = React.lazy(() =>
  import('src/views/email-exchange/administration/EditMailboxPermissions'),
 )
+const EditCalendarPermissions = React.lazy(() =>
+ import('src/views/email-exchange/administration/EditCalendarPermissions'),
+)
 const ViewMobileDevices = React.lazy(() =>
  import('src/views/email-exchange/administration/ViewMobileDevices'),
 )
@@ -166,6 +170,11 @@ const routes = [
  { path: '/tenant/administration/domains', name: 'Domains', component: Domains },
  { path: '/tenant/administration/alertswizard', name: 'Alerts Wizard', component: AlertWizard },
  { path: '/tenant/administration/alertsqueue', name: 'Alerts Queue', component: AlertsQueue },
+ {
+ path: '/tenant/administration/graph-explorer',
+ name: 'Graph Explorer',
+ component: GraphExplorer,
+ },
 
  {
  path: '/tenant/administration/conditional-access-policies',
@@ -285,6 +294,11 @@ const routes = [
  path: '/email/administration/edit-mailbox-permissions',
  component: EditMailboxPermissions,
  },
+ {
+ name: 'Edit Calendar Permissions',
+ path: '/email/administration/edit-calendar-permissions',
+ component: EditCalendarPermissions,
+ },
  {
  name: 'View Mobile Devices',
  path: '/email/administration/view-mobile-devices',

src/scss/_custom.scss

@@ -63,7 +63,9 @@
 
  .card-header {
  &:first-child {
- border-radius: var(--cipp-border-radius);
+ background-clip: border-box;
+ border-radius: 3px 3px 0 0;
+ overflow: hidden;
  }
  }
 
@@ -387,3 +389,9 @@
  margin-left: 1rem;
  }
 }
+
+/* Sidebar */
+
+.sidebar-nav .nav-link {
+ margin: 0.25rem 0;
+}