@finos/legend-application-pure-ide/lib/components/side-bar/MoveElementPrompt.js

Legend Pure IDE application core

import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
/**
 * Copyright (c) 2020-present, Goldman Sachs
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *     http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */
import { useRef, useState } from 'react';
import { observer } from 'mobx-react-lite';
import { useApplicationStore } from '@finos/legend-application';
import { usePureIDEStore } from '../PureIDEStoreProvider.js';
import { Dialog } from '@finos/legend-art';
import { ElementConceptAttribute, } from '../../server/models/ConceptTree.js';
import { extractPackagePathFromPath } from '@finos/legend-graph';
import { guaranteeType } from '@finos/legend-shared';
const PACKAGE_PATH_PATTERN = /^(?:(?:\w[\w$]*)::)*\w[\w$]*$/;
export const MoveElementPrompt = observer((props) => {
    const { node } = props;
    const ideStore = usePureIDEStore();
    const applicationStore = useApplicationStore();
    const packagePath = extractPackagePathFromPath(node.data.li_attr.pureId) ?? '';
    const [value, setValue] = useState(packagePath);
    const inputRef = useRef(null);
    // validation
    const isValidValue = Boolean(value.match(PACKAGE_PATH_PATTERN));
    const isSameValue = packagePath === value;
    const error = !isValidValue ? 'Invalid path' : undefined;
    // actions
    const closeModal = () => ideStore.conceptTreeState.setNodeForMoveElement(undefined);
    const onValueChange = (event) => setValue(event.target.value);
    const rename = (event) => {
        event.preventDefault();
        if (isSameValue) {
            return;
        }
        ideStore.conceptTreeState
            .movePackageableElements([guaranteeType(node.data.li_attr, ElementConceptAttribute)], value)
            .catch(applicationStore.alertUnhandledError)
            .finally(() => closeModal());
    };
    const handleEnter = () => inputRef.current?.focus();
    return (_jsx(Dialog, { open: true, onClose: closeModal, classes: { container: 'command-modal__container' }, slotProps: {
            transition: {
                onEnter: handleEnter,
            },
            paper: {
                classes: { root: 'command-modal__inner-container' },
            },
        }, children: _jsxs("div", { className: "modal modal--dark command-modal", children: [_jsx("div", { className: "modal__title", children: "Move element" }), _jsxs("div", { className: "command-modal__content", children: [_jsx("form", { className: "command-modal__content__form", onSubmit: rename, children: _jsxs("div", { className: "input-group command-modal__content__input", children: [_jsx("input", { ref: inputRef, className: "input input--dark", onChange: onValueChange, value: value, spellCheck: false }), error && (_jsx("div", { className: "input-group__error-message", children: error }))] }) }), _jsx("button", { className: "command-modal__content__submit-btn btn--dark", disabled: Boolean(error), onClick: rename, children: "Move" })] })] }) }));
});
//# sourceMappingURL=MoveElementPrompt.js.map