plot-plan-designer/lib/esm/containers/App.js

Design Editor Tools with React.js + ant.design + fabric.js

import React, { Component } from 'react';
import ImageMapEditor from '../components/imagemap/ImageMapEditor';
import FlowContainer from './FlowContainer';
import { ConfigProvider } from 'antd';
import koKR from 'antd/locale/ko_KR';
import enUS from 'antd/locale/en_US';
import jaJP from 'antd/locale/ja_JP';
import { i18nClient } from '../i18n';
import PropTypes from 'prop-types';
import { EditMode } from '../contexts/FlowContext';
import i18next from 'i18next';
const antResources = {
    ko: koKR,
    en: enUS,
    ja: jaJP,
};
class App extends Component {
    constructor() {
        super(...arguments);
        this.state = {
            activeEditor: 'imagemap',
            editMode: EditMode.EDITING,
        };
        this.onChangeMenu = ({ key }) => {
            this.setState({
                activeEditor: key,
            });
        };
    }
    componentDidMount() {
        i18nClient.then(() => { });
    }
    componentDidUpdate(prevProps) {
        if (prevProps.editMode !== this.props.editMode) {
            this.setState({ editMode: this.props.editMode });
        }
    }
    render() {
        const { onLinkHandler, editMode, objectOptions, tabsDefinition, onLoad, onSave, editorName, onMigrate, fetcher } = this.props;
        // @ts-ignore
        const locale = antResources[i18next.language];
        return (React.createElement(ConfigProvider, { locale: locale },
            React.createElement("div", { className: "rde-main" },
                React.createElement(FlowContainer, { editMode: editMode !== null && editMode !== void 0 ? editMode : EditMode.EDITING },
                    React.createElement("div", { className: "rde-content" },
                        React.createElement(ImageMapEditor, { onLinkHandler: onLinkHandler, objectOptions: objectOptions, tabsDefinition: tabsDefinition, onLoad: onLoad, onSave: onSave, onMigrate: onMigrate, editorName: editorName, fetcher: fetcher }))))));
    }
}
App.propTypes = {
    onLinkHandler: PropTypes.func,
    onLoad: PropTypes.func,
    onSave: PropTypes.func,
    onMigrate: PropTypes.func,
    editMode: PropTypes.oneOf([EditMode.EDITING, EditMode.LINKING]),
    objectOptions: PropTypes.object,
    tabsDefinition: PropTypes.object,
    editorName: PropTypes.string,
};
export default App;