diff --git a/app/src/js/applications/structures/visualization/components/index.js b/app/src/js/applications/structures/visualization/components/index.js index 1c4d4eca9..9ae6743d1 100644 --- a/app/src/js/applications/structures/visualization/components/index.js +++ b/app/src/js/applications/structures/visualization/components/index.js @@ -43,6 +43,9 @@ const Components = ({ componentDefinitions = []}) => { specification={{ attachment: selectedComponent.attachment, required: selectedComponent.required, + notation: selectedComponent.notation, + labelLg1: selectedComponent.labelLg1, + labelLg2: selectedComponent.labelLg2, }} /> )} diff --git a/demo.js b/demo.js new file mode 100644 index 000000000..17fc9870d --- /dev/null +++ b/demo.js @@ -0,0 +1,30 @@ +const createObject = (timestamp) => { + const date = new Date(0); + + const [hours, minutes] = timestamp.split(':'); // ["30"] + + if(!minutes){ + date.setUTCHours(0, hours) + + } else { + date.setUTCHours(hours, minutes) + } + return date; +} + +const createObject = (timestamp) => { + const date = new Date(0); + + if(timestamp.contains(':')){ + const [hours, minutes] = timestamp.split(':'); // ["30"] + date.setUTCHours(hours, minutes) + } else { + date.setUTCHours(0, timestamp) + } + + return date; +} + +console.log(createObject("30")) + +console.log(createObject("01:30")); diff --git a/packages/structures/src/components/component-selector/index.js b/packages/structures/src/components/component-selector/index.js index 5f12d4b43..1a2426c47 100644 --- a/packages/structures/src/components/component-selector/index.js +++ b/packages/structures/src/components/component-selector/index.js @@ -270,6 +270,9 @@ const ComponentSelector = ({ specification={{ attachment: selectedComponent.attachment, required: selectedComponent.required, + notation: selectedComponent.notation, + labelLg1: selectedComponent.labelLg1, + labelLg2: selectedComponent.labelLg2, }} onSave={saveSpecification} /> diff --git a/packages/structures/src/components/component-specification-form/component-specification-form.spec.js b/packages/structures/src/components/component-specification-form/component-specification-form.spec.js new file mode 100644 index 000000000..5484e89c2 --- /dev/null +++ b/packages/structures/src/components/component-specification-form/component-specification-form.spec.js @@ -0,0 +1,25 @@ +import React from 'react'; +import { fireEvent, render, screen } from '@testing-library/react'; +import { ComponentSpecificationForm } from './index'; + +describe('ComponentSpecificationForm', () => { + it('should render form inputs', async () => { + const component = {} + render(); + await screen.findByLabelText("Notation") + await screen.findByLabelText("Libellé") + await screen.findByLabelText("Label") + }); + + [['Notation', 'notation'], ['Libellé', 'labelLg1'], ['Label', 'labelLg2']].forEach(([label, propertyName]) => { + it(`should call onChange if the ${propertyName} changed`, async () => { + const component = {} + const onChange = jest.fn(); + render(); + const input = await screen.findByLabelText(label); + fireEvent.change(input, { target: { value: 'value' }}); + expect(onChange).toHaveBeenCalledWith({[propertyName]: "value"}) + }) + }) + +}) diff --git a/packages/structures/src/components/component-specification-form/index.js b/packages/structures/src/components/component-specification-form/index.js index ee4bede1f..fa698add9 100644 --- a/packages/structures/src/components/component-specification-form/index.js +++ b/packages/structures/src/components/component-specification-form/index.js @@ -1,9 +1,9 @@ import React, { useState, useEffect } from 'react'; -import D from '../../i18n/build-dictionary'; +import D, {D1, D2} from '../../i18n/build-dictionary'; import { Select } from '@inseefr/wilco'; import { getAllAttachment } from '../../utils'; import './component-specification-form.scss'; -import { MEASURE_PROPERTY_TYPE } from '../../utils/constants'; +import { ATTRIBUTE_PROPERTY_TYPE, MEASURE_PROPERTY_TYPE } from '../../utils/constants'; import Api from '../../apis/structure-api'; export const ComponentSpecificationForm = ({ @@ -14,7 +14,6 @@ export const ComponentSpecificationForm = ({ disabled = false, }) => { const [attachments, setAttachments] = useState([]); - useEffect(() => { Promise.all(structureComponents .filter(c => c.component.type === MEASURE_PROPERTY_TYPE) @@ -26,64 +25,124 @@ export const ComponentSpecificationForm = ({ return ( - - - - component.attachment?.some((a) => a.includes(c.value)) - )} - multi - options={attachments} - onChange={(value) => { + + + {D.idTitle} + { + onChange({ + ...component, + notation: e.target.value, + }); + }} + disabled={disabled} + /> + + + + + {D1.label} + { + onChange({ + ...component, + labelLg1: e.target.value, + }); + }} + disabled={disabled} + /> + + + {D2.label} + { onChange({ ...component, - attachment: value?.map((v) => v.value), + labelLg2: e.target.value, }); }} disabled={disabled} /> - - - {D.requiredSpecificationTitle} - - { + { selectedComponent.component.type === ATTRIBUTE_PROPERTY_TYPE && + <> + + + + component.attachment?.some((a) => a.includes(c.value)) + )} + multi + options={attachments} + onChange={(value) => { onChange({ ...component, - required: true, + attachment: value?.map((v) => v.value), }); }} disabled={disabled} /> - {D.yes} - - - { - onChange({ - ...component, - required: false, - }); - }} - disabled={disabled} - /> - {D.no} - - - + + + + + {D.requiredSpecificationTitle} + + + { + onChange({ + ...component, + required: true, + }); + }} + disabled={disabled} + /> + {D.yes} + + + { + onChange({ + ...component, + required: false, + }); + }} + disabled={disabled} + /> + {D.no} + + + + > + } ); }; diff --git a/packages/structures/src/components/component-specification-modal/component-specification-modal.spec.js b/packages/structures/src/components/component-specification-modal/component-specification-modal.spec.js index a6a7a3241..4b8218044 100644 --- a/packages/structures/src/components/component-specification-modal/component-specification-modal.spec.js +++ b/packages/structures/src/components/component-specification-modal/component-specification-modal.spec.js @@ -17,6 +17,7 @@ describe('', () => { const { container } = render( @@ -29,6 +30,7 @@ describe('', () => { const { container } = render( @@ -36,13 +38,4 @@ describe('', () => { fireEvent.click(container.querySelector('.modal-footer button')); expect(onSave).toHaveBeenCalled(); }); - it('should display the component specification', async () => { - render( - - ); - await screen.findByText("DataSet"); - }); }); diff --git a/packages/structures/src/components/structure-component-selector/index.js b/packages/structures/src/components/structure-component-selector/index.js index 2a83661b8..64f85de7b 100644 --- a/packages/structures/src/components/structure-component-selector/index.js +++ b/packages/structures/src/components/structure-component-selector/index.js @@ -5,7 +5,6 @@ import D from '../../i18n/build-dictionary'; import { CollapsiblePanel } from '../collapsible-panel'; import { Table } from '@inseefr/wilco'; import { ComponentDetail } from '../component-detail'; -import { ATTRIBUTE_PROPERTY_TYPE } from '../../utils/constants/dsd-components'; import PropTypes from 'prop-types'; import { useSelector } from 'react-redux'; @@ -177,8 +176,7 @@ export const StructureComponentsSelector = ({ > - {component.type === ATTRIBUTE_PROPERTY_TYPE && ( - - )} {!readOnly && (