Merge pull request #2366 from JohnDuprey/dev

Copy Schedule

Author: JohnDuprey

src/views/cipp/Scheduler.jsx

@@ -1,7 +1,6 @@
-import React, { useEffect, useState } from 'react'
-import { CButton, CCallout, CCol, CForm, CFormLabel, CRow, CSpinner, CTooltip } from '@coreui/react'
-import useQuery from 'src/hooks/useQuery'
-import { useSelector } from 'react-redux'
+import React, { useCallback, useEffect, useState } from 'react'
+import { CButton, CCallout, CCol, CForm, CRow, CSpinner, CTooltip } from '@coreui/react'
+import { useDispatch, useSelector } from 'react-redux'
 import { Field, Form, FormSpy } from 'react-final-form'
 import {
   RFFCFormInput,
@@ -15,20 +14,45 @@ import {
   useLazyGenericPostRequestQuery,
 } from 'src/store/api/app'
 import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
-import { faCircleNotch, faEdit, faEye } from '@fortawesome/free-solid-svg-icons'
+import { faCircleNotch, faEdit } from '@fortawesome/free-solid-svg-icons'
 import { CippContentCard, CippPage, CippPageList } from 'src/components/layout'
-import { password } from 'src/validators'
 import { cellBadgeFormatter, cellDateFormatter } from 'src/components/tables'
 import { CellTip, cellGenericFormatter } from 'src/components/tables/CellGenericFormat'
 import DatePicker from 'react-datepicker'
 import 'react-datepicker/dist/react-datepicker.css'
-import TenantListSelector from 'src/components/utilities/TenantListSelector'
 import { ModalService, TenantSelector } from 'src/components/utilities'
 import CippCodeOffCanvas from 'src/components/utilities/CippCodeOffcanvas'
 import arrayMutators from 'final-form-arrays'
+import { useListTenantsQuery } from 'src/store/api/tenants'
+import { setCurrentTenant } from 'src/store/features/app'
+import { useNavigate, useSearchParams } from 'react-router-dom'
+import { queryString } from 'src/helpers'
 
 const Scheduler = () => {
+  const [initialValues, setInitialValues] = useState({})
+  const [selectedTenant, setSelectedTenant] = useState('')
   const [ExecuteGetRequest, getResults] = useLazyGenericGetRequestQuery()
+  const { data: tenants, isSuccess: tenantSuccess } = useListTenantsQuery({
+    showAllTenantSelector: true,
+  })
+  const dispatch = useDispatch()
+  const navigate = useNavigate()
+  const [searchParams, setSearchParams] = useSearchParams()
+
+  const updateSearchParams = useCallback(
+    (params) => {
+      navigate(`${queryString(params)}`, { replace: true })
+    },
+    [navigate],
+  )
+
+  const recurrenceOptions = [
+    { value: '0', name: 'Only once' },
+    { value: '1', name: 'Every 1 day' },
+    { value: '7', name: 'Every 7 days' },
+    { value: '30', name: 'Every 30 days' },
+    { value: '365', name: 'Every 365 days' },
+  ]
 
   const Offcanvas = (row, rowIndex, formatExtraData) => {
     const [ocVisible, setOCVisible] = useState(false)
@@ -59,6 +83,11 @@ const Scheduler = () => {
             <FontAwesomeIcon icon={'eye'} href="" />
           </CButton>
         </CTooltip>
+        <CTooltip content="Copy Task">
+          <CButton size="sm" color="warning" variant="ghost" onClick={() => onCopy(row)}>
+            <FontAwesomeIcon icon="copy" href="" />
+          </CButton>
+        </CTooltip>
         <CTooltip content="Delete task">
           <CButton
             onClick={() =>
@@ -116,6 +145,75 @@ const Scheduler = () => {
     })
   }
 
+  const onCopy = (row) => {
+    // Get post execution options
+    var postExecActions = row.PostExecution.split(',')
+    // Get recurrence object
+    var recurrence = recurrenceOptions.filter((rec) => rec.value === row.Recurrence)[0]
+
+    // Convert parameters into form object
+    var parameters = {}
+    Object.keys(row?.Parameters).forEach((key) => {
+      if (typeof row?.Parameters[key] === 'object') {
+        var nestedParamList = []
+        Object.keys(row?.Parameters[key]).forEach((nestedKey) => {
+          console.log(nestedKey)
+          nestedParamList.push({
+            Key: nestedKey,
+            Value: row?.Parameters[key][nestedKey],
+          })
+        })
+        parameters[key] = nestedParamList
+      } else {
+        parameters[key] = row?.Parameters[key]
+      }
+    })
+
+    // Convert additional properties into form object
+    var additional = []
+    var additionalProps = JSON.parse(row?.AdditionalProperties)
+    Object.keys(additionalProps).forEach((key) => {
+      console.log(key)
+      additional.push({
+        Key: key,
+        Value: additionalProps[key],
+      })
+    })
+
+    // Set initial values
+    var formValues = {
+      taskName: row.Name,
+      command: { label: row.Command, value: row.Command },
+      Recurrence: { label: recurrence.name, value: recurrence.value },
+      additional: additional,
+      parameters: parameters,
+      webhook: postExecActions.includes('Webhook'),
+      email: postExecActions.includes('Email'),
+      psa: postExecActions.includes('PSA'),
+    }
+    setInitialValues(formValues)
+    setSelectedTenant(row.Tenant)
+  }
+
+  // Update tenant selector on copy
+  useEffect(() => {
+    if (selectedTenant !== '' && tenantSuccess) {
+      const customerId = searchParams.get('customerId')
+      const tableFilter = searchParams.get('tableFilter')
+      var newSearchParams = {}
+      if (tableFilter) {
+        newSearchParams.tableFilter = tableFilter
+      }
+      const tenant = tenants.filter((t) => t.defaultDomainName === selectedTenant)
+      if (tenant.length > 0) {
+        dispatch(setCurrentTenant({ tenant: tenant[0] }))
+        newSearchParams.customerId = tenant[0]?.customerId
+        updateSearchParams(newSearchParams)
+        setSelectedTenant('')
+      }
+    }
+  }, [selectedTenant, tenantSuccess, tenants, dispatch, searchParams, updateSearchParams])
+
   const columns = [
     {
       name: 'Name',
@@ -183,7 +281,7 @@ const Scheduler = () => {
     {
       name: 'Actions',
       cell: Offcanvas,
-      maxWidth: '80px',
+      maxWidth: '100px',
     },
   ]
   return (
@@ -197,8 +295,7 @@ const Scheduler = () => {
                 mutators={{
                   ...arrayMutators,
                 }}
-                initialValues={{ taskName }}
-                initialValuesEqual={() => true}
+                initialValues={{ ...initialValues }}
                 render={({ handleSubmit, submitting, values }) => {
                   return (
                     <CForm onSubmit={handleSubmit}>
@@ -235,13 +332,7 @@ const Scheduler = () => {
                       <CRow className="mb-3">
                         <CCol>
                           <RFFSelectSearch
-                            values={[
-                              { value: '0', name: 'Only once' },
-                              { value: '1', name: 'Every 1 day' },
-                              { value: '7', name: 'Every 7 days' },
-                              { value: '30', name: 'Every 30 days' },
-                              { value: '365', name: 'Every 365 days' },
-                            ]}
+                            values={recurrenceOptions}
                             name="Recurrence"
                             placeholder="Select a recurrence"
                             label="Recurrence"