refactor: remove context call inside useComponents, remove getChildError (#23)

Author: bocembocem

src/lib/core/__tests__/helpers.test.ts

@@ -0,0 +1,61 @@
+import {SpecTypes} from '../constants';
+import {
+    isArraySpec,
+    isBooleanSpec,
+    isCorrectSpec,
+    isNumberSpec,
+    isObjectSpec,
+    isStringSpec,
+} from '../helpers';
+
+describe('core/utils/common', () => {
+    test('isCorrectSpec', () => {
+        expect(isCorrectSpec(true)).toBe(false);
+        expect(isCorrectSpec({})).toBe(false);
+        expect(isCorrectSpec([])).toBe(false);
+        expect(isCorrectSpec({type: SpecTypes.Array, viewSpec: null})).toBe(false);
+        expect(isCorrectSpec({type: SpecTypes.Array, viewSpec: {}})).toBe(false);
+        expect(isCorrectSpec({type: SpecTypes.Array, viewSpec: {type: null}})).toBe(false);
+        expect(isCorrectSpec({type: SpecTypes.Array, viewSpec: {type: 'base'}})).toBe(true);
+    });
+
+    test('isArraySpec', () => {
+        expect(isArraySpec(true)).toBe(false);
+        expect(isArraySpec({})).toBe(false);
+        expect(isArraySpec([])).toBe(false);
+        expect(isArraySpec({type: SpecTypes.String})).toBe(false);
+        expect(isArraySpec({type: SpecTypes.Array})).toBe(true);
+    });
+
+    test('isBooleanSpec', () => {
+        expect(isBooleanSpec(true)).toBe(false);
+        expect(isBooleanSpec({})).toBe(false);
+        expect(isBooleanSpec([])).toBe(false);
+        expect(isBooleanSpec({type: SpecTypes.String})).toBe(false);
+        expect(isBooleanSpec({type: SpecTypes.Boolean})).toBe(true);
+    });
+
+    test('isNumberSpec', () => {
+        expect(isNumberSpec(true)).toBe(false);
+        expect(isNumberSpec({})).toBe(false);
+        expect(isNumberSpec([])).toBe(false);
+        expect(isNumberSpec({type: SpecTypes.String})).toBe(false);
+        expect(isNumberSpec({type: SpecTypes.Number})).toBe(true);
+    });
+
+    test('isObjectSpec', () => {
+        expect(isObjectSpec(true)).toBe(false);
+        expect(isObjectSpec({})).toBe(false);
+        expect(isObjectSpec([])).toBe(false);
+        expect(isObjectSpec({type: SpecTypes.String})).toBe(false);
+        expect(isObjectSpec({type: SpecTypes.Object})).toBe(true);
+    });
+
+    test('isStringSpec', () => {
+        expect(isStringSpec(true)).toBe(false);
+        expect(isStringSpec({})).toBe(false);
+        expect(isStringSpec([])).toBe(false);
+        expect(isStringSpec({type: SpecTypes.Array})).toBe(false);
+        expect(isStringSpec({type: SpecTypes.String})).toBe(true);
+    });
+});

src/lib/core/components/View/ViewController.tsx

@@ -15,8 +15,8 @@ export const ViewController = <SpecType extends Spec>({
     spec,
     name,
 }: ViewControllerProps<SpecType>) => {
-    const {value, Link} = useDynamicFormsCtx();
-    const {viewEntity, Layout} = useComponents(spec);
+    const {config, value, Link} = useDynamicFormsCtx();
+    const {viewEntity, Layout} = useComponents(spec, config);
     const render = useRender({name, value, spec, viewEntity, Layout, Link});
 
     return <>{render}</>;

src/lib/core/components/View/__tests__/helpers.test.ts

@@ -0,0 +1,19 @@
+import {dynamicViewConfig} from '../../../../kit';
+import {isCorrectViewConfig} from '../helpers';
+
+describe('View/helpers', () => {
+    test('isCorrectViewConfig', () => {
+        expect(isCorrectViewConfig(true)).toBe(false);
+        expect(isCorrectViewConfig({})).toBe(false);
+        expect(isCorrectViewConfig([])).toBe(false);
+        expect(
+            isCorrectViewConfig({
+                string: {
+                    view: {},
+                    layouts: {},
+                },
+            }),
+        ).toBe(false);
+        expect(isCorrectViewConfig(dynamicViewConfig)).toBe(true);
+    });
+});

src/lib/core/components/View/hooks/__tests__/useComponents.test.tsx

@@ -0,0 +1,102 @@
+import React from 'react';
+
+import {render} from '@testing-library/react';
+import _ from 'lodash';
+
+import {Spec} from '../../../../../core';
+import {BaseView, ViewRow, dynamicViewConfig} from '../../../../../kit';
+import {SpecTypes} from '../../../../constants';
+import {StringSpec} from '../../../../types';
+import {DynamicViewConfig} from '../../types';
+import {useComponents} from '../useComponents';
+
+const spec: StringSpec = {type: SpecTypes.String, viewSpec: {type: '', layout: ''}};
+
+interface UseComponentsProps {
+    mirror: {
+        useComponents?: ReturnType<typeof useComponents>;
+    };
+    spec: Spec;
+    config: DynamicViewConfig;
+}
+
+const UseComponents: React.FC<UseComponentsProps> = ({mirror, spec, config}) => {
+    mirror.useComponents = useComponents(spec, config);
+
+    return null;
+};
+
+describe('View/hooks/useComponents', () => {
+    test('incorrect config', () => {
+        const mirror: UseComponentsProps['mirror'] = {};
+
+        render(<UseComponents mirror={mirror} spec={spec} config={{} as any} />);
+
+        expect(mirror.useComponents).toBeInstanceOf(Object);
+        expect(mirror.useComponents?.viewEntity).toBe(undefined);
+        expect(mirror.useComponents?.Layout).toBe(undefined);
+    });
+
+    test('incorrect spec', () => {
+        const mirror: UseComponentsProps['mirror'] = {};
+
+        render(<UseComponents mirror={mirror} spec={{} as any} config={dynamicViewConfig} />);
+
+        expect(mirror.useComponents).toBeInstanceOf(Object);
+        expect(mirror.useComponents?.viewEntity).toBe(undefined);
+        expect(mirror.useComponents?.Layout).toBe(undefined);
+    });
+
+    test('inputEntity and Layout not found', () => {
+        const mirror: UseComponentsProps['mirror'] = {};
+        const _spec = _.cloneDeep(spec);
+
+        _spec.viewSpec.type = 'nonexistent';
+        _spec.viewSpec.layout = 'nonexistent';
+
+        render(<UseComponents mirror={mirror} spec={_spec} config={dynamicViewConfig} />);
+
+        expect(mirror.useComponents).toBeInstanceOf(Object);
+        expect(mirror.useComponents?.viewEntity).toBe(undefined);
+        expect(mirror.useComponents?.Layout).toBe(undefined);
+    });
+
+    test('inputEntity not found', () => {
+        const mirror: UseComponentsProps['mirror'] = {};
+        const _spec = _.cloneDeep(spec);
+
+        _spec.viewSpec.type = 'nonexistent';
+        _spec.viewSpec.layout = 'row';
+
+        render(<UseComponents mirror={mirror} spec={_spec} config={dynamicViewConfig} />);
+
+        expect(mirror.useComponents?.viewEntity).toBe(undefined);
+        expect(mirror.useComponents?.Layout).toBe(ViewRow);
+    });
+
+    test('Layout not found', () => {
+        const mirror: UseComponentsProps['mirror'] = {};
+        const _spec = _.cloneDeep(spec);
+
+        _spec.viewSpec.type = 'base';
+        _spec.viewSpec.layout = 'nonexistent';
+
+        render(<UseComponents mirror={mirror} spec={_spec} config={dynamicViewConfig} />);
+
+        expect(mirror.useComponents?.viewEntity?.Component).toBe(BaseView);
+        expect(mirror.useComponents?.Layout).toBe(undefined);
+    });
+
+    test('inputEntity and Layout found', () => {
+        const mirror: UseComponentsProps['mirror'] = {};
+        const _spec = _.cloneDeep(spec);
+
+        _spec.viewSpec.type = 'base';
+        _spec.viewSpec.layout = 'row';
+
+        render(<UseComponents mirror={mirror} spec={_spec} config={dynamicViewConfig} />);
+
+        expect(mirror.useComponents?.viewEntity?.Component).toBe(BaseView);
+        expect(mirror.useComponents?.Layout).toBe(ViewRow);
+    });
+});

src/lib/core/components/View/hooks/__tests__/useRender.test.tsx

@@ -0,0 +1,192 @@
+import React from 'react';
+
+import {render} from '@testing-library/react';
+import _ from 'lodash';
+
+import {UseRenderParams, useComponents, useRender} from '../';
+import {FormValue, Spec} from '../../../../../core';
+import {BaseView, ObjectBaseView, ViewRow, dynamicViewConfig} from '../../../../../kit';
+import {SpecTypes} from '../../../../constants';
+import {AnyObject, ObjectSpec, StringSpec} from '../../../../types';
+import {DynamicViewConfig} from '../../types';
+
+const name = 'name';
+const value = {name: 'value'};
+const spec: StringSpec = {type: SpecTypes.String, viewSpec: {type: '', layout: ''}};
+
+interface UseRenderProps {
+    mirror: {
+        useRender?: ReturnType<typeof useRender>;
+    };
+    name: string;
+    value: AnyObject;
+    spec: Spec;
+    config: DynamicViewConfig;
+    Link?: React.ComponentType<{
+        value: FormValue;
+        link: Spec['viewSpec']['link'];
+    }>;
+}
+
+const UseRender: React.FC<UseRenderProps> = ({mirror, spec, config, ...rest}) => {
+    const {viewEntity, Layout} = useComponents(spec, config);
+
+    mirror.useRender = useRender({spec, viewEntity, Layout, ...rest} as UseRenderParams<
+        FormValue,
+        Spec
+    >);
+
+    return null;
+};
+
+describe('View/hooks/useRender', () => {
+    test('incorrect spec', () => {
+        const mirror: UseRenderProps['mirror'] = {};
+
+        render(
+            <UseRender
+                mirror={mirror}
+                name={name}
+                value={value}
+                spec={{} as any}
+                config={dynamicViewConfig}
+            />,
+        );
+
+        expect(mirror.useRender).toBe(null);
+    });
+
+    test('incorrect name', () => {
+        const mirror: UseRenderProps['mirror'] = {};
+        const _spec = _.cloneDeep(spec);
+
+        _spec.viewSpec.type = 'base';
+
+        render(
+            <UseRender
+                mirror={mirror}
+                name={undefined as any}
+                value={value}
+                spec={_spec}
+                config={dynamicViewConfig}
+            />,
+        );
+
+        expect(mirror.useRender).toBe(null);
+    });
+
+    test('empty viewEntity', () => {
+        const mirror: UseRenderProps['mirror'] = {};
+
+        render(
+            <UseRender
+                mirror={mirror}
+                name={name}
+                value={value}
+                spec={spec}
+                config={dynamicViewConfig}
+            />,
+        );
+
+        expect(mirror.useRender).toBe(null);
+    });
+
+    test('independent viewEntity and Layout found', () => {
+        const mirror: UseRenderProps['mirror'] = {};
+        const _spec: ObjectSpec = {type: SpecTypes.Object, viewSpec: {type: 'base', layout: 'row'}};
+
+        render(
+            <UseRender
+                mirror={mirror}
+                name={name}
+                value={value}
+                spec={_spec}
+                config={dynamicViewConfig}
+            />,
+        );
+        expect(mirror.useRender?.type).toBe(ObjectBaseView);
+        expect(mirror.useRender?.props.Layout).toBe(ViewRow);
+    });
+
+    test('viewEntity and Layout found', () => {
+        const mirror: UseRenderProps['mirror'] = {};
+        const _spec = _.cloneDeep(spec);
+
+        _spec.viewSpec.type = 'base';
+        _spec.viewSpec.layout = 'row';
+
+        render(
+            <UseRender
+                mirror={mirror}
+                name={name}
+                value={value}
+                spec={_spec}
+                config={dynamicViewConfig}
+            />,
+        );
+        expect(mirror.useRender?.type).toBe(ViewRow);
+        expect(mirror.useRender?.props.children.type).toBe(BaseView);
+    });
+
+    test('viewEntity found', () => {
+        const mirror: UseRenderProps['mirror'] = {};
+        const _spec = _.cloneDeep(spec);
+
+        _spec.viewSpec.type = 'base';
+
+        render(
+            <UseRender
+                mirror={mirror}
+                name={name}
+                value={value}
+                spec={_spec}
+                config={dynamicViewConfig}
+            />,
+        );
+        expect(mirror.useRender?.type).toBe(BaseView);
+    });
+
+    test('incorrect Link', () => {
+        const mirror: UseRenderProps['mirror'] = {};
+        const _spec = _.cloneDeep(spec);
+
+        _spec.viewSpec.type = 'base';
+        _spec.viewSpec.link = 'link';
+
+        render(
+            <UseRender
+                mirror={mirror}
+                name={name}
+                value={value}
+                spec={_spec}
+                config={dynamicViewConfig}
+                Link={null as any}
+            />,
+        );
+        expect(mirror.useRender?.props.linkValue).toBe(undefined);
+    });
+
+    test('correct Link', () => {
+        const mirror: UseRenderProps['mirror'] = {};
+        const Link = () => null;
+        const _spec = _.cloneDeep(spec);
+
+        _spec.viewSpec.type = 'base';
+        _spec.viewSpec.link = 'link';
+
+        render(
+            <UseRender
+                mirror={mirror}
+                name={name}
+                value={value}
+                spec={_spec}
+                config={dynamicViewConfig}
+                Link={Link}
+            />,
+        );
+
+        expect(mirror.useRender?.props.linkValue.type).toBe(Link);
+        expect(mirror.useRender?.props.linkValue.props.value).toBe(value[name]);
+        expect(mirror.useRender?.props.linkValue.props.link).toBe(_spec.viewSpec.link);
+    });
+});