@configuratorware/configurator-admingui 1.41.2 → 1.42.2

package/src/Components/DefaultConnectedList.js

@@ -1,146 +0,0 @@
-import { connect } from 'react-redux';
-import _ from 'lodash';
-
-import { setConfig } from '../App/Reducers/Config/Actions';
-
-const ACTION_KEY = 'listing';
-
-import { generateDefaultList } from './DefaultList';
-import { getObjectPropertyAsString } from '../App/Utils';
-
-export const generateMappings = (
-    listKey,
-    listAction,
-    loadDetailsAction,
-    hideDetailsAction,
-    showDetailsAction,
-    addEntityAction,
-    deleteEntitiesAction,
-    ctx = {}
-) => ({
-    mapStateToProps: state => {
-        const { dataBySource, entity, i18n, config } = state;
-        const reducerName = ctx.reducerName || entity.unsavedEntity.reducerName;
-        const entityState = state[reducerName];
-        const listState = dataBySource[listKey];
-        let selected = false;
-        let clearSelection = false;
-        let setSelection = false;
-        const idKey = ctx.idKey || 'id';
-        const listIdKey = ctx.listIdKey || idKey;
-        const entityIdKey = ctx.entityIdKey || idKey;
-        const getId = ctx.getId || getObjectPropertyAsString;
-        if (entityState && listState) {
-            // entity reducer exists and list state is available
-            if (listState.isDeleted) {
-                clearSelection = true;
-            } else if (entityState.isNew) {
-                // or mounted as a new entity, which is cannot be in the list
-                selected = []; // the list must be shown as clean, but do not clear it in real
-            } else if (listState.data) {
-                if (entityState.hideDetails) {
-                    clearSelection = true;
-                } else if (entityState.isModified) {
-                    // hold on the modified element
-                    selected = _.findIndex(
-                        listState.data.data,
-                        d => getId(d, listIdKey) === getId(entityState.data, entityIdKey)
-                    );
-                } else if (entityState.isMounting) {
-                    // set the mounted element
-                    selected = _.findIndex(
-                        listState.data.data,
-                        d => getId(d, listIdKey) === getId(entityState.source, entityIdKey)
-                    );
-                } else if (entityState.isReady) {
-                    selected = _.findIndex(
-                        listState.data.data,
-                        d => getId(d, listIdKey) === getId(entityState.data, entityIdKey)
-                    );
-                }
-            }
-            if (_.isNumber(selected)) {
-                selected = selected !== -1 ? [selected] : [];
-            }
-        }
-
-        const { data, error, didInvalidate } = listState || {};
-
-        return {
-            list: data,
-            error: error,
-            didInvalidate: didInvalidate,
-            selected,
-            clearSelection,
-            setSelection,
-            locale: i18n.locale,
-            config: config[listKey] || {},
-            actionConfig: config[ACTION_KEY] || {},
-        };
-    },
-
-    mapDispatchToProps: (dispatch, props) => {
-        return {
-            loadDetails: data => dispatch(loadDetailsAction(data)),
-            hideDetails: (reportUnsaved = true, silent = false) =>
-                dispatch(hideDetailsAction(reportUnsaved, silent)),
-            onAddItem: addEntityAction && (() => dispatch(addEntityAction())),
-            onDeleteItems: deleteEntitiesAction && (ids => dispatch(deleteEntitiesAction(ids))),
-            loadList: params => dispatch(listAction(params)),
-            setConfig: confObj => dispatch(setConfig(listKey, confObj)),
-            setActionConfig: confObj => dispatch(setConfig(ACTION_KEY, confObj)),
-            ...props,
-        };
-    },
-});
-
-export const connectDefault = (
-    ComponentToConnect,
-    listKey,
-    listAction,
-    loadDetailsAction,
-    hideDetailsAction,
-    showDetailsAction,
-    addEntityAction,
-    deleteEntitiesAction,
-    ctx = {}
-) => {
-    const { mapStateToProps, mapDispatchToProps } = generateMappings(
-        listKey,
-        listAction,
-        loadDetailsAction,
-        hideDetailsAction,
-        showDetailsAction,
-        addEntityAction,
-        deleteEntitiesAction,
-        ctx
-    );
-
-    return connect(mapStateToProps, mapDispatchToProps)(ComponentToConnect);
-};
-
-export const generateConnectedList = (
-    columns,
-    listParams,
-    listKey,
-    listAction,
-    loadDetailsAction,
-    hideDetailsAction,
-    showDetailsAction,
-    addEntityAction,
-    deleteEntitiesAction,
-    ctx = {}
-) =>
-    connectDefault(
-        generateDefaultList(columns, listParams),
-        listKey,
-        listAction,
-        loadDetailsAction,
-        hideDetailsAction,
-        showDetailsAction,
-        addEntityAction,
-        deleteEntitiesAction,
-        ctx
-    );
-
-export default generateConnectedList;

package/src/Components/DefaultConnectedScreen.js

@@ -1,66 +0,0 @@
-import { connect } from 'react-redux';
-import { generateDefaultScreen } from './DefaultScreen';
-
-export const generateMappings = (
-    reducerName,
-    invalidateListAction,
-    unsavedEntityAction,
-    hideDetailsAction
-) => {
-    return {
-        mapStateToProps: state => {
-            const entityState = state[reducerName];
-            if (!entityState) {
-                throw new Error('Reducer does not exist: ' + reducerName);
-            }
-            return {
-                showDetails: entityState.showDetails,
-                locale: state.i18n.locale,
-            };
-        },
-
-        mapDispatchToProps: dispatch => {
-            return {
-                invalidateListAction: () => dispatch(invalidateListAction()),
-                unsavedEntityAction: () => dispatch(unsavedEntityAction()),
-                hideDetailsAction: () => dispatch(hideDetailsAction()),
-            };
-        },
-    };
-};
-
-export const connectDefault = (
-    ComponentToConnect,
-    reducerName,
-    invalidateListAction,
-    unsavedEntityAction,
-    hideDetailsAction
-) => {
-    const { mapStateToProps, mapDispatchToProps } = generateMappings(
-        reducerName,
-        invalidateListAction,
-        unsavedEntityAction,
-        hideDetailsAction
-    );
-
-    return connect(mapStateToProps, mapDispatchToProps)(ComponentToConnect);
-};
-
-export const generateConnectedSplitScreen = (
-    title,
-    ListComponent,
-    EditComponent,
-    reducerName,
-    invalidateListAction,
-    unsavedEntityAction,
-    hideDetailsAction,
-    hintText = null
-) => {
-    return connectDefault(
-        generateDefaultScreen(title, ListComponent, EditComponent, hintText),
-        reducerName,
-        invalidateListAction,
-        unsavedEntityAction,
-        hideDetailsAction
-    );
-};

package/src/Components/DefaultForm.js

@@ -1,40 +0,0 @@
-import React, { Component } from 'react';
-import Form from '../Components/Form';
-import { T } from '../App/i18n';
-
-export default class DefaultForm extends Component {
-    render() {
-        const {
-            formFields,
-            entityState,
-            setData,
-            postData,
-            onCancel,
-            onAction,
-            config,
-            closeAfterSave,
-            customPostData
-        } = this.props;
-        const { actionButtons } = config;
-
-        const onSubmit = customPostData ? customPostData : !closeAfterSave ? postData : () => postData(true);
-
-        return entityState.isReady ? (
-            <Form
-                formFields={formFields}
-                data={entityState.data}
-                onChange={setData}
-                onSubmit={onSubmit}
-                onCancel={onCancel}
-                onAction={onAction}
-                actionButtons={actionButtons}
-            />
-        ) : (
-            <div>{T('Loading entity data')}...</div>
-        );
-    }
-}
-
-export const generateDefaultForm = (formFields = [], config = {}) => props => (
-    <DefaultForm {...props} formFields={formFields} config={config} />
-);

package/src/Components/DefaultList.js

@@ -1,225 +0,0 @@
-import React, { Component } from 'react';
-import _ from 'lodash';
-
-import List from './List';
-import { T } from '../App/i18n';
-import withStyles from '@material-ui/core/styles/withStyles';
-
-const LoadingInfo = withStyles(theme => ({
-    root: {
-        marginBottom: theme.spacing.unit * 2,
-    },
-}))(({ children, classes }) => <div className={classes.root}>{children}</div>);
-
-export default class DefaultList extends Component {
-    static defaultProps = {
-        config: {},
-        List,
-    };
-
-    constructor(props) {
-        super(props);
-        const { orderby, orderdir, filters = {} } = props.listParams || {};
-        this.state = {
-            selectedRows: false,
-            listParams: {
-                offset: 0,
-                limit: props.actionConfig.rowsPerPage,
-                _language: props.locale.replace('-', '_'),
-                ...(orderby && orderdir && { orderby, orderdir }),
-                filters,
-            },
-        };
-    }
-
-    componentDidUpdate(prevProps) {
-        if (this.props.selected && !_.isEqual(prevProps.selected, this.props.selected)) {
-            this.setState({
-                selectedRows: this.props.selected,
-            });
-        }
-    }
-
-    componentWillReceiveProps(props) {
-        if (props.clearSelection) {
-            this.setState({
-                selectedRows: [],
-            });
-        }
-        if (props.setSelection) {
-            this.setState({
-                selectedRows: props.selected,
-            });
-        }
-        //if (props.selected && !_.isEqual(props.selected, this.props.selected))
-        if (props.locale !== this.props.locale) {
-            this.updateListParams({
-                _language: props.locale.replace('-', '_'),
-            });
-        }
-        if (props.didInvalidate && props.didInvalidate !== this.props.didInvalidate) {
-            // reload list if invalidated
-            this.setState({
-                selectedRows: [],
-            });
-            this.reloadList();
-        }
-    }
-
-    onRowSelection = (selectedRows, event) => {
-        this.setState({ selectedRows });
-        const inputType = _.get(event, 'target.type');
-
-        if (inputType === 'checkbox' && event.type === 'change') {
-            return;
-        }
-
-        if (_.isArray(selectedRows) && selectedRows.length > 1 && this.props.selected.length !== 1) {
-            return;
-        }
-
-        if (_.isArray(selectedRows) && selectedRows.length === 1) {
-            this.props.loadDetails(this.props.list.data[selectedRows[0]]);
-        } else if (_.isArray(selectedRows) && selectedRows.length > 1) {
-            this.props.hideDetails(true /* check if unsaved */, true /* do it silently */);
-        } else {
-            this.props.hideDetails();
-        }
-    };
-
-    clearSelection = () => {
-        this.setState({ selectedRows: [] });
-    };
-
-    reloadList = () => {
-        this.clearSelection();
-        this.props.loadList(this.state.listParams);
-    };
-
-    updateListParams = params => {
-        const { listParams } = this.state;
-        const mergedParams = _.merge({}, listParams, params);
-        !_.isEqual(mergedParams, listParams) &&
-            this.setState({ listParams: mergedParams }, () => {
-                this.reloadList();
-            });
-    };
-
-    removeListParams = params => {
-        const { listParams } = this.state;
-        this.setState({ listParams: _.omit(listParams, params) }, () => {
-            this.reloadList();
-        });
-    };
-
-    onSearchChange = searchText => {
-        let query = searchText.replace(/\s+/g, ''); // deleting spaces from query text
-        if (query.charAt(query.length - 1) === ',') {
-            query = query.substring(0, query.length - 1); // delete last character if it is ','
-        }
-        query ? this.updateListParams({ query }) : this.removeListParams('query');
-    };
-
-    onPaginationChange = ({ first, rowsPerPage }) => {
-        this.setState({ selectedRows: [] });
-        this.props.setActionConfig({ rowsPerPage });
-        this.updateListParams({
-            offset: first,
-            limit: rowsPerPage,
-        });
-    };
-
-    onFilterChange = (column, value, filterKey) => {
-        const { entity } = this.props.listParams;
-        const key = filterKey || `${entity}.${column}`;
-        if (value && value.length > 0) {
-            this.updateListParams({
-                filters: {
-                    [key]: value,
-                },
-                offset: 0,
-            });
-        } else {
-            this.removeListParams([`filters["${key}"]`]);
-        }
-    };
-
-    onSortChange = (column, dir, sortKey) => {
-        const { entity } = this.props.listParams;
-        if (dir) {
-            this.updateListParams({
-                orderby: sortKey || `${entity}.${column}`,
-                orderdir: dir && dir.toUpperCase(),
-            });
-        } else {
-            this.removeListParams(['orderby', 'orderdir']);
-        }
-    };
-
-    onDeleteItems = () => {
-        const idsToDelete = _.isArray(this.state.selectedRows)
-            ? this.state.selectedRows.map(row => this.props.list.data[row].id)
-            : this.state.selectedRows === 'all'
-            ? this.props.list.data.map(e => e.id)
-            : false;
-        idsToDelete && _.isFunction(this.props.onDeleteItems) && this.props.onDeleteItems(idsToDelete);
-    };
-
-    onShownColumnsChange = shownColumns => {
-        this.props.setConfig({ shownColumns });
-    };
-
-    render() {
-        const { list, columns, error, selected, onAddItem, config, List, listParams, listProps } = this.props;
-        const data = _.get(list, 'data', []);
-        const total = +_.get(list, 'metadata.totalcount', data.length);
-        const { shownColumns } = config;
-
-        let mergedSelectedRows = this.state.selectedRows || [];
-
-        if (selected) {
-            mergedSelectedRows = _.uniq(mergedSelectedRows.concat(selected));
-        }
-
-        return (
-            <div>
-                <List
-                    data={data}
-                    AddButtonComponent={this.props.listParams.AddButtonComponent}
-                    columns={columns}
-                    shownColumns={shownColumns}
-                    rowsTotal={total}
-                    rowsPerPage={this.state.listParams.limit}
-                    onRowSelection={this.onRowSelection}
-                    selected={mergedSelectedRows}
-                    clearSelection={this.clearSelection}
-                    reloadList={this.reloadList}
-                    onAddItem={onAddItem}
-                    addButtonLabel={listParams.addButtonLabel}
-                    onDeleteItems={this.props.onDeleteItems && this.onDeleteItems}
-                    onSearchChange={this.onSearchChange}
-                    onPaginationChange={this.onPaginationChange}
-                    onFilterChange={this.onFilterChange}
-                    onSortChange={this.onSortChange}
-                    onShownColumnsChange={this.onShownColumnsChange}
-                    showCheckboxes={!!this.props.onDeleteItems}
-                    listParams={this.state.listParams}
-                    {...listProps}
-                />
-                {error ? (
-                    <LoadingInfo>
-                        {T('Listing failed due to the following error')}: {error.message}
-                    </LoadingInfo>
-                ) : !list ? (
-                    <LoadingInfo>{T('Loading data')}...</LoadingInfo>
-                ) : (
-                    !total && <LoadingInfo>{T('There are no records')}</LoadingInfo>
-                )}
-            </div>
-        );
-    }
-}
-
-export const generateDefaultList = (columns = [], listParams = {}) => props => (
-    <DefaultList {...props} columns={columns} listParams={listParams} />
-);

package/src/Components/DefaultScreen.js

@@ -1,106 +0,0 @@
-import React, { Component } from 'react';
-import { get, isString } from 'lodash';
-
-import SplitScreen from '../Components/SplitContainer';
-import OverlayScreen from '../Components/OverlayContainer';
-import ModalScreen from '../Components/ModalContainer';
-
-import { T } from '../App/i18n';
-
-export default class DefaultScreen extends Component {
-    static defaultProps = {
-        title: null,
-        ListComponent: null,
-        EditComponent: null,
-        ScreenComponent: SplitScreen,
-        listAction: null,
-        unsavedEntityAction: null,
-        detailsAction: null,
-
-        showDetails: false,
-    };
-
-    componentDidMount() {
-        this.props.showDetails && this.props.hideDetailsAction();
-        this.props.invalidateListAction();
-        this.props.router && this.props.router.setRouteLeaveHook(this.props.route, this.routerWillLeave);
-
-        if (this.props.detailsAction) {
-            const subpath = get(this.props, 'params.subpath');
-            if (isString(subpath)) {
-                const parts = subpath.split(':');
-                if (parts.length === 2) {
-                    const key = parts[0];
-                    const value = parts[1];
-                    this.props.detailsAction({ [key]: value });
-                }
-            }
-        }
-    }
-
-    routerWillLeave = nextLocation => {
-        const { unsavedEntityAction } = this.props;
-        if (!unsavedEntityAction || (nextLocation.state && nextLocation.state.canLeave)) {
-            this.props.showDetails && this.props.hideDetailsAction();
-            return true;
-        }
-        unsavedEntityAction().then(() => {
-            const loc = {
-                ...nextLocation,
-                state: {
-                    canLeave: true,
-                },
-            };
-            this.props.router.push(loc);
-        });
-        return false;
-    };
-
-    render() {
-        const {
-            showDetails,
-            title,
-            ListComponent,
-            EditComponent,
-            ScreenComponent,
-            hintText,
-            ...otherProps
-        } = this.props;
-        return (
-            <ScreenComponent
-                headlineText={title && T(title)}
-                hintText={hintText}
-                showDetails={showDetails}
-                listComponent={<ListComponent {...otherProps} />}
-                detailsComponent={<EditComponent {...otherProps} />}
-                {...otherProps}
-            />
-        );
-    }
-}
-
-export const generateDefaultScreen = (title, ListComponent, EditComponent, hintText = null) => {
-    return props => (
-        <DefaultScreen
-            title={title}
-            hintText={hintText}
-            ListComponent={ListComponent}
-            EditComponent={EditComponent}
-            {...props}
-        />
-    );
-};
-
-export const generateCustomScreen = (title, ListComponent, EditComponent, ScreenComponent) => {
-    return props => (
-        <DefaultScreen
-            title={title}
-            ListComponent={ListComponent}
-            EditComponent={EditComponent}
-            ScreenComponent={ScreenComponent}
-            {...props}
-        />
-    );
-};
-
-export { SplitScreen, OverlayScreen, ModalScreen };

package/src/Components/Error.js

@@ -1,20 +0,0 @@
-import React from 'react';
-
-import IconButton from '../UIComponents/IconButton';
-import ArrowBackIcon from '../UIComponents/icons/ArrowBackIcon';
-
-const error = props => (
-    <div className="error">
-        <div>
-            <div className="message">{props.message}</div>
-            <div>{props.children}</div>
-            <div>
-                <IconButton tooltip="Close" onClick={() => alert('CLOSE')}>
-                    <ArrowBackIcon />
-                </IconButton>
-            </div>
-        </div>
-    </div>
-);
-
-export default error;