UNPKG

@finos/legend-application-pure-ide

Version:
55 lines 3.12 kB
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 { flowResult } from 'mobx'; import { useApplicationStore } from '@finos/legend-application'; import { usePureIDEStore } from '../PureIDEStoreProvider.js'; import { Dialog } from '@finos/legend-art'; const FILE_PATH_PATTERN = /^\/?(?:\w+\/)*\w+(?:\.\w+)*$/; export const RenameFilePrompt = observer((props) => { const { node } = props; const ideStore = usePureIDEStore(); const applicationStore = useApplicationStore(); const [value, setValue] = useState(node.data.li_attr.path); const inputRef = useRef(null); // validation const isValidValue = Boolean(value.match(FILE_PATH_PATTERN)); const isSameValue = node.data.li_attr.path === value; const error = !isValidValue ? 'Invalid path' : undefined; // actions const closeModal = () => ideStore.directoryTreeState.setNodeForRenameFile(undefined); const onValueChange = (event) => setValue(event.target.value); const rename = (event) => { event.preventDefault(); if (isSameValue) { return; } closeModal(); flowResult(ideStore.renameFile(node.data.li_attr.path, value)).catch(applicationStore.alertUnhandledError); }; 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: "Rename file" }), _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: "Rename" })] })] }) })); }); //# sourceMappingURL=RenameFilePrompt.js.map