Merge branch 'KelvinTegelaar:main' into main

public/version_latest.txt

@@ -1 +1 @@
-4.9.1
+5.2.1

src/_nav.jsx

@@ -50,6 +50,11 @@ const _nav = [
         name: 'Groups',
         to: '/identity/administration/groups',
       },
+      {
+        component: CNavItem,
+        name: 'Devices',
+        to: '/identity/administration/devices',
+      },
       {
         component: CNavItem,
         name: 'Deploy Group Template',
@@ -173,7 +178,7 @@ const _nav = [
       },
       {
         component: CNavItem,
-        name: 'Geo IP Lookup',
+        name: 'IP Database',
         to: '/tenant/tools/geoiplookup',
       },
       {
@@ -239,6 +244,11 @@ const _nav = [
         name: 'Deploy CA Policies',
         to: '/tenant/conditional/deploy',
       },
+      {
+        component: CNavItem,
+        name: 'CA Vacation Mode',
+        to: '/tenant/conditional/deploy-vacation',
+      },
       {
         component: CNavItem,
         name: 'CA Templates',
@@ -732,6 +742,11 @@ const _nav = [
         name: 'Logbook',
         to: '/cipp/logs',
       },
+      {
+        component: CNavItem,
+        name: 'Statistics',
+        to: '/cipp/statistics',
+      },
       {
         component: CNavItem,
         name: 'SAM Setup Wizard',

src/components/forms/RFFComponents.jsx

@@ -11,6 +11,7 @@ import {
   CTooltip,
 } from '@coreui/react'
 import Select from 'react-select'
+import Creatable, { useCreatable } from 'react-select/creatable'
 import { Field } from 'react-final-form'
 import { FieldArray } from 'react-final-form-arrays'
 import React, { useState, useMemo, useRef } from 'react'
@@ -137,10 +138,17 @@ export const RFFCFormInput = ({
   disabled = false,
   spellCheck = true,
   autoFocus = false,
+  onChange,
 }) => {
   return (
     <Field name={name} validate={validate}>
       {({ input, meta }) => {
+        const handleChange = onChange
+          ? (e) => {
+              input.onChange(e)
+              onChange(e)
+            }
+          : input.onChange
         return (
           <div className={className}>
             {label && <CFormLabel htmlFor={name}>{label}</CFormLabel>}
@@ -155,6 +163,7 @@ export const RFFCFormInput = ({
               placeholder={placeholder}
               spellCheck={spellCheck}
               autoFocus={autoFocus}
+              onChange={handleChange}
             />
             <RFFCFormFeedback meta={meta} />
           </div>
@@ -385,6 +394,7 @@ export const RFFSelectSearch = ({
   disabled = false,
   retainInput = true,
   isLoading = false,
+  allowCreate = false,
   refreshFunction,
   props,
 }) => {
@@ -425,7 +435,7 @@ export const RFFSelectSearch = ({
                 </CTooltip>
               )}
             </CFormLabel>
-            {onChange && (
+            {!allowCreate && onChange && (
               <Select
                 className="react-select-container"
                 classNamePrefix="react-select"
@@ -444,7 +454,7 @@ export const RFFSelectSearch = ({
                 {...props}
               />
             )}
-            {!onChange && (
+            {!allowCreate && !onChange && (
               <Select
                 className="react-select-container"
                 classNamePrefix="react-select"
@@ -462,6 +472,43 @@ export const RFFSelectSearch = ({
                 {...props}
               />
             )}
+            {allowCreate && onChange && (
+              <Creatable
+                className="react-select-container"
+                classNamePrefix="react-select"
+                {...input}
+                isClearable={false}
+                name={name}
+                id={name}
+                disabled={disabled}
+                options={selectSearchvalues}
+                placeholder={placeholder}
+                isMulti={multi}
+                onChange={onChange}
+                onInputChange={debounceOnInputChange}
+                inputValue={inputText}
+                isLoading={isLoading}
+                {...props}
+              />
+            )}
+            {allowCreate && !onChange && (
+              <Creatable
+                className="react-select-container"
+                classNamePrefix="react-select"
+                {...input}
+                isClearable={true}
+                name={name}
+                id={name}
+                disabled={disabled}
+                options={selectSearchvalues}
+                placeholder={placeholder}
+                onInputChange={setOnInputChange}
+                isMulti={multi}
+                inputValue={inputText}
+                isLoading={isLoading}
+                {...props}
+              />
+            )}
             {meta.error && meta.touched && <span className="text-danger">{meta.error}</span>}
           </div>
         )

src/components/layout/AppHeader.jsx

@@ -16,17 +16,8 @@ import {
 } from '@coreui/react'
 import { AppHeaderSearch } from 'src/components/header'
 import { TenantSelector } from '../utilities'
-import cyberdrainlogolight from 'src/assets/images/CIPP.png'
-import cyberdrainlogodark from 'src/assets/images/CIPP_Dark.png'
-
 import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
-import {
-  faBars,
-  faCaretSquareLeft,
-  faCaretSquareRight,
-  faHamburger,
-  faStroopwafel,
-} from '@fortawesome/free-solid-svg-icons'
+import { faBars } from '@fortawesome/free-solid-svg-icons'
 import { setCurrentTheme, setUserSettings, toggleSidebarShow } from 'src/store/features/app'
 import { useMediaPredicate } from 'react-media-hook'
 import { useGenericGetRequestQuery, useLoadAlertsDashQuery } from 'src/store/api/app'

src/components/tables/CellMathFormatter.jsx

@@ -0,0 +1,59 @@
+import React from 'react'
+import { CBadge, CTooltip } from '@coreui/react'
+import CellBoolean from 'src/components/tables/CellBoolean.jsx'
+import cellTable from './CellTable'
+
+export function CellTip(cell, overflow = false) {
+  return (
+    <CTooltip content={String(cell)}>
+      <div className="celltip-content-nowrap">{String(cell)}</div>
+    </CTooltip>
+  )
+}
+export const cellMathFormatter =
+  ({ col } = {}) =>
+  (row) => {
+    const evaluateCalculation = (calculation, row) => {
+      try {
+        const formattedCalculation = calculation.replace(/\b\w+(\.\w+|\[\d+\])*\b/g, (key) => {
+          if (!isNaN(key)) {
+            return parseFloat(key)
+          }
+
+          const path = key.split(/\.|\[(\d+)\]/).filter(Boolean) // Splits keys and array indices
+          let currentObject = row
+          for (const prop of path) {
+            if (currentObject && prop in currentObject) {
+              currentObject = currentObject[prop]
+            } else if (!isNaN(prop)) {
+              // Checks if the prop is an array index
+              currentObject = currentObject[parseInt(prop, 10)]
+            } else {
+              throw new Error(`Property '${prop}' not found in row`)
+            }
+          }
+
+          return parseFloat(currentObject)
+        })
+
+        return Number(eval(formattedCalculation))
+      } catch (e) {
+        console.error(e)
+        return null
+      }
+    }
+
+    const result = evaluateCalculation(col.value, row)
+
+    if (result === null) {
+      return 'N/A'
+    }
+
+    if (col.showAs === 'percentage') {
+      return `${result.toFixed(2)}%`
+    } else {
+      return result.toFixed(2)
+    }
+  }
+
+export default cellMathFormatter