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

package/src/components/ImportModal/ImportModalSelectFileStep/ImportModalSelectFileStep.tsx

@@ -1,212 +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 {extractArgsFromString} from '@leav/utils';
-import {message, Space, Spin} from 'antd';
-import {KitAlert, KitUpload} from 'aristid-ds';
-import {IKitDragger} from 'aristid-ds/dist/Kit/DataEntry/Upload/types';
-import {useState} from 'react';
-import {read as xlsxRead, utils as xlsxUtils} from 'xlsx';
-import {useSharedTranslation} from '_ui/hooks/useSharedTranslation';
-import {
-    AttributesByLibAttributeFragment,
-    AttributesByLibAttributeLinkAttributeFragment,
-    AttributeType,
-    ImportMode,
-    ImportType
-} from '_ui/_gqlTypes';
-import {ImportReducerActionTypes} from '../importReducer/importReducer';
-import {useImportReducerContext} from '../importReducer/ImportReducerContext';
-import {ISheet} from '../_types';
-
-interface IImportModalSelectFileStepsProps {
-    onGetAttributes: (library: string) => Promise<AttributesByLibAttributeFragment[]>;
-}
-
-const defaultType = ImportType.STANDARD;
-const defaultMode = ImportMode.upsert;
-
-function ImportModalSelectFileStep({onGetAttributes}: IImportModalSelectFileStepsProps): JSX.Element {
-    const {t} = useSharedTranslation();
-
-    const {state, dispatch} = useImportReducerContext();
-    const {file} = state;
-
-    const _setFileData = async content => {
-        const workbook = xlsxRead(content, {type: 'binary'});
-
-        const s: ISheet[] = [];
-
-        for (const sheetName in workbook.Sheets) {
-            if (workbook.Sheets.hasOwnProperty(sheetName)) {
-                // Use the sheet_to_json method to convert excel to json data
-                const sheetData: Array<{[col: string]: string}> = xlsxUtils.sheet_to_json(workbook.Sheets[sheetName], {
-                    blankrows: false,
-                    defval: null
-                });
-
-                // if sheet is empty we skip it
-                if (!sheetData.length) {
-                    continue;
-                }
-
-                // get columns' name
-                const sheetColumns = Object.keys(sheetData[0]);
-
-                // match only first line cells (A1, B1, etc.)
-                const firstRowAddresses = Object.keys(workbook.Sheets[sheetName]).filter(
-                    k => !!k.match(/\b[A-Z]+1\b/g)
-                );
-                const isMapped = !!workbook.Sheets[sheetName][firstRowAddresses[0]].c;
-
-                // Mapping is present.
-                if (isMapped) {
-                    const comments: string[] = [];
-
-                    for (const address of firstRowAddresses) {
-                        // get first line comments and delete "\n" characters
-                        comments.push(workbook.Sheets[sheetName][address].c?.[0]?.t?.replace(/\n/g, ' ') || null);
-                    }
-
-                    const params = extractArgsFromString(comments[0]);
-
-                    const sType = params.type ?? defaultType;
-                    const sLibrary = params.library;
-                    const sLinkAttribute = params.linkAttribute;
-                    const sMode = params.mode ?? defaultMode;
-                    let sMapping = [];
-                    const sTreeLinkLibrary = params.treeLinkLibrary;
-                    let sKeyColumnIndex: number;
-                    let sKeyToColumnIndex: number;
-
-                    let sKeyToAttributes: AttributesByLibAttributeFragment[] = [];
-
-                    const attributes = await onGetAttributes(sLibrary);
-
-                    // Extract mapping, keyIndex and keyToIndex from all columns comments
-                    for (const [index, comm] of comments.entries()) {
-                        const commArgs = extractArgsFromString(comm);
-                        sMapping.push(String(commArgs.id) ?? null);
-
-                        if (commArgs.key) {
-                            sKeyColumnIndex = index;
-                        }
-
-                        if (commArgs.keyTo) {
-                            sKeyToColumnIndex = index;
-                        }
-                    }
-
-                    const linkAttributeProps =
-                        sKeyToColumnIndex && sLinkAttribute
-                            ? (attributes.find(
-                                  a => a.id === sLinkAttribute
-                              ) as AttributesByLibAttributeLinkAttributeFragment)
-                            : null;
-
-                    if (linkAttributeProps && (linkAttributeProps.type !== AttributeType.tree || sTreeLinkLibrary)) {
-                        const keyToLibrary =
-                            linkAttributeProps.type === AttributeType.tree
-                                ? sTreeLinkLibrary
-                                : linkAttributeProps?.linked_library?.id;
-                        sKeyToAttributes = await onGetAttributes(keyToLibrary);
-                    }
-
-                    // Check if all mapping attributes actually exist
-                    sMapping = sMapping.map((mappingAttribute, index) => {
-                        const attributesToCheck = index === sKeyToColumnIndex ? sKeyToAttributes : attributes;
-                        return attributesToCheck.find(attribute => attribute.id === mappingAttribute)
-                            ? mappingAttribute
-                            : null;
-                    });
-
-                    s.push({
-                        name: sheetName,
-                        attributes,
-                        columns: sheetColumns,
-                        type: ImportType[sType],
-                        mode: ImportMode[sMode],
-                        library: sLibrary,
-                        linkAttribute: sLinkAttribute,
-                        linkAttributeProps,
-                        keyColumnIndex: sKeyColumnIndex,
-                        keyToColumnIndex: sKeyToColumnIndex,
-                        keyToAttributes: sKeyToAttributes,
-                        treeLinkLibrary: sTreeLinkLibrary,
-                        data: sheetData.length ? sheetData : null,
-                        mapping: sMapping
-                    });
-                } else {
-                    const sLibrary = state.defaultLibrary;
-                    const attributes = await onGetAttributes(sLibrary);
-
-                    s.push({
-                        name: sheetName,
-                        library: sLibrary,
-                        columns: sheetColumns,
-                        type: defaultType,
-                        mode: defaultMode,
-                        attributes,
-                        mapping: [],
-                        data: sheetData.length ? sheetData : null
-                    });
-                }
-            }
-        }
-
-        if (!s.length || s.every(sheet => sheet.data === null)) {
-            message.error(t('import.empty_file'));
-            return false;
-        }
-
-        dispatch({type: ImportReducerActionTypes.SET_SHEETS, sheets: s});
-
-        return true;
-    };
-
-    const [loading, setLoading] = useState(false);
-
-    const draggerProps: IKitDragger = {
-        name: 'file',
-        multiple: false,
-        accept: '.xlsx',
-        showUploadList: false,
-        description: t('import.file_selection_restriction', {allowedFormat: '.xlsx'}),
-        title: file?.name ?? t('import.file_selection_instruction'),
-        beforeUpload: fileToImport => {
-            // Read file to read mapping and display a preview on next step
-            const reader = new FileReader();
-            reader.readAsBinaryString(fileToImport);
-
-            reader.onload = async e => {
-                const res = await _setFileData(reader.result);
-                if (res) {
-                    dispatch({type: ImportReducerActionTypes.SET_FILE, file: fileToImport});
-                }
-                dispatch({type: ImportReducerActionTypes.SET_OK_BTN, okBtn: res});
-            };
-
-            reader.onloadstart = e => {
-                setLoading(true);
-            };
-
-            reader.onloadend = e => {
-                setLoading(false);
-            };
-
-            // Prevent default upload. We'll handle it ourselves later on
-            return false;
-        }
-    };
-
-    return (
-        <Space direction="vertical" style={{width: '100%'}}>
-            <Spin spinning={loading}>
-                <KitUpload.KitDragger {...draggerProps} />
-            </Spin>
-            <KitAlert message={t('import.first_line_info')} type="info" showIcon />
-        </Space>
-    );
-}
-
-export default ImportModalSelectFileStep;

package/src/components/ImportModal/ImportModalSelectFileStep/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 ImportModalSelectFileStep from './ImportModalSelectFileStep';
-export default ImportModalSelectFileStep;

package/src/components/ImportModal/_types.ts

@@ -1,44 +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 {
-    AttributesByLibAttributeFragment,
-    AttributesByLibAttributeLinkAttributeFragment,
-    AttributesByLibAttributeTreeAttributeFragment,
-    ImportMode,
-    ImportType
-} from '_ui/_gqlTypes';
-
-export interface ISheet {
-    name: string;
-    columns: string[];
-    data: Array<{[col: string]: string}>;
-    attributes: AttributesByLibAttributeFragment[];
-    mapping: Array<string | null>;
-    type?: ImportType;
-    mode?: ImportMode;
-    library?: string;
-    linkAttribute?: string;
-    linkAttributeProps?: AttributesByLibAttributeLinkAttributeFragment | AttributesByLibAttributeTreeAttributeFragment;
-    keyColumnIndex?: number;
-    keyToAttributes?: AttributesByLibAttributeFragment[];
-    keyToColumnIndex?: number;
-    treeLinkLibrary?: string;
-}
-
-export enum ImportSteps {
-    SELECT_FILE = 0,
-    CONFIG = 1,
-    PROCESSING = 2,
-    DONE = 3
-}
-
-export enum SheetSettingsError {
-    TYPE = 'TYPE',
-    MODE = 'MODE',
-    LIBRARY = 'LIBRARY',
-    MAPPING = 'MAPPING',
-    LINK_ATTRIBUTE = 'LINK_ATTRIBUTE',
-    KEY_TO = 'KEY_TO',
-    KEY = 'KEY'
-}

package/src/components/ImportModal/importReducer/ImportReducerContext.ts

@@ -1,17 +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, useContext} from 'react';
-import {IImportReducerState, ImportReducerAction, initialState} from './importReducer';
-
-const ImportReducerContext = createContext<{
-    state: IImportReducerState;
-    dispatch: React.Dispatch<ImportReducerAction>;
-}>({
-    state: initialState,
-    dispatch: () => initialState
-});
-
-export default ImportReducerContext;
-
-export const useImportReducerContext = () => useContext(ImportReducerContext);

package/src/components/ImportModal/importReducer/importReducer.test.ts

@@ -1,125 +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 {ImportMode, ImportType} from '_ui/_gqlTypes';
-import {mockSheet} from '_ui/__mocks__/common/import';
-import {ImportSteps, SheetSettingsError} from '../_types';
-import importReducer, {ImportReducerActionTypes, initialState} from './importReducer';
-
-describe('importReducer', () => {
-    describe('SET_SHEETS', () => {
-        test('Set sheets data', async () => {
-            const newState = importReducer(initialState, {
-                type: ImportReducerActionTypes.SET_SHEETS,
-                sheets: [mockSheet]
-            });
-            expect(newState).toEqual({...initialState, okBtn: true, sheets: [mockSheet]});
-        });
-
-        test('Check errors on sheets data', async () => {
-            const mockSheetNoType = {
-                ...mockSheet,
-                type: null
-            };
-
-            const newStateNoType = importReducer(initialState, {
-                type: ImportReducerActionTypes.SET_SHEETS,
-                sheets: [mockSheetNoType]
-            });
-
-            expect(newStateNoType.okBtn).toBe(false);
-            expect(newStateNoType.settingsError[mockSheet.name]).toEqual(
-                expect.arrayContaining([SheetSettingsError.TYPE])
-            );
-
-            const mockSheetWithErrors = {
-                ...mockSheet,
-                type: ImportType.STANDARD,
-                mode: ImportMode.update,
-                mapping: null,
-                keyColumnIndex: null,
-                library: null
-            };
-
-            const newStateStandardSheet = importReducer(initialState, {
-                type: ImportReducerActionTypes.SET_SHEETS,
-                sheets: [mockSheetWithErrors]
-            });
-
-            expect(newStateStandardSheet.okBtn).toBe(false);
-            expect(newStateStandardSheet.settingsError[mockSheet.name]).toEqual(
-                expect.arrayContaining([SheetSettingsError.MAPPING, SheetSettingsError.LIBRARY, SheetSettingsError.KEY])
-            );
-
-            const mockLinkSheetWithErrors = {
-                ...mockSheet,
-                type: ImportType.LINK,
-                mode: null,
-                mapping: null,
-                keyColumnIndex: null,
-                keyToColumnIndex: null,
-                library: null
-            };
-            const newStateLinkSheet = importReducer(initialState, {
-                type: ImportReducerActionTypes.SET_SHEETS,
-                sheets: [mockLinkSheetWithErrors]
-            });
-
-            expect(newStateLinkSheet.okBtn).toBe(false);
-            expect(newStateLinkSheet.settingsError[mockSheet.name]).toEqual(
-                expect.arrayContaining([
-                    SheetSettingsError.MODE,
-                    SheetSettingsError.KEY_TO,
-                    SheetSettingsError.LIBRARY,
-                    SheetSettingsError.LINK_ATTRIBUTE
-                ])
-            );
-        });
-
-        test('Ignore errors on ignore sheets', async () => {
-            const mockSheetIgnored = {
-                ...mockSheet,
-                type: ImportType.IGNORE,
-                library: null
-            };
-
-            const newStateIgnored = importReducer(initialState, {
-                type: ImportReducerActionTypes.SET_SHEETS,
-                sheets: [mockSheetIgnored]
-            });
-
-            expect(newStateIgnored.okBtn).toBe(true);
-            expect(newStateIgnored.settingsError[mockSheetIgnored.name]).toBeUndefined();
-        });
-    });
-
-    test('SET_FILE', async () => {
-        const mockFile = new File([], 'test.xlsx');
-        const newState = importReducer(initialState, {type: ImportReducerActionTypes.SET_FILE, file: mockFile});
-        expect(newState).toEqual({...initialState, file: mockFile});
-    });
-
-    test('SET_CURRENT_STEP', async () => {
-        const newState = importReducer(
-            {...initialState, sheets: [mockSheet]},
-            {
-                type: ImportReducerActionTypes.SET_CURRENT_STEP,
-                currentStep: ImportSteps.CONFIG
-            }
-        );
-        expect(newState.currentStep).toBe(ImportSteps.CONFIG);
-    });
-
-    test('SET_OK_BTN', async () => {
-        const newState = importReducer(initialState, {type: ImportReducerActionTypes.SET_OK_BTN, okBtn: true});
-        expect(newState).toEqual({...initialState, okBtn: true});
-    });
-
-    test('SET_IMPORT_ERROR', async () => {
-        const newState = importReducer(initialState, {
-            type: ImportReducerActionTypes.SET_IMPORT_ERROR,
-            importError: 'test'
-        });
-        expect(newState).toEqual({...initialState, importError: 'test'});
-    });
-});

package/src/components/ImportModal/importReducer/importReducer.ts

@@ -1,171 +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 {ImportMode, ImportType} from '_ui/_gqlTypes';
-import {ImportSteps, ISheet, SheetSettingsError} from '../_types';
-
-export interface IImportReducerState {
-    defaultLibrary: string;
-    sheets: ISheet[];
-    file: File | null;
-    currentStep: ImportSteps;
-    okBtn: boolean;
-    importError?: string;
-    settingsError: {[sheetName: string]: SheetSettingsError[]};
-}
-
-export enum ImportReducerActionTypes {
-    SET_SHEETS = 'SET_SHEETS',
-    SET_FILE = 'SET_FILE',
-    SET_CURRENT_STEP = 'SET_CURRENT_STEP',
-    SET_OK_BTN = 'SET_OK_BTN',
-    SET_IMPORT_ERROR = 'SET_IMPORT_ERROR'
-}
-
-export const initialState: IImportReducerState = {
-    defaultLibrary: null,
-    sheets: [],
-    file: null,
-    currentStep: ImportSteps.SELECT_FILE,
-    okBtn: false,
-    importError: null,
-    settingsError: {}
-};
-
-export type ImportReducerAction =
-    | {
-          type: ImportReducerActionTypes.SET_SHEETS;
-          sheets: ISheet[];
-      }
-    | {
-          type: ImportReducerActionTypes.SET_FILE;
-          file: File | null;
-      }
-    | {
-          type: ImportReducerActionTypes.SET_CURRENT_STEP;
-          currentStep: ImportSteps;
-      }
-    | {
-          type: ImportReducerActionTypes.SET_OK_BTN;
-          okBtn: boolean;
-      }
-    | {
-          type: ImportReducerActionTypes.SET_IMPORT_ERROR;
-          importError: string;
-      };
-
-const _getSheetErrors = (sheet: ISheet): SheetSettingsError[] => {
-    if (sheet.type === ImportType.IGNORE) {
-        return [];
-    }
-
-    const checks: Array<{error: SheetSettingsError; condition: boolean}> = [
-        {
-            error: SheetSettingsError.TYPE,
-            condition: !sheet.type
-        },
-        {
-            error: SheetSettingsError.MODE,
-            condition: !sheet.mode
-        },
-        {
-            error: SheetSettingsError.LIBRARY,
-            condition: !sheet.library
-        },
-        {
-            error: SheetSettingsError.MAPPING,
-            condition: sheet.type && !(sheet?.mapping ?? []).filter(mappingCol => !!mappingCol).length
-        },
-        {
-            error: SheetSettingsError.LINK_ATTRIBUTE,
-            condition: sheet.type === ImportType.LINK && !sheet.linkAttribute
-        },
-        {
-            error: SheetSettingsError.KEY,
-            condition:
-                (sheet.mode === ImportMode.update || sheet.type === ImportType.LINK) &&
-                (typeof sheet.keyColumnIndex === 'undefined' ||
-                    sheet.keyColumnIndex === null ||
-                    !sheet.mapping[sheet.keyColumnIndex])
-        },
-        {
-            error: SheetSettingsError.KEY_TO,
-            condition:
-                sheet.type === ImportType.LINK &&
-                (typeof sheet.keyToColumnIndex === 'undefined' ||
-                    sheet.keyToColumnIndex === null ||
-                    !sheet.mapping[sheet.keyToColumnIndex])
-        }
-    ];
-
-    return checks.reduce((errors: SheetSettingsError[], check): SheetSettingsError[] => {
-        if (check.condition) {
-            errors.push(check.error);
-        }
-        return errors;
-    }, []);
-};
-
-const _getSettingsErrors = (sheets: ISheet[]) => {
-    return sheets.reduce((acc, s) => {
-        const sheetErrors = _getSheetErrors(s);
-        if (sheetErrors.length) {
-            acc[s.name] = sheetErrors;
-        }
-
-        return acc;
-    }, {});
-};
-
-const importReducer = (state: IImportReducerState, action: ImportReducerAction): IImportReducerState => {
-    switch (action.type) {
-        case ImportReducerActionTypes.SET_SHEETS: {
-            const settingsError = _getSettingsErrors(action.sheets);
-
-            return {
-                ...state,
-                sheets: action.sheets,
-                settingsError,
-                okBtn: !Object.keys(settingsError).length
-            };
-        }
-        case ImportReducerActionTypes.SET_FILE: {
-            return {
-                ...state,
-                file: action.file
-            };
-        }
-        case ImportReducerActionTypes.SET_CURRENT_STEP: {
-            let stateChanges: Partial<IImportReducerState> = {
-                currentStep: action.currentStep
-            };
-
-            if (action.currentStep === ImportSteps.CONFIG) {
-                const settingsError = _getSettingsErrors(state.sheets);
-
-                stateChanges = {...stateChanges, settingsError, okBtn: !Object.keys(settingsError).length};
-            }
-
-            return {
-                ...state,
-                ...stateChanges
-            };
-        }
-        case ImportReducerActionTypes.SET_OK_BTN: {
-            return {
-                ...state,
-                okBtn: action.okBtn
-            };
-        }
-        case ImportReducerActionTypes.SET_IMPORT_ERROR: {
-            return {
-                ...state,
-                importError: action.importError
-            };
-        }
-        default:
-            return state;
-    }
-};
-
-export default importReducer;

package/src/components/ImportModal/importReducer/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 importReducer from './importReducer';
-export default importReducer;

package/src/components/ImportModal/index.ts

@@ -1,4 +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
-export {default as ImportModal} from './ImportModal';