refactor: pass refetch to runjobmodal instead of using hook

dhis2 · Apr 12, 2023 · 274e596 · 274e596
1 parent 99643bc
commit 274e596
Show file tree

Hide file tree

Showing 7 changed files with 31 additions and 21 deletions.
diff --git a/src/components/JobTable/Actions.js b/src/components/JobTable/Actions.js
@@ -7,7 +7,7 @@ import ViewJobAction from './ViewJobAction'
 import RunJobAction from './RunJobAction'
 import DeleteJobAction from './DeleteJobAction'
 
-const Actions = ({ id, configurable, enabled }) => (
+const Actions = ({ id, configurable, enabled, refetch }) => (
     <DropdownButton
         small
         component={
@@ -17,7 +17,9 @@ const Actions = ({ id, configurable, enabled }) => (
                 ) : (
                     <ViewJobAction id={id} />
                 )}
-                {configurable && <RunJobAction enabled={enabled} id={id} />}
+                {configurable && (
+                    <RunJobAction enabled={enabled} id={id} refetch={refetch} />
+                )}
                 {configurable && <DeleteJobAction id={id} />}
             </FlyoutMenu>
         }
@@ -30,10 +32,11 @@ Actions.defaultProps = {
     configurable: false,
 }
 
-const { string, bool } = PropTypes
+const { string, bool, func } = PropTypes
 
 Actions.propTypes = {
     id: string.isRequired,
+    refetch: func.isRequired,
     configurable: bool,
     enabled: bool,
 }

diff --git a/src/components/JobTable/JobTable.js b/src/components/JobTable/JobTable.js
@@ -12,7 +12,7 @@ import i18n from '@dhis2/d2-i18n'
 import { PropTypes } from '@dhis2/prop-types'
 import JobTableRow from './JobTableRow'
 
-const JobTable = ({ jobs }) => (
+const JobTable = ({ jobs, refetch }) => (
     <Table>
         <TableHead>
             <TableRowHead>
@@ -31,16 +31,19 @@ const JobTable = ({ jobs }) => (
                     <TableCell>{i18n.t('No jobs to display')}</TableCell>
                 </TableRow>
             ) : (
-                jobs.map((job) => <JobTableRow key={job.id} job={job} />)
+                jobs.map((job) => (
+                    <JobTableRow key={job.id} job={job} refetch={refetch} />
+                ))
             )}
         </TableBody>
     </Table>
 )
 
-const { arrayOf, object } = PropTypes
+const { arrayOf, object, func } = PropTypes
 
 JobTable.propTypes = {
     jobs: arrayOf(object).isRequired,
+    refetch: func.isRequired,
 }
 
 export default JobTable
diff --git a/src/components/JobTable/JobTableRow.js b/src/components/JobTable/JobTableRow.js
@@ -20,6 +20,7 @@ const JobTableRow = ({
         enabled,
         configurable,
     },
+    refetch,
 }) => (
     <TableRow>
         <TableCell role="rowheader">{name}</TableCell>
@@ -41,12 +42,17 @@ const JobTableRow = ({
             />
         </TableCell>
         <TableCell>
-            <Actions id={id} enabled={enabled} configurable={configurable} />
+            <Actions
+                id={id}
+                enabled={enabled}
+                configurable={configurable}
+                refetch={refetch}
+            />
         </TableCell>
     </TableRow>
 )
 
-const { shape, string, bool, number } = PropTypes
+const { shape, string, bool, number, func } = PropTypes
 
 JobTableRow.propTypes = {
     job: shape({
@@ -59,6 +65,7 @@ JobTableRow.propTypes = {
         delay: number,
         nextExecutionTime: string,
     }).isRequired,
+    refetch: func.isRequired,
 }
 
 export default JobTableRow
diff --git a/src/components/JobTable/RunJobAction.js b/src/components/JobTable/RunJobAction.js
@@ -4,7 +4,7 @@ import { MenuItem } from '@dhis2/ui'
 import i18n from '@dhis2/d2-i18n'
 import { RunJobModal } from '../Modal'
 
-const RunJobAction = ({ id, enabled }) => {
+const RunJobAction = ({ id, enabled, refetch }) => {
     const [showModal, setShowModal] = useState(false)
 
     return (
@@ -24,16 +24,18 @@ const RunJobAction = ({ id, enabled }) => {
                         /* istanbul ignore next */
                         () => setShowModal(false)
                     }
+                    refetch={refetch}
                 />
             )}
         </React.Fragment>
     )
 }
 
-const { string, bool } = PropTypes
+const { string, bool, func } = PropTypes
 
 RunJobAction.propTypes = {
     id: string.isRequired,
+    refetch: func.isRequired,
     enabled: bool,
 }
 

diff --git a/src/components/Modal/RunJobModal.js b/src/components/Modal/RunJobModal.js
@@ -10,14 +10,12 @@ import {
     NoticeBox,
 } from '@dhis2/ui'
 import i18n from '@dhis2/d2-i18n'
-import { useJobSchedules } from '../../hooks/job-schedules'
 
-const RunJobModal = ({ id, hideModal }) => {
+const RunJobModal = ({ id, hideModal, refetch }) => {
     const [mutation] = useState({
         resource: `jobConfigurations/${id}/execute`,
         type: 'create',
     })
-    const { refetch } = useJobSchedules()
     const [runJob, { loading, error }] = useDataMutation(mutation, {
         onComplete: () => {
             hideModal()
@@ -64,6 +62,7 @@ const { func, string } = PropTypes
 RunJobModal.propTypes = {
     hideModal: func.isRequired,
     id: string.isRequired,
+    refetch: func.isRequired,
 }
 
 export default RunJobModal
diff --git a/src/components/Modal/RunJobModal.test.js b/src/components/Modal/RunJobModal.test.js
@@ -1,7 +1,6 @@
 import React from 'react'
 import { shallow, mount } from 'enzyme'
 import { useDataMutation } from '@dhis2/app-runtime'
-import { StoreContext } from '../Store'
 import RunJobModal from './RunJobModal'
 
 jest.mock('@dhis2/app-runtime', () => ({
@@ -75,12 +74,9 @@ describe('<RunJobModal>', () => {
         const props = {
             id: 'id',
             hideModal: hideModalSpy,
+            refetch: refetchSpy,
         }
-        const wrapper = mount(
-            <StoreContext.Provider value={{ refetchJobs: refetchSpy }}>
-                <RunJobModal {...props} />
-            </StoreContext.Provider>
-        )
+        const wrapper = mount(<RunJobModal {...props} />)
 
         wrapper
             .find('button')

diff --git a/src/pages/JobList/JobList.js b/src/pages/JobList/JobList.js
@@ -14,7 +14,7 @@ const infoLink =
 const JobList = () => {
     const [jobFilter, setJobFilter] = useJobFilter()
     const [showSystemJobs, setShowSystemJobs] = useShowSystemJobs()
-    const { data, loading, error } = useJobSchedules()
+    const { data, loading, error, refetch } = useJobSchedules()
 
     if (loading) {
         return <Spinner />
@@ -78,7 +78,7 @@ const JobList = () => {
                         <LinkButton to="/add">{i18n.t('New job')}</LinkButton>
                     </div>
                 </div>
-                <JobTable jobs={jobs} />
+                <JobTable jobs={jobs} refetch={refetch} />
             </Card>
         </React.Fragment>
     )