From b0045b0c75b45ca16b9434f28c42d83dc1d8280e Mon Sep 17 00:00:00 2001 From: Daniel Stefan Date: Thu, 21 Apr 2022 20:01:25 +0300 Subject: [PATCH] feat: when commiting add a commit message field to the commit modal --- src/components/blocks/CommitModal.js | 46 ++++++++++++++++++++++++++++ src/components/blocks/index.js | 1 + src/pages/Projects/index.js | 42 +++++-------------------- src/pages/Units/index.js | 40 ++++-------------------- src/store/actions/app.js | 6 ---- src/store/reducers/appReducer.js | 4 --- 6 files changed, 60 insertions(+), 79 deletions(-) create mode 100644 src/components/blocks/CommitModal.js diff --git a/src/components/blocks/CommitModal.js b/src/components/blocks/CommitModal.js new file mode 100644 index 00000000..042ec98a --- /dev/null +++ b/src/components/blocks/CommitModal.js @@ -0,0 +1,46 @@ +import React from 'react'; +import { useDispatch } from 'react-redux'; +import { useIntl } from 'react-intl'; + +import { Modal, modalTypeEnum, Body } from '../../components'; + +import { commitStagingData } from '../../store/actions/climateWarehouseActions'; + +const CommitModal = ({ onClose }) => { + const intl = useIntl(); + const dispatch = useDispatch(); + + const onCommit = () => { + dispatch(commitStagingData('Projects')); + onClose(); + }; + + const onCommitAll = () => { + dispatch(commitStagingData('all')); + onClose(); + }; + + return ( + + this is where the field + + {intl.formatMessage({ + id: 'commit-projects-message-question', + })} + + + } + modalType={modalTypeEnum.basic} + extraButtonLabel={intl.formatMessage({ id: 'everything' })} + extraButtonOnClick={onCommitAll} + onClose={() => onClose()} + onOk={onCommit} + label={intl.formatMessage({ id: 'only-projects' })} + /> + ); +}; + +export { CommitModal }; diff --git a/src/components/blocks/index.js b/src/components/blocks/index.js index d7a7442a..4fa0ee6a 100644 --- a/src/components/blocks/index.js +++ b/src/components/blocks/index.js @@ -45,3 +45,4 @@ export * from './UnitsDetails'; export * from './UnitsIssuanceDetails'; export * from './UnitsLabelsDetails'; export * from './AuditItemModal'; +export * from './CommitModal'; diff --git a/src/pages/Projects/index.js b/src/pages/Projects/index.js index 6d7ac4e4..1e595d02 100644 --- a/src/pages/Projects/index.js +++ b/src/pages/Projects/index.js @@ -25,10 +25,9 @@ import { CreateProjectForm, H3, UploadXLSX, - Modal, - modalTypeEnum, - Body, + CommitModal, } from '../../components'; + import { setPendingError, setValidateForm, @@ -38,13 +37,10 @@ import { import { getStagingData, deleteStagingData, - commitStagingData, getPaginatedData, retryStagingData, } from '../../store/actions/climateWarehouseActions'; -import { setCommit } from '../../store/actions/app'; - const headings = [ 'currentRegistry', 'warehouseProjectId', @@ -124,7 +120,8 @@ const StyledCSVOperationsContainer = styled('div')` const Projects = () => { const [createFormIsDisplayed, setCreateFormIsDisplayed] = useState(false); - const { notification, commit } = useSelector(store => store.app); + const { notification } = useSelector(store => store.app); + const [isCommitModalVisible, setIsCommitModalVisible] = useState(false); const climateWarehouseStore = useSelector(store => store.climateWarehouse); const [tabValue, setTabValue] = useState(0); const intl = useIntl(); @@ -272,16 +269,6 @@ const Projects = () => { return null; } - const onCommit = () => { - dispatch(commitStagingData('Projects')); - dispatch(setCommit(false)); - }; - - const onCommitAll = () => { - dispatch(commitStagingData('all')); - dispatch(setCommit(false)); - }; - return ( <> @@ -335,28 +322,13 @@ const Projects = () => { dispatch(setCommit(true))} + onClick={() => setIsCommitModalVisible(true)} /> )} - {commit && ( - - {intl.formatMessage({ - id: 'commit-projects-message-question', - })} - - } - modalType={modalTypeEnum.basic} - extraButtonLabel={intl.formatMessage({ id: 'everything' })} - extraButtonOnClick={onCommitAll} - onClose={() => dispatch(setCommit(false))} - onOk={onCommit} - label={intl.formatMessage({ id: 'only-projects' })} - /> + {isCommitModalVisible && ( + setIsCommitModalVisible(false)} /> )} diff --git a/src/pages/Units/index.js b/src/pages/Units/index.js index 425c2557..703f8a35 100644 --- a/src/pages/Units/index.js +++ b/src/pages/Units/index.js @@ -12,7 +12,6 @@ import { useWindowSize } from '../../components/hooks/useWindowSize'; import { getStagingData, deleteStagingData, - commitStagingData, getPaginatedData, retryStagingData, } from '../../store/actions/climateWarehouseActions'; @@ -38,11 +37,8 @@ import { StagingDataGroups, SelectOrganizations, UploadXLSX, - Modal, - modalTypeEnum, - Body, + CommitModal, } from '../../components'; -import { setCommit } from '../../store/actions/app'; const headings = [ 'projectLocationId', @@ -122,7 +118,8 @@ const StyledCSVOperationsContainer = styled('div')` const Units = () => { const dispatch = useDispatch(); const [create, setCreate] = useState(false); - const { notification, commit } = useSelector(store => store.app); + const { notification } = useSelector(store => store.app); + const [isCommitModalVisible, setIsCommitModalVisible] = useState(false); const intl = useIntl(); let location = useLocation(); let navigate = useNavigate(); @@ -260,16 +257,6 @@ const Units = () => { return null; } - const onCommit = () => { - dispatch(commitStagingData('Units')); - dispatch(setCommit(false)); - }; - - const onCommitAll = () => { - dispatch(commitStagingData('all')); - dispatch(setCommit(false)); - }; - const onOrganizationSelect = selectedOption => { const orgUid = selectedOption[0].orgUid; setSelectedOrganization(orgUid); @@ -335,26 +322,11 @@ const Units = () => { dispatch(setCommit(true))} + onClick={() => setIsCommitModalVisible(true)} /> )} - {commit && ( - - {intl.formatMessage({ - id: 'commit-units-message-question', - })} - - } - modalType={modalTypeEnum.basic} - onOk={onCommit} - extraButtonLabel={intl.formatMessage({ id: 'everything' })} - extraButtonOnClick={onCommitAll} - onClose={() => dispatch(setCommit(false))} - label={intl.formatMessage({ id: 'only-units' })} - /> + {isCommitModalVisible && ( + setIsCommitModalVisible(false)} /> )} diff --git a/src/store/actions/app.js b/src/store/actions/app.js index 75683251..83a177fc 100644 --- a/src/store/actions/app.js +++ b/src/store/actions/app.js @@ -15,7 +15,6 @@ export const actions = keyMirror( 'SET_LOCALE', 'CONNECTION_CHECK', 'SET_NOTIFICATION', - 'COMMIT', 'PENDING_ERROR', 'SET_READ_ONLY', 'SIGN_USER_IN', @@ -76,11 +75,6 @@ export const setConnectionCheck = bool => ({ payload: bool, }); -export const setCommit = bool => ({ - type: actions.COMMIT, - payload: bool, -}); - export const setPendingError = bool => ({ type: actions.PENDING_ERROR, payload: bool, diff --git a/src/store/reducers/appReducer.js b/src/store/reducers/appReducer.js index 78373155..504ae8a5 100644 --- a/src/store/reducers/appReducer.js +++ b/src/store/reducers/appReducer.js @@ -13,7 +13,6 @@ const initialState = { connectionCheck: true, updateAvailablePleaseRefesh: false, notification: null, - commit: false, pendingError: false, readOnlyMode: true, apiKey: null, @@ -45,9 +44,6 @@ const appReducer = (state = initialState, action) => { case appActions.DEACTIVATE_PROGRESS_INDICATOR: return u({ showProgressOverlay: false }, state); - case appActions.COMMIT: - return u({ commit: action.payload }, state); - case appActions.SET_GLOBAL_ERROR_MESSAGE: return u({ errorMessage: action.payload }, state);