@finos/legend-application-pure-ide
Version:
Legend Pure IDE application core
105 lines • 8.52 kB
JavaScript
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 { useApplicationStore } from '@finos/legend-application';
import { ArrowDownIcon, ArrowUpIcon, BlankPanelContent, CaseSensitiveIcon, CloseIcon, clsx, ContextMenu, CopyIcon, HistoryIcon, MenuContent, MenuContentItem, QuestionCircleIcon, RegexIcon, TrashIcon, useResizeDetector, WholeWordMatchIcon, } from '@finos/legend-art';
import { observer } from 'mobx-react-lite';
import { useEffect, useRef } from 'react';
import { PANEL_MODE } from '../../stores/PureIDEConfig.js';
import { usePureIDEStore } from '../PureIDEStoreProvider.js';
export const Console = observer(() => {
const ideStore = usePureIDEStore();
const applicationStore = useApplicationStore();
const terminal = applicationStore.terminalService.terminal;
const searchInputRef = useRef(null);
const { ref, width, height } = useResizeDetector();
useEffect(() => {
if (searchInputRef.current) {
terminal.searchConfig.setSearchInput(searchInputRef.current);
}
return () => terminal.searchConfig.setSearchInput(undefined);
}, [terminal]);
useEffect(() => {
if (ref.current) {
terminal.mount(ref.current);
}
}, [terminal, ref]);
// auto-focus on the terminal when the console tab is open
useEffect(() => {
if (ideStore.panelGroupDisplayState.isOpen &&
ideStore.activePanelMode === PANEL_MODE.TERMINAL) {
terminal.focus();
}
}, [
terminal,
ideStore.panelGroupDisplayState.isOpen,
ideStore.activePanelMode,
]);
useEffect(() => {
terminal.autoResize();
}, [terminal, width, height]);
const onSearchTextChange = (event) => {
const value = event.target.value;
terminal.setSearchText(value);
terminal.search(value);
};
const goToPreviousSearchMatch = () => {
terminal.findPrevious();
};
const goToNextSearchMatch = () => {
terminal.findNext();
};
const onSearchNavigation = (event) => {
if (event.code === 'Enter') {
if (event.shiftKey) {
terminal.findPrevious();
}
else {
terminal.findNext();
}
}
else if (event.code === 'Escape') {
terminal.clearSearch();
terminal.focus();
}
};
const clear = () => {
terminal.clear();
terminal.focus();
};
const copy = () => terminal.copy();
const copyAll = () => terminal.copyAll();
if (!terminal.isSetup) {
return (_jsx("div", { className: "terminal-panel", children: _jsx(BlankPanelContent, { children: "Terminal is not set up yet" }) }));
}
return (_jsxs("div", { className: "terminal-panel", children: [_jsxs("div", { className: "terminal-panel__header", children: [_jsxs("div", { className: "terminal-panel__header__group", children: [_jsxs("div", { className: "terminal-panel__header__searcher__input__container", children: [_jsx("input", { ref: searchInputRef, className: "terminal-panel__header__searcher__input input--dark", spellCheck: false, value: terminal.searchConfig.searchText, onChange: onSearchTextChange, onKeyDown: onSearchNavigation, placeholder: "Find" }), _jsxs("div", { className: "terminal-panel__header__searcher__input__actions", children: [_jsx("button", { className: "terminal-panel__header__searcher__input__action", tabIndex: -1, title: "Clear Search", onClick: () => terminal.clearSearch(), children: _jsx(CloseIcon, {}) }), _jsx("button", { className: clsx('terminal-panel__header__searcher__input__action', {
'terminal-panel__header__searcher__input__action--active': terminal.searchConfig.matchCaseSensitive,
}), tabIndex: -1, title: "Match Case", onClick: () => terminal.setSearchCaseSensitive(!terminal.searchConfig.matchCaseSensitive), children: _jsx(CaseSensitiveIcon, {}) }), _jsx("button", { className: clsx('terminal-panel__header__searcher__input__action', {
'terminal-panel__header__searcher__input__action--active': terminal.searchConfig.matchWholeWord,
}), tabIndex: -1, title: "Match Whole Word", onClick: () => terminal.setSearchWholeWord(!terminal.searchConfig.matchWholeWord), children: _jsx(WholeWordMatchIcon, {}) }), _jsx("button", { className: clsx('terminal-panel__header__searcher__input__action', {
'terminal-panel__header__searcher__input__action--active': terminal.searchConfig.useRegex,
}), tabIndex: -1, title: "Use Regular Expression", onClick: () => terminal.setSearchRegex(!terminal.searchConfig.useRegex), children: _jsx(RegexIcon, {}) })] })] }), _jsx("div", { className: "terminal-panel__header__searcher__result", children: terminal.searchConfig.resultCount
? `${terminal.searchConfig.currentResultIndex !== undefined
? terminal.searchConfig.currentResultIndex + 1
: 0} of ${terminal.searchConfig.resultCount}`
: 'No results' }), _jsx("button", { className: "terminal-panel__header__action terminal-panel__header__group__action", title: "Previous Match (Shift+Enter)", disabled: !terminal.searchConfig.resultCount, tabIndex: -1, onClick: goToPreviousSearchMatch, children: _jsx(ArrowUpIcon, { className: "terminal-panel__header__action__icon" }) }), _jsx("button", { className: "terminal-panel__header__action terminal-panel__header__group__action", title: "Next Match (Enter)", disabled: !terminal.searchConfig.resultCount, tabIndex: -1, onClick: goToNextSearchMatch, children: _jsx(ArrowDownIcon, { className: "terminal-panel__header__action__icon" }) })] }), _jsx("div", { className: "terminal-panel__header__group__separator" }), _jsxs("div", { className: "terminal-panel__header__group", children: [_jsx("button", { className: clsx('terminal-panel__header__action terminal-panel__header__group__action', {
'terminal-panel__header__action--active': terminal.preserveLog,
}), title: "Toggle Preserve Console", tabIndex: -1, onClick: () => terminal.setPreserveLog(!terminal.preserveLog), children: _jsx(HistoryIcon, { className: "terminal-panel__header__action__icon" }) }), _jsx("button", { className: "terminal-panel__header__action terminal-panel__header__group__action", title: "Copy Text Content", tabIndex: -1, onClick: copyAll, children: _jsx(CopyIcon, { className: "terminal-panel__header__action__icon" }) }), _jsx("button", { className: "terminal-panel__header__action terminal-panel__header__group__action", title: "Clear Console", tabIndex: -1, onClick: clear, children: _jsx(TrashIcon, { className: "terminal-panel__header__action__icon" }) }), _jsx("button", { className: "terminal-panel__header__action terminal-panel__header__group__action", title: "Show Help", tabIndex: -1, onClick: () => {
terminal.showHelp();
terminal.focus();
}, children: _jsx(QuestionCircleIcon, { className: "terminal-panel__header__action__icon" }) })] })] }), _jsx(ContextMenu, { className: "terminal-panel__content", content: _jsxs(MenuContent, { children: [_jsx(MenuContentItem, { onClick: copy, children: "Copy" }), _jsx(MenuContentItem, { onClick: copyAll, children: "Copy All" }), _jsx(MenuContentItem, { onClick: clear, children: "Clear" })] }), menuProps: { elevation: 7 }, children: _jsx("div", { ref: ref, className: "terminal-panel__container" }) })] }));
});
//# sourceMappingURL=TerminalPanel.js.map