Merge branch 'KelvinTegelaar:main' into main

spinen · Mar 6, 2024 · 91010b7 · 91010b7
2 parents 2776ba4 + 54ce4a9
commit 91010b7
Show file tree

Hide file tree

Showing 26 changed files with 863 additions and 136 deletions.
diff --git a/public/version_latest.txt b/public/version_latest.txt
@@ -1 +1 @@
-5.1.1
+5.2.1
diff --git a/src/_nav.jsx b/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',
@@ -737,6 +742,11 @@ const _nav = [
         name: 'Logbook',
         to: '/cipp/logs',
       },
+      {
+        component: CNavItem,
+        name: 'Statistics',
+        to: '/cipp/statistics',
+      },
       {
         component: CNavItem,
         name: 'SAM Setup Wizard',

diff --git a/src/components/forms/RFFComponents.jsx b/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'
@@ -393,6 +394,7 @@ export const RFFSelectSearch = ({
   disabled = false,
   retainInput = true,
   isLoading = false,
+  allowCreate = false,
   refreshFunction,
   props,
 }) => {
@@ -433,7 +435,7 @@ export const RFFSelectSearch = ({
                 </CTooltip>
               )}
             </CFormLabel>
-            {onChange && (
+            {!allowCreate && onChange && (
               <Select
                 className="react-select-container"
                 classNamePrefix="react-select"
@@ -452,7 +454,7 @@ export const RFFSelectSearch = ({
                 {...props}
               />
             )}
-            {!onChange && (
+            {!allowCreate && !onChange && (
               <Select
                 className="react-select-container"
                 classNamePrefix="react-select"
@@ -470,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>
         )

diff --git a/src/components/tables/CippTable.jsx b/src/components/tables/CippTable.jsx
@@ -389,14 +389,43 @@ export default function CippTable({
               }
               const newModalBody = {}
               for (let [objName, objValue] of Object.entries(modalBody)) {
-                if (objValue.toString().startsWith('!')) {
+                if (typeof objValue === 'object' && objValue !== null) {
+                  newModalBody[objName] = {}
+                  for (let [nestedObjName, nestedObjValue] of Object.entries(objValue)) {
+                    if (typeof nestedObjValue === 'string' && nestedObjValue.startsWith('!')) {
+                      newModalBody[objName][nestedObjName] = row[nestedObjValue.replace('!', '')]
+                    } else {
+                      newModalBody[objName][nestedObjName] = nestedObjValue
+                    }
+                  }
+                } else if (typeof objValue === 'string' && objValue.startsWith('!')) {
                   newModalBody[objName] = row[objValue.replace('!', '')]
+                } else {
+                  newModalBody[objName] = objValue
                 }
               }
               const NewModalUrl = `${modalUrl.split('?')[0]}?${urlParams.toString()}`
+              const selectedValue = inputRef.current.value
+              let additionalFields = {}
+              if (inputRef.current.nodeName === 'SELECT') {
+                const selectedItem = dropDownInfo.data.find(
+                  (item) => item[modalDropdown.valueField] === selectedValue,
+                )
+                if (selectedItem && modalDropdown.addedField) {
+                  Object.keys(modalDropdown.addedField).forEach((key) => {
+                    additionalFields[key] = selectedItem[modalDropdown.addedField[key]]
+                  })
+                }
+              }
+
               const results = await genericPostRequest({
                 path: NewModalUrl,
-                values: { ...modalBody, ...newModalBody, ...{ input: inputRef.current.value } },
+                values: {
+                  ...modalBody,
+                  ...newModalBody,
+                  ...additionalFields,
+                  ...{ input: inputRef.current.value },
+                },
               })
               resultsarr.push(results)
               setMassResults(resultsarr)
@@ -466,6 +495,7 @@ export default function CippTable({
     }
 
     const executeselectedAction = (item) => {
+      console.log(item)
       setModalContent({
         item,
       })
@@ -556,6 +586,9 @@ export default function CippTable({
         let output = {}
         for (let k in obj) {
           let val = obj[k]
+          if (val === null) {
+            val = ''
+          }
           const newKey = prefix ? prefix + '.' + k : k
           if (typeof val === 'object') {
             if (Array.isArray(val)) {

diff --git a/src/components/utilities/CippCodeOffcanvas.jsx b/src/components/utilities/CippCodeOffcanvas.jsx
@@ -1,11 +1,13 @@
-import React, { useState } from 'react'
+import React, { useState, useEffect } from 'react'
 import { CButton, CCallout, CCol, CRow, CSpinner } from '@coreui/react'
 import { CippOffcanvas } from 'src/components/utilities'
 import { useLazyGenericGetRequestQuery, useLazyGenericPostRequestQuery } from 'src/store/api/app'
 
 import { Editor } from '@monaco-editor/react'
 import { useSelector } from 'react-redux'
 import PropTypes from 'prop-types'
+import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
+import CopyToClipboard from 'react-copy-to-clipboard'
 
 function CippCodeOffCanvas({
   row,
@@ -14,11 +16,13 @@ function CippCodeOffCanvas({
   type,
   title = 'Template JSON',
   hideButton = false,
+  path = `/api/ExecEditTemplate?type=${type}`,
 }) {
   const [SaveTemplate, templateDetails] = useLazyGenericPostRequestQuery()
   const currentTheme = useSelector((state) => state.app.currentTheme)
   const [templateData, setFormData] = useState(row)
   const [invalidJSON, setInvalid] = useState(false)
+  const [copied, setCopied] = useState(false)
 
   function handleEditorChange(value, event) {
     try {
@@ -29,6 +33,10 @@ function CippCodeOffCanvas({
     }
   }
 
+  useEffect(() => {
+    setCopied(false)
+  }, [setCopied, templateData])
+
   return (
     <>
       <CippOffcanvas
@@ -53,18 +61,32 @@ function CippCodeOffCanvas({
         <CRow className="mb-3">
           <CCol>
             {!hideButton && (
-              <CButton
-                disabled={invalidJSON}
-                onClick={() =>
-                  SaveTemplate({
-                    path: `/api/ExecEditTemplate?type=${type}`,
-                    method: 'POST',
-                    values: templateData,
-                  })
-                }
-              >
-                Save changes {templateDetails.isFetching && <CSpinner size="sm" />}
-              </CButton>
+              <>
+                <CButton
+                  disabled={invalidJSON}
+                  onClick={() =>
+                    SaveTemplate({
+                      path: path,
+                      method: 'POST',
+                      values: templateData,
+                    })
+                  }
+                  className="me-2"
+                >
+                  {templateDetails.isFetching ? (
+                    <CSpinner size="sm" className="me-2" />
+                  ) : (
+                    <FontAwesomeIcon icon="save" className="me-2" />
+                  )}
+                  Save changes
+                </CButton>
+                <CopyToClipboard text={JSON.stringify(row, null, 2)} onCopy={() => setCopied(true)}>
+                  <CButton disabled={invalidJSON}>
+                    <FontAwesomeIcon icon={copied ? 'check' : 'clipboard'} className="me-2" /> Copy
+                    to Clipboard
+                  </CButton>
+                </CopyToClipboard>
+              </>
             )}
           </CCol>
         </CRow>
@@ -83,6 +105,7 @@ CippCodeOffCanvas.propTypes = {
   type: PropTypes.string,
   title: PropTypes.string,
   hideButton: PropTypes.bool,
+  path: PropTypes.string,
 }
 
 export default CippCodeOffCanvas
diff --git a/src/components/utilities/SharedModal.jsx b/src/components/utilities/SharedModal.jsx
@@ -29,7 +29,7 @@ function mapBodyComponent({ componentType, data, componentProps }) {
 }
 
 const sharedProps = {
-  componentType: PropTypes.oneOf(['table', 'list', 'text', 'confirm']),
+  componentType: PropTypes.oneOf(['table', 'list', 'text', 'confirm', 'codeblock']),
   componentProps: PropTypes.object,
   body: PropTypes.oneOfType([PropTypes.node, PropTypes.element]),
   data: PropTypes.any,