@leav/ui 0.0.1-alpha-2 → 0.0.1-alpha-3

package/src/components/RecordEdition/EditRecordModal/creationErrorContext.ts

@@ -1,12 +0,0 @@
-// Copyright LEAV Solutions 2017
-// This file is released under LGPL V3
-// License text available at https://www.gnu.org/licenses/lgpl-3.0.txt
-import {createContext} from 'react';
-import {CreateRecordMutation} from '../../../_gqlTypes';
-export interface ICreationErrorByField {
-    [attributeId: string]: CreateRecordMutation['createRecord']['valuesErrors'];
-}
-
-const CreationErrorContext = createContext<ICreationErrorByField>({});
-
-export default CreationErrorContext;

package/src/components/RecordEdition/EditRecordModal/index.ts

@@ -1,5 +0,0 @@
-// Copyright LEAV Solutions 2017
-// This file is released under LGPL V3
-// License text available at https://www.gnu.org/licenses/lgpl-3.0.txt
-import EditRecordModal from './EditRecordModal';
-export default EditRecordModal;

package/src/components/RecordEdition/EditRecordSidebar/EditRecordSidebar.test.tsx

@@ -1,159 +0,0 @@
-// Copyright LEAV Solutions 2017
-// This file is released under LGPL V3
-// License text available at https://www.gnu.org/licenses/lgpl-3.0.txt
-import userEvent from '@testing-library/user-event';
-import {mockFormAttribute, mockFormAttributeTree} from '_ui/__mocks__/common/attribute';
-import {mockRecord} from '_ui/__mocks__/common/record';
-import {mockTreeRecord, mockTreeRecordChild} from '_ui/__mocks__/common/treeElements';
-import {mockRecordPropertyWithAttribute} from '_ui/__mocks__/common/value';
-import {render, screen} from '../../../_tests/testUtils';
-import {initialState} from '../editRecordModalReducer/editRecordModalReducer';
-import {
-    EditRecordModalReducerContext,
-    IEditRecordModalReducerContext
-} from '../editRecordModalReducer/editRecordModalReducerContext';
-import EditRecordSidebar from './EditRecordSidebar';
-
-jest.mock('_ui/components/RecordEdition/EditRecordSidebar/RecordSummary', () => {
-    return function RecordSummary() {
-        return <div>RecordSummary</div>;
-    };
-});
-
-jest.mock('_ui/components/RecordEdition/EditRecord/uiElements/StandardField', () => {
-    return function StandardField() {
-        return <div>StandardField</div>;
-    };
-});
-
-describe('EditRecordSidebar', () => {
-    const mockReducer: IEditRecordModalReducerContext = {
-        state: {...initialState, record: mockRecord},
-        dispatch: jest.fn()
-    };
-    const mockReducerWithValue: IEditRecordModalReducerContext = {
-        ...mockReducer,
-        state: {
-            ...mockReducer.state,
-            record: mockRecord,
-            activeValue: mockRecordPropertyWithAttribute,
-            sidebarContent: 'valueDetails'
-        }
-    };
-
-    const mockReducerWithValueSimple: IEditRecordModalReducerContext = {
-        ...mockReducerWithValue,
-        state: {
-            ...mockReducerWithValue.state,
-            record: mockRecord,
-            activeValue: {
-                ...mockRecordPropertyWithAttribute,
-                value: {...mockRecordPropertyWithAttribute.value, modified_at: null, modified_by: null}
-            }
-        }
-    };
-
-    const mockHandleMetadataSubmit = jest.fn();
-
-    describe('Record summary', () => {
-        test('Display record summary', async () => {
-            render(
-                <EditRecordModalReducerContext.Provider value={mockReducer}>
-                    <EditRecordSidebar onMetadataSubmit={mockHandleMetadataSubmit} />
-                </EditRecordModalReducerContext.Provider>
-            );
-
-            expect(screen.getByText('RecordSummary')).toBeInTheDocument();
-        });
-    });
-
-    describe('Value details', () => {
-        test('Display active value details', async () => {
-            const {value, attribute} = mockReducerWithValue.state.activeValue;
-            render(
-                <EditRecordModalReducerContext.Provider value={mockReducerWithValue}>
-                    <EditRecordSidebar onMetadataSubmit={mockHandleMetadataSubmit} />
-                </EditRecordModalReducerContext.Provider>
-            );
-
-            expect(screen.queryByText(/created_at/)).toBeInTheDocument();
-            expect(screen.queryByText(/modified_at/)).toBeInTheDocument();
-            // user label should appear on created_by and modified_by
-            expect(screen.getAllByText(new RegExp(value.modified_by.whoAmI.label))).toHaveLength(2);
-
-            // Expand attribute section
-            await userEvent.click(screen.getByRole('button', {name: /attribute/}));
-
-            expect(await screen.findByText(attribute.id)).toBeInTheDocument();
-            expect(screen.getByText(attribute.label.fr)).toBeInTheDocument();
-            expect(screen.getByText(attribute.description.fr)).toBeInTheDocument();
-        });
-
-        test("Don't display modifier if not set in value", async () => {
-            render(
-                <EditRecordModalReducerContext.Provider value={mockReducerWithValueSimple}>
-                    <EditRecordSidebar onMetadataSubmit={mockHandleMetadataSubmit} />
-                </EditRecordModalReducerContext.Provider>
-            );
-
-            expect(screen.queryByText(/modified_at/)).not.toBeInTheDocument();
-            expect(screen.queryByText(/modified_by/)).not.toBeInTheDocument();
-        });
-
-        test('Display ancestors of tree value', async () => {
-            const mockReducerWithTreeValue = {
-                ...mockReducerWithValue,
-                state: {
-                    ...mockReducerWithValue.state,
-                    activeValue: {
-                        attribute: mockFormAttributeTree,
-                        value: {
-                            ...mockRecordPropertyWithAttribute.value,
-                            treeValue: {
-                                id: '123456',
-                                record: {...mockTreeRecord, whoAmI: {...mockTreeRecord.whoAmI, label: 'Tree record'}},
-                                ancestors: [{record: mockTreeRecordChild}, {record: mockTreeRecord}]
-                            }
-                        }
-                    }
-                }
-            };
-            render(
-                <EditRecordModalReducerContext.Provider value={mockReducerWithTreeValue}>
-                    <EditRecordSidebar onMetadataSubmit={mockHandleMetadataSubmit} />
-                </EditRecordModalReducerContext.Provider>
-            );
-
-            const collapseBtn = screen.getByRole('button', {name: /path/});
-            await userEvent.click(collapseBtn);
-
-            expect(screen.getByText('Tree record')).toBeInTheDocument();
-            expect(screen.getByText(mockTreeRecordChild.whoAmI.label)).toBeInTheDocument();
-        });
-
-        test('Display metadata of the value', async () => {
-            const mockReducerWithValueAndMetadata = {
-                ...mockReducerWithValue,
-                state: {
-                    ...mockReducerWithValue.state,
-                    activeValue: {
-                        ...mockReducerWithValue.state.activeValue,
-                        attribute: {
-                            ...mockReducerWithValue.state.activeValue.attribute,
-                            metadata_fields: [{...mockFormAttribute, values_list: null}]
-                        }
-                    }
-                }
-            };
-
-            render(
-                <EditRecordModalReducerContext.Provider value={mockReducerWithValueAndMetadata}>
-                    <EditRecordSidebar onMetadataSubmit={mockHandleMetadataSubmit} />
-                </EditRecordModalReducerContext.Provider>
-            );
-
-            expect(screen.getByText(/metadata/)).toBeInTheDocument();
-            expect(screen.getByText(/StandardField/)).toBeInTheDocument();
-        });
-    });
-});

package/src/components/RecordEdition/EditRecordSidebar/EditRecordSidebar.tsx

@@ -1,33 +0,0 @@
-// Copyright LEAV Solutions 2017
-// This file is released under LGPL V3
-// License text available at https://www.gnu.org/licenses/lgpl-3.0.txt
-import {MetadataSubmitValueFunc} from '../EditRecord/_types';
-import {useEditRecordModalReducer} from '../editRecordModalReducer/useEditRecordModalReducer';
-import RecordSummary from './RecordSummary';
-import ValueDetails from './ValueDetails';
-import ValuesVersions from './ValuesVersions';
-
-interface IEditRecordSidebarProps {
-    onMetadataSubmit: MetadataSubmitValueFunc;
-}
-
-function EditRecordSidebar({onMetadataSubmit}: IEditRecordSidebarProps): JSX.Element {
-    const {state} = useEditRecordModalReducer();
-
-    switch (state.sidebarContent) {
-        case 'valueDetails':
-            return (
-                <ValueDetails
-                    value={state.activeValue.value}
-                    attribute={state.activeValue.attribute}
-                    onMetadataSubmit={onMetadataSubmit}
-                />
-            );
-        case 'valuesVersions':
-            return <ValuesVersions />;
-        default:
-            return <RecordSummary record={state.record} />;
-    }
-}
-
-export default EditRecordSidebar;

package/src/components/RecordEdition/EditRecordSidebar/PropertiesList/PropertiesList.test.tsx

@@ -1,36 +0,0 @@
-// Copyright LEAV Solutions 2017
-// This file is released under LGPL V3
-// License text available at https://www.gnu.org/licenses/lgpl-3.0.txt
-import {act, render, screen} from '_ui/_tests/testUtils';
-import PropertiesList from './PropertiesList';
-
-describe('PropertiesList', () => {
-    const items = [
-        {
-            title: 'fieldA',
-            value: 'valueA'
-        },
-        {
-            title: 'fieldB',
-            value: 'valueB'
-        }
-    ];
-    test('Render items', async () => {
-        await act(async () => {
-            render(<PropertiesList items={items} />);
-        });
-
-        for (const item of items) {
-            expect(screen.getByText(item.title)).toBeInTheDocument();
-            expect(screen.getByText(item.value)).toBeInTheDocument();
-        }
-    });
-
-    test('Render a divider', async () => {
-        await act(async () => {
-            render(<PropertiesList items={[...items, {divider: true}]} />);
-        });
-
-        expect(screen.getByRole('separator')).toBeInTheDocument();
-    });
-});

package/src/components/RecordEdition/EditRecordSidebar/PropertiesList/PropertiesList.tsx

@@ -1,46 +0,0 @@
-// Copyright LEAV Solutions 2017
-// This file is released under LGPL V3
-// License text available at https://www.gnu.org/licenses/lgpl-3.0.txt
-import {Descriptions, Divider} from 'antd';
-
-export interface IPropertiesListItemValue {
-    title: string;
-    value: string;
-}
-
-export interface IPropertiesListItemDivider {
-    divider: boolean;
-}
-
-export type PropertiesListItem = IPropertiesListItemValue | IPropertiesListItemDivider;
-
-interface IPropertiesListProps {
-    items: PropertiesListItem[];
-}
-
-function PropertiesList({items}: IPropertiesListProps): JSX.Element {
-    return (
-        <Descriptions layout="horizontal" column={1}>
-            {items.map((item, index) => {
-                const {title, value} = item as IPropertiesListItemValue;
-
-                return (
-                    <Descriptions.Item
-                        key={index}
-                        label={title}
-                        style={{paddingBottom: '5px'}}
-                        labelStyle={{fontWeight: 'bold', width: '50%'}}
-                    >
-                        {(item as IPropertiesListItemDivider).divider ? (
-                            <Divider key={index} data-testid="divider" />
-                        ) : (
-                            value
-                        )}
-                    </Descriptions.Item>
-                );
-            })}
-        </Descriptions>
-    );
-}
-
-export default PropertiesList;

package/src/components/RecordEdition/EditRecordSidebar/PropertiesList/index.ts

@@ -1,5 +0,0 @@
-// Copyright LEAV Solutions 2017
-// This file is released under LGPL V3
-// License text available at https://www.gnu.org/licenses/lgpl-3.0.txt
-import PropertiesList from './PropertiesList';
-export default PropertiesList;

package/src/components/RecordEdition/EditRecordSidebar/RecordSummary/RecordSummary.test.tsx

@@ -1,50 +0,0 @@
-// Copyright LEAV Solutions 2017
-// This file is released under LGPL V3
-// License text available at https://www.gnu.org/licenses/lgpl-3.0.txt
-import {getRecordColumnsValues} from '_ui/_queries/records/getRecordColumnsValues';
-import {render, screen} from '_ui/_tests/testUtils';
-import {mockRecord} from '_ui/__mocks__/common/record';
-import RecordSummary from './RecordSummary';
-
-describe('RecordSummary', () => {
-    test('Display summary', async () => {
-        const mocks = [
-            {
-                request: {
-                    query: getRecordColumnsValues(['created_at', 'created_by', 'modified_at', 'modified_by']),
-                    variables: {
-                        library: 'record_lib',
-                        filters: [{field: 'id', condition: 'EQUAL', value: '123456'}]
-                    }
-                },
-                result: {
-                    data: {
-                        records: {
-                            list: [
-                                {
-                                    _id: 123456,
-                                    created_at: '2020-01-01',
-                                    created_by: {
-                                        id: '1',
-                                        label: 'admin'
-                                    },
-                                    modified_at: '2020-01-01',
-                                    modified_by: {
-                                        id: '1',
-                                        label: 'admin'
-                                    }
-                                }
-                            ]
-                        }
-                    }
-                }
-            }
-        ];
-
-        render(<RecordSummary record={mockRecord} />, {mocks});
-
-        expect(await screen.findByAltText('record preview')).toBeInTheDocument();
-        expect(screen.getByText(mockRecord.id)).toBeInTheDocument();
-        expect(screen.getByText(mockRecord.label)).toBeInTheDocument();
-    });
-});

package/src/components/RecordEdition/EditRecordSidebar/RecordSummary/RecordSummary.tsx

@@ -1,107 +0,0 @@
-// Copyright LEAV Solutions 2017
-// This file is released under LGPL V3
-// License text available at https://www.gnu.org/licenses/lgpl-3.0.txt
-import {localizedTranslation} from '@leav/utils';
-import {Space, theme} from 'antd';
-import styled from 'styled-components';
-import {useSharedTranslation} from '_ui/hooks/useSharedTranslation';
-import {PreviewSize} from '../../../../constants';
-import {useLang} from '../../../../hooks';
-import {useGetRecordValuesQuery} from '../../../../hooks/useGetRecordValuesQuery/useGetRecordValuesQuery';
-import {IRecordIdentityWhoAmI} from '../../../../types/records';
-import {IRecordColumnValueLink, IRecordColumnValueStandard} from '../../../../_queries/records/getRecordColumnsValues';
-import {ErrorDisplay} from '../../../ErrorDisplay';
-import {Loading} from '../../../Loading';
-import {RecordPreviewWithModal} from '../../../RecordPreviewWithModal';
-import PropertiesList from '../PropertiesList';
-
-interface IRecordSummaryProps {
-    record: IRecordIdentityWhoAmI;
-}
-
-export const Wrapper = styled(Space)`
-    padding: 1em;
-    display: flex;
-`;
-
-function RecordSummary({record}: IRecordSummaryProps): JSX.Element {
-    const preview = String(record?.preview?.medium);
-    const previewFile = record?.preview?.file;
-    const {token} = theme.useToken();
-
-    const {t} = useSharedTranslation();
-    const {lang} = useLang();
-
-    const {loading, error, data} = useGetRecordValuesQuery(
-        record?.library?.id,
-        ['created_at', 'created_by', 'modified_at', 'modified_by'],
-        [record?.id]
-    );
-
-    if (loading) {
-        return <Loading />;
-    }
-
-    if (error) {
-        return <ErrorDisplay message={error.message} />;
-    }
-
-    const recordData = data?.[record?.id];
-
-    const summaryContent = [
-        {
-            title: t('record_summary.label'),
-            value: record?.label
-        },
-        {
-            title: t('record_summary.id'),
-            value: record?.id
-        },
-        {
-            title: t('record_summary.library'),
-            value: localizedTranslation(record?.library.label, lang)
-        }
-    ];
-
-    if (recordData) {
-        if (recordData.created_at?.[0]) {
-            summaryContent.push({
-                title: t('record_summary.created_at'),
-                value: t('record_summary.created_at_value', {
-                    date: (recordData?.created_at?.[0] as IRecordColumnValueStandard).value,
-                    user: (recordData?.created_by?.[0] as IRecordColumnValueLink)?.linkValue?.whoAmI?.label,
-                    interpolation: {escapeValue: false}
-                })
-            });
-        }
-
-        if (recordData.modified_at?.[0]) {
-            summaryContent.push({
-                title: t('record_summary.modified_at'),
-                value: t('record_summary.modified_at_value', {
-                    date: (recordData?.modified_at?.[0] as IRecordColumnValueStandard).value,
-                    user: (recordData?.modified_by?.[0] as IRecordColumnValueLink)?.linkValue?.whoAmI?.label,
-                    interpolation: {escapeValue: false}
-                })
-            });
-        }
-    }
-
-    return (
-        <Wrapper direction="vertical">
-            <RecordPreviewWithModal
-                label={record?.label ?? record?.id}
-                color={record?.color}
-                image={preview ?? null}
-                tile
-                size={PreviewSize.medium}
-                style={{borderRadius: token.borderRadius}}
-                previewFile={previewFile}
-                imageStyle={{borderRadius: token.borderRadius}}
-            />
-            <PropertiesList items={summaryContent} />
-        </Wrapper>
-    );
-}
-
-export default RecordSummary;

package/src/components/RecordEdition/EditRecordSidebar/RecordSummary/index.ts

@@ -1,5 +0,0 @@
-// Copyright LEAV Solutions 2017
-// This file is released under LGPL V3
-// License text available at https://www.gnu.org/licenses/lgpl-3.0.txt
-import RecordSummary from './RecordSummary';
-export default RecordSummary;

package/src/components/RecordEdition/EditRecordSidebar/ValueDetails/AttributeDetails/AttributeDetails.tsx

@@ -1,75 +0,0 @@
-// Copyright LEAV Solutions 2017
-// This file is released under LGPL V3
-// License text available at https://www.gnu.org/licenses/lgpl-3.0.txt
-import {isTypeStandard} from '@leav/utils';
-import {Collapse, theme} from 'antd';
-import {GlobalToken} from 'antd/lib/theme/interface';
-import styled from 'styled-components';
-import {useSharedTranslation} from '_ui/hooks/useSharedTranslation';
-import {themeVars} from '../../../../../antdTheme';
-import {RecordFormAttributeFragment} from '../../../../../_gqlTypes';
-import PropertiesList from '../../PropertiesList';
-
-const AttributeDetailsCollapse = styled(Collapse)<{$themeToken: GlobalToken}>`
-    &&& {
-        margin: 1rem;
-        background: none;
-
-        .ant-collapse-header {
-            justify-content: flex-end;
-        }
-
-        .ant-collapse-content {
-            background: ${themeVars.defaultBg};
-            border: 1px solid ${themeVars.borderColor};
-            border-radius: ${p => p.$themeToken.borderRadius}px;
-        }
-    }
-`;
-
-interface IAttributeDetailsProps {
-    attribute: RecordFormAttributeFragment;
-}
-
-function AttributeDetails({attribute}: IAttributeDetailsProps): JSX.Element {
-    const {t} = useSharedTranslation();
-    const {token} = theme.useToken();
-
-    const attributeDetailsContent = [
-        {
-            title: t('record_edition.attribute.id'),
-            value: attribute.id
-        },
-        {
-            title: t('record_edition.attribute.type'),
-            value: t(`record_edition.attribute.type_${attribute.type}`)
-        }
-    ];
-
-    if (isTypeStandard(attribute.type)) {
-        attributeDetailsContent.push({
-            title: t('record_edition.attribute.format'),
-            value: attribute.format ? t(`record_edition.attribute.format_${attribute.format}`) : null
-        });
-    }
-
-    const collapseItems = [
-        {
-            key: 'attribute',
-            label: t('record_edition.attribute_details_section'),
-            children: <PropertiesList items={attributeDetailsContent} />
-        }
-    ];
-
-    return (
-        <AttributeDetailsCollapse
-            items={collapseItems}
-            destroyInactivePanel
-            bordered={false}
-            ghost
-            $themeToken={token}
-        />
-    );
-}
-
-export default AttributeDetails;

package/src/components/RecordEdition/EditRecordSidebar/ValueDetails/AttributeDetails/index.ts

@@ -1,5 +0,0 @@
-// Copyright LEAV Solutions 2017
-// This file is released under LGPL V3
-// License text available at https://www.gnu.org/licenses/lgpl-3.0.txt
-import AttributeDetails from './AttributeDetails';
-export default AttributeDetails;

package/src/components/RecordEdition/EditRecordSidebar/ValueDetails/TreeValuePath/TreeValuePath.tsx

@@ -1,56 +0,0 @@
-// Copyright LEAV Solutions 2017
-// This file is released under LGPL V3
-// License text available at https://www.gnu.org/licenses/lgpl-3.0.txt
-import {localizedTranslation} from '@leav/utils';
-import {Tree} from 'antd';
-import {DataNode} from 'antd/lib/tree';
-import styled from 'styled-components';
-import {themeVars} from '../../../../../antdTheme';
-import useLang from '../../../../../hooks/useLang';
-import {RecordFormAttributeTreeAttributeFragment} from '../../../../../_gqlTypes';
-import {IRecordPropertyTree} from '../../../../../_queries/records/getRecordPropertiesQuery';
-
-interface ITreeValuePathProps {
-    attribute: RecordFormAttributeTreeAttributeFragment;
-    value: IRecordPropertyTree;
-}
-
-const MyTree = styled(Tree)`
-    && {
-        border: 1px solid ${themeVars.borderColor};
-    }
-`;
-
-function TreeValuePath({value, attribute}: ITreeValuePathProps): JSX.Element {
-    const {lang} = useLang();
-    const ancestorsPath = value.treeValue.ancestors ?? [];
-
-    const nodesProps: Partial<DataNode> = {
-        checkable: false,
-        selectable: false
-    };
-
-    const pathToValue = [...ancestorsPath].reverse().reduce((children: DataNode[], node): DataNode[] => {
-        return [
-            {
-                ...nodesProps,
-                title: node.record.whoAmI.label,
-                key: node.record.id,
-                children: children ?? []
-            }
-        ];
-    }, []);
-
-    const treeData = [
-        {
-            ...nodesProps,
-            title: localizedTranslation(attribute.linked_tree.label, lang),
-            key: attribute.linked_tree.id,
-            children: pathToValue
-        }
-    ];
-
-    return <MyTree key={value.id_value} showIcon={false} treeData={treeData} defaultExpandAll />;
-}
-
-export default TreeValuePath;

package/src/components/RecordEdition/EditRecordSidebar/ValueDetails/TreeValuePath/index.ts

@@ -1,5 +0,0 @@
-// Copyright LEAV Solutions 2017
-// This file is released under LGPL V3
-// License text available at https://www.gnu.org/licenses/lgpl-3.0.txt
-import TreeValuePath from './TreeValuePath';
-export default TreeValuePath;