From 7f039d33280d345f7019544ebea2fcefe6bb76d4 Mon Sep 17 00:00:00 2001 From: henrikmv Date: Wed, 20 Nov 2024 09:35:59 +0100 Subject: [PATCH] feat: geometry scheduledat occuredat in changelog --- .../EventChangelogWrapper.component.js | 10 ++ .../common/Changelog/Changelog.types.js | 3 + .../ChangelogChangeCell.js | 4 +- .../ChangelogChangeCell/index.js | 3 + .../ChangelogValueCell/ChangelogValueCell.js | 98 +++++++++++++++++++ .../ChangelogValueCellComponents.types.js | 13 +++ .../ChangelogValueCellDefault.js | 33 +++++++ .../ChangelogValueCellPolygon.js | 93 ++++++++++++++++++ .../ChangelogValueCellComponents/index.js | 6 ++ .../ChangelogValueCell/index.js | 3 + .../common/hooks/useListDataValues.js | 3 +- 11 files changed, 266 insertions(+), 3 deletions(-) rename src/core_modules/capture-core/components/WidgetsChangelog/common/ChangelogTable/ChangelogCells/{ => ChangelogChangeCell}/ChangelogChangeCell.js (87%) create mode 100644 src/core_modules/capture-core/components/WidgetsChangelog/common/ChangelogTable/ChangelogCells/ChangelogChangeCell/index.js create mode 100644 src/core_modules/capture-core/components/WidgetsChangelog/common/ChangelogTable/ChangelogCells/ChangelogValueCell/ChangelogValueCell.js create mode 100644 src/core_modules/capture-core/components/WidgetsChangelog/common/ChangelogTable/ChangelogCells/ChangelogValueCell/ChangelogValueCellComponents/ChangelogValueCellComponents.types.js create mode 100644 src/core_modules/capture-core/components/WidgetsChangelog/common/ChangelogTable/ChangelogCells/ChangelogValueCell/ChangelogValueCellComponents/ChangelogValueCellDefault.js create mode 100644 src/core_modules/capture-core/components/WidgetsChangelog/common/ChangelogTable/ChangelogCells/ChangelogValueCell/ChangelogValueCellComponents/ChangelogValueCellPolygon.js create mode 100644 src/core_modules/capture-core/components/WidgetsChangelog/common/ChangelogTable/ChangelogCells/ChangelogValueCell/ChangelogValueCellComponents/index.js create mode 100644 src/core_modules/capture-core/components/WidgetsChangelog/common/ChangelogTable/ChangelogCells/ChangelogValueCell/index.js diff --git a/src/core_modules/capture-core/components/WidgetEventEdit/EventChangelogWrapper/EventChangelogWrapper.component.js b/src/core_modules/capture-core/components/WidgetEventEdit/EventChangelogWrapper/EventChangelogWrapper.component.js index e7041bdd74..4f3f931fbf 100644 --- a/src/core_modules/capture-core/components/WidgetEventEdit/EventChangelogWrapper/EventChangelogWrapper.component.js +++ b/src/core_modules/capture-core/components/WidgetEventEdit/EventChangelogWrapper/EventChangelogWrapper.component.js @@ -42,9 +42,19 @@ export const EventChangelogWrapper = ({ formFoundation, eventId, eventData, ...p return acc; }, {}); + const additionalFields = { + geometry: { + id: 'geometry', + name: formFoundation.featureType, + type: formFoundation.featureType === 'Polygon' ? + dataElementTypes.POLYGON : dataElementTypes.COORDINATE, + }, + }; + return { ...fieldElementsById, ...fieldElementsContext, + ...additionalFields, }; }, [formFoundation]); diff --git a/src/core_modules/capture-core/components/WidgetsChangelog/common/Changelog/Changelog.types.js b/src/core_modules/capture-core/components/WidgetsChangelog/common/Changelog/Changelog.types.js index 56dccc68cd..d7173ddc1c 100644 --- a/src/core_modules/capture-core/components/WidgetsChangelog/common/Changelog/Changelog.types.js +++ b/src/core_modules/capture-core/components/WidgetsChangelog/common/Changelog/Changelog.types.js @@ -6,6 +6,7 @@ type CreatedChange = {| type: typeof CHANGE_TYPES.CREATED, dataElement?: string, attribute?: string, + property?: string, currentValue: any, |} @@ -13,6 +14,7 @@ type UpdatedChange = {| type: typeof CHANGE_TYPES.UPDATED, dataElement?: string, attribute?: string, + property?: string, previousValue: any, currentValue: any, |} @@ -21,6 +23,7 @@ type DeletedChange = {| type: typeof CHANGE_TYPES.DELETED, dataElement?: string, attribute?: string, + property?: string, previousValue: any, |} diff --git a/src/core_modules/capture-core/components/WidgetsChangelog/common/ChangelogTable/ChangelogCells/ChangelogChangeCell.js b/src/core_modules/capture-core/components/WidgetsChangelog/common/ChangelogTable/ChangelogCells/ChangelogChangeCell/ChangelogChangeCell.js similarity index 87% rename from src/core_modules/capture-core/components/WidgetsChangelog/common/ChangelogTable/ChangelogCells/ChangelogChangeCell.js rename to src/core_modules/capture-core/components/WidgetsChangelog/common/ChangelogTable/ChangelogCells/ChangelogChangeCell/ChangelogChangeCell.js index 6f9a273d67..a5ce9256fe 100644 --- a/src/core_modules/capture-core/components/WidgetsChangelog/common/ChangelogTable/ChangelogCells/ChangelogChangeCell.js +++ b/src/core_modules/capture-core/components/WidgetsChangelog/common/ChangelogTable/ChangelogCells/ChangelogChangeCell/ChangelogChangeCell.js @@ -3,8 +3,8 @@ import React from 'react'; import log from 'loglevel'; import { Tag } from '@dhis2/ui'; import i18n from '@dhis2/d2-i18n'; -import { CHANGE_TYPES } from '../../Changelog/Changelog.constants'; -import { errorCreator } from '../../../../../../capture-core-utils'; +import { CHANGE_TYPES } from '../../../Changelog/Changelog.constants'; +import { errorCreator } from '../../../../../../../capture-core-utils'; type Config = { label: string, diff --git a/src/core_modules/capture-core/components/WidgetsChangelog/common/ChangelogTable/ChangelogCells/ChangelogChangeCell/index.js b/src/core_modules/capture-core/components/WidgetsChangelog/common/ChangelogTable/ChangelogCells/ChangelogChangeCell/index.js new file mode 100644 index 0000000000..f90d8203ee --- /dev/null +++ b/src/core_modules/capture-core/components/WidgetsChangelog/common/ChangelogTable/ChangelogCells/ChangelogChangeCell/index.js @@ -0,0 +1,3 @@ +// @flow + +export { ChangelogChangeCell } from './ChangelogChangeCell'; diff --git a/src/core_modules/capture-core/components/WidgetsChangelog/common/ChangelogTable/ChangelogCells/ChangelogValueCell/ChangelogValueCell.js b/src/core_modules/capture-core/components/WidgetsChangelog/common/ChangelogTable/ChangelogCells/ChangelogValueCell/ChangelogValueCell.js new file mode 100644 index 0000000000..18941872f0 --- /dev/null +++ b/src/core_modules/capture-core/components/WidgetsChangelog/common/ChangelogTable/ChangelogCells/ChangelogValueCell/ChangelogValueCell.js @@ -0,0 +1,98 @@ +// @flow +import React from 'react'; +import { withStyles } from '@material-ui/core/styles'; +import { colors, spacers } from '@dhis2/ui'; +import { CHANGE_TYPES } from '../../../Changelog/Changelog.constants'; +import { + DefaultChangelogComponentsByChangeType, + PlygonChangelogComponentsByChangeType, +} from './ChangelogValueCellComponents'; + +type Props = { + dataItemId: string, + changeType: $Values, + previousValue?: string, + currentValue?: string, + classes: { + container: string, + valueContainer: string, + buttonContainer: string, + previousValue: string, + currentValue: string, + updatePreviousValue: string, + updateCurrentValue: string, + updateArrow: string, + viewButton: string, + }, +}; + +const styles = { + container: { + display: 'flex', + flexDirection: 'row', + alignItems: 'center', + whiteSpace: 'normal', + height: '100%', + }, + buttonContainer: { + display: 'flex', + alignItems: 'center', + justifyContent: 'center', + }, + previousValue: { + color: colors.grey700, + wordBreak: 'break-word', + }, + currentValue: { + color: colors.grey900, + wordBreak: 'break-word', + }, + updateArrow: { + display: 'inline-flex', + alignItems: 'center', + margin: spacers.dp4, + }, + viewButton: { + background: 'none', + border: 'none', + cursor: 'pointer', + color: colors.grey800, + display: 'flex', + alignItems: 'center', + '&:hover': { + textDecoration: 'underline', + color: 'black', + }, + }, +}; + +export const ChangelogValueCellPlain = ({ + dataItemId, + changeType, + currentValue, + previousValue, + classes, +}: Props) => { + if (!currentValue) { return null; } + const isPolygon = dataItemId === 'geometry' && currentValue.length > 2; + const ComponentsByChangeType = isPolygon + ? PlygonChangelogComponentsByChangeType + : DefaultChangelogComponentsByChangeType; + + const ChangelogComponent = ComponentsByChangeType[changeType]; + + if (!ChangelogComponent) { + console.error(`No component found for change type: ${changeType}`); + return null; + } + + return ( + + ); +}; + +export const ChangelogValueCell = withStyles(styles)(ChangelogValueCellPlain); diff --git a/src/core_modules/capture-core/components/WidgetsChangelog/common/ChangelogTable/ChangelogCells/ChangelogValueCell/ChangelogValueCellComponents/ChangelogValueCellComponents.types.js b/src/core_modules/capture-core/components/WidgetsChangelog/common/ChangelogTable/ChangelogCells/ChangelogValueCell/ChangelogValueCellComponents/ChangelogValueCellComponents.types.js new file mode 100644 index 0000000000..fa5261a085 --- /dev/null +++ b/src/core_modules/capture-core/components/WidgetsChangelog/common/ChangelogTable/ChangelogCells/ChangelogValueCell/ChangelogValueCellComponents/ChangelogValueCellComponents.types.js @@ -0,0 +1,13 @@ +// @flow +export type ChangelogValueCellProps = { + previousValue?: string, + currentValue?: string, + classes: { + container: string, + buttonContainer: string, + previousValue: string, + currentValue: string, + updateArrow: string, + viewButton: string, + }, +}; diff --git a/src/core_modules/capture-core/components/WidgetsChangelog/common/ChangelogTable/ChangelogCells/ChangelogValueCell/ChangelogValueCellComponents/ChangelogValueCellDefault.js b/src/core_modules/capture-core/components/WidgetsChangelog/common/ChangelogTable/ChangelogCells/ChangelogValueCell/ChangelogValueCellComponents/ChangelogValueCellDefault.js new file mode 100644 index 0000000000..53d47340eb --- /dev/null +++ b/src/core_modules/capture-core/components/WidgetsChangelog/common/ChangelogTable/ChangelogCells/ChangelogValueCell/ChangelogValueCellComponents/ChangelogValueCellDefault.js @@ -0,0 +1,33 @@ +// @flow +import React from 'react'; +import { IconArrowRight16 } from '@dhis2/ui'; +import { CHANGE_TYPES } from '../../../../Changelog/Changelog.constants'; +import type { ChangelogValueCellProps } from './ChangelogValueCellComponents.types'; + +const Updated = ({ previousValue, currentValue, classes }: ChangelogValueCellProps) => ( +
+ {previousValue} + + + + {currentValue} +
+); + +const Created = ({ currentValue, classes }: ChangelogValueCellProps) => ( +
+ {currentValue} +
+); + +const Deleted = ({ previousValue, classes }: ChangelogValueCellProps) => ( +
+ {previousValue} +
+); + +export const DefaultChangelogComponentsByChangeType = Object.freeze({ + [CHANGE_TYPES.UPDATED]: Updated, + [CHANGE_TYPES.CREATED]: Created, + [CHANGE_TYPES.DELETED]: Deleted, +}); diff --git a/src/core_modules/capture-core/components/WidgetsChangelog/common/ChangelogTable/ChangelogCells/ChangelogValueCell/ChangelogValueCellComponents/ChangelogValueCellPolygon.js b/src/core_modules/capture-core/components/WidgetsChangelog/common/ChangelogTable/ChangelogCells/ChangelogValueCell/ChangelogValueCellComponents/ChangelogValueCellPolygon.js new file mode 100644 index 0000000000..2dd45fe46c --- /dev/null +++ b/src/core_modules/capture-core/components/WidgetsChangelog/common/ChangelogTable/ChangelogCells/ChangelogValueCell/ChangelogValueCellComponents/ChangelogValueCellPolygon.js @@ -0,0 +1,93 @@ +// @flow +import React, { useState } from 'react'; +import { IconArrowRight16, IconChevronUp16, IconChevronDown16 } from '@dhis2/ui'; +import { CHANGE_TYPES } from '../../../../Changelog/Changelog.constants'; +import type { ChangelogValueCellProps } from './ChangelogValueCellComponents.types'; + +const ValueDisplay = ({ value, showMore, className }) => ( + {showMore ? value : value?.slice(0, 1)} +); + +const ViewMoreButton = ({ showMore, onClick, classes }) => ( + +); + +const Updated = ({ previousValue, currentValue, classes }: ChangelogValueCellProps) => { + const [showMore, setShowMore] = useState(false); + + return ( + <> +
+ + + + + +
+
+ setShowMore(!showMore)} + classes={classes} + /> +
+ + + ); +}; + + +const Created = ({ currentValue, classes }: ChangelogValueCellProps) => { + const [showMore, setShowMore] = useState(false); + + return ( +
+ + setShowMore(!showMore)} + classes={classes} + /> +
+ ); +}; + +const Deleted = ({ previousValue, classes }: ChangelogValueCellProps) => { + const [showMore, setShowMore] = useState(false); + + return ( +
+ + setShowMore(!showMore)} + classes={classes} + /> +
+ ); +}; + +export const PlygonChangelogComponentsByChangeType = Object.freeze({ + [CHANGE_TYPES.UPDATED]: Updated, + [CHANGE_TYPES.CREATED]: Created, + [CHANGE_TYPES.DELETED]: Deleted, +}); diff --git a/src/core_modules/capture-core/components/WidgetsChangelog/common/ChangelogTable/ChangelogCells/ChangelogValueCell/ChangelogValueCellComponents/index.js b/src/core_modules/capture-core/components/WidgetsChangelog/common/ChangelogTable/ChangelogCells/ChangelogValueCell/ChangelogValueCellComponents/index.js new file mode 100644 index 0000000000..fc72eca0e2 --- /dev/null +++ b/src/core_modules/capture-core/components/WidgetsChangelog/common/ChangelogTable/ChangelogCells/ChangelogValueCell/ChangelogValueCellComponents/index.js @@ -0,0 +1,6 @@ +// @flow + +export { DefaultChangelogComponentsByChangeType } from './ChangelogValueCellDefault'; +export { PlygonChangelogComponentsByChangeType } from './ChangelogValueCellPolygon'; + +export type { ChangelogValueCellProps } from './ChangelogValueCellComponents.types'; diff --git a/src/core_modules/capture-core/components/WidgetsChangelog/common/ChangelogTable/ChangelogCells/ChangelogValueCell/index.js b/src/core_modules/capture-core/components/WidgetsChangelog/common/ChangelogTable/ChangelogCells/ChangelogValueCell/index.js new file mode 100644 index 0000000000..88dbf63fb0 --- /dev/null +++ b/src/core_modules/capture-core/components/WidgetsChangelog/common/ChangelogTable/ChangelogCells/ChangelogValueCell/index.js @@ -0,0 +1,3 @@ +// @flow + +export { ChangelogValueCell } from './ChangelogValueCell'; diff --git a/src/core_modules/capture-core/components/WidgetsChangelog/common/hooks/useListDataValues.js b/src/core_modules/capture-core/components/WidgetsChangelog/common/hooks/useListDataValues.js index e94bf94a88..8bcce082d4 100644 --- a/src/core_modules/capture-core/components/WidgetsChangelog/common/hooks/useListDataValues.js +++ b/src/core_modules/capture-core/components/WidgetsChangelog/common/hooks/useListDataValues.js @@ -44,7 +44,8 @@ const fetchFormattedValues = async ({ elementKey: string, change: Change, ) => { - const fieldId = change.dataElement || change.attribute; + const { dataElement, attribute, property } = change; + const fieldId = dataElement ?? attribute ?? property; if (!fieldId) { log.error('Could not find fieldId in change:', change); return { metadataElement: null, fieldId: null };