diff --git a/src/util/ContextToProps.tsx b/src/util/ContextToProps.tsx index fdf2192..036f483 100644 --- a/src/util/ContextToProps.tsx +++ b/src/util/ContextToProps.tsx @@ -59,7 +59,6 @@ export const withStoreToControlProps = (Component: React.FC): }>(successValidation); const { form } = props; - const controlProps = mapStateToControlProps(props); const [id, collIri, collIriOverride, inCollPath, viewKindElement, viewDescrElement] = processViewKindOverride( props, @@ -69,12 +68,9 @@ export const withStoreToControlProps = (Component: React.FC): const coll = collIriOverride ? store.getColl(collIriOverride) : undefined; let collData = coll?.data; if (collData) collData = getSnapshot(collData); + const controlProps = mapStateToControlProps({ ...props, data: collData }); - if (!collData || collData.length === 0) { - return ; - } - - const data = collData[0]; + const data = collData.length !== 0 ? collData[0] : {}; const onValidate = (data: any) => { if (viewKindElement.options && Array.isArray(viewKindElement.options.validation)) { const validation = viewKindElement.options.validation; @@ -221,16 +217,17 @@ export const withStoreToCellProps = (Component: React.FC): React.FC => observer((props: any) => { const { data, onMeasureChange, height, uri, CKey, rowData, viewKindElement } = props; const path = viewKindElement.scope ? viewKindElement.scope.split('/').join('.') : null; - const controlProps = mapStateToControlProps(props); /*const { store } = useRootCtx(); const onSave = (data: any) => { let newData: any = {}; newData[CKey] = data; store.saveCellData(newData, uri, rowData['@id']); };*/ + const cellData = path ? get(data, path) : data; + const controlProps = mapStateToControlProps({ ...props, data: cellData }); return ( ): Rea return ; }); -const mapStateToControlProps = ({ id, schema, viewKindElement, viewKind, enabled }: ToControlProps) => { +const mapStateToControlProps = ({ id, schema, viewKindElement, viewKind, data }: ToControlProps & { data: any }) => { const pathSegments = id.split('/'); const path = pathSegments.join('.properties.'); const visible = checkProperty('visible', path, viewKindElement, viewKind); @@ -600,11 +597,12 @@ const mapStateToControlProps = ({ id, schema, viewKindElement, viewKind, enabled const labelDesc = createLabelDescriptionFrom(viewKindElement as any, schema); const label = labelDesc.show ? (labelDesc.text as string) : ''; const key = pathSegments[1]; + const enabled = data && (editable ?? true); return { description, label, visible, - enabled: editable === 'undefined' ? true : editable, + enabled, required, uiOptions, key, diff --git a/stories/Form.stories.tsx b/stories/Form.stories.tsx index 8e70f33..a56e82d 100644 --- a/stories/Form.stories.tsx +++ b/stories/Form.stories.tsx @@ -13,7 +13,7 @@ import { Meta, Story } from '@storybook/react'; import { Provider } from 'react-redux'; import { asReduxStore, connectReduxDevtools } from 'mst-middlewares'; -import { SparqlClientImpl, rootModelInitialState, CollState } from '@agentlab/sparql-jsld-client'; +import { SparqlClientImpl, rootModelInitialState, CollState, JsObject } from '@agentlab/sparql-jsld-client'; import { RendererRegistryEntry, @@ -98,29 +98,44 @@ const viewDescrs = [ }, ]; -const additionalColls: CollState[] = [ - // ViewKinds Collection - { - constr: viewKindCollConstr, - data: viewKinds, - opt: { - updPeriod: undefined, - lastSynced: moment.now(), - //resolveCollConstrs: false, // disable data loading from the server for viewKinds.collConstrs +const createAdditionalColls = (viewKinds: any, data: JsObject[] | undefined): CollState[] => { + const additionalColls = [ + // ViewKinds Collection + { + constr: viewKindCollConstr, + data: viewKinds, + opt: { + updPeriod: undefined, + lastSynced: moment.now(), + //resolveCollConstrs: false, // disable data loading from the server for viewKinds.collConstrs + }, }, - }, - // ViewDescrs Collection - { - constr: viewDescrCollConstr, - data: viewDescrs, - opt: { - updPeriod: undefined, - lastSynced: moment.now(), - //resolveCollConstrs: false, // 'true' here (by default) triggers data loading from the server - // for viewDescrs.collConstrs (it loads lazily -- after the first access) + // ViewDescrs Collection + { + constr: viewDescrCollConstr, + data: viewDescrs, + opt: { + updPeriod: undefined, + lastSynced: moment.now(), + //resolveCollConstrs: false, // 'true' here (by default) triggers data loading from the server + // for viewDescrs.collConstrs (it loads lazily -- after the first access) + }, }, - }, -]; + ]; + if (data) { + additionalColls.push({ + constr: viewKinds[0].collsConstrs[0], + data, + opt: { + updPeriod: undefined, + lastSynced: moment.now(), + //resolveCollConstrs: false, // 'true' here (by default) triggers data loading from the server + // for viewDescrs.collConstrs (it loads lazily -- after the first access) + }, + }); + } + return additionalColls; +}; export default { title: 'Form/ArtifactForm', @@ -134,7 +149,12 @@ const Template: Story = (args: any) => { const antdRenderers: RendererRegistryEntry[] = [...antdControlRenderers, ...antdLayoutRenderers]; const client = new SparqlClientImpl('https://rdf4j.agentlab.ru/rdf4j-server'); - const rootStore = createUiModelFromState('reqs2', client, rootModelInitialState, additionalColls); + const rootStore = createUiModelFromState( + 'reqs2', + client, + rootModelInitialState, + createAdditionalColls(args.viewKinds || viewKinds, args.data), + ); const store: any = asReduxStore(rootStore); // eslint-disable-next-line @typescript-eslint/no-var-requires connectReduxDevtools(require('remotedev'), rootStore); @@ -151,3 +171,24 @@ const Template: Story = (args: any) => { export const RemoteData = Template.bind({}); RemoteData.args = {}; + +export const ObjectWithNullProperty = Template.bind({}); +ObjectWithNullProperty.args = { + data: [ + { + creator: null, + assetFolder: null, + description: 'TestDescr', + }, + ], +}; + +export const EmptyObject = Template.bind({}); +EmptyObject.args = { + data: [{}], +}; + +export const NoObject = Template.bind({}); +NoObject.args = { + data: [{}], +};