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 { observer } from 'mobx-react-lite';
import { FlatDataConnectionEditor } from './FlatDataConnectionEditor.js';
import { RelationalDatabaseConnectionEditor } from './RelationalDatabaseConnectionEditor.js';
import { RelationalDatabaseConnectionValueState, JsonModelConnectionValueState, FlatDataConnectionValueState, PackageableConnectionEditorState, } from '../../../../stores/editor/editor-state/element-editor-state/connection/ConnectionEditorState.js';
import { UnsupportedEditorPanel } from '../UnsupportedElementEditor.js';
import { CustomSelectorInput, LockIcon, Panel, PanelContent, PanelHeader, } from '@finos/legend-art';
import { useEditorStore } from '../../EditorStoreProvider.js';
import { modelConnection_setClass, modelConnection_setUrl, } from '../../../../stores/graph-modifier/DSL_Mapping_GraphModifierHelper.js';
import { useApplicationNavigationContext, useApplicationStore, } from '@finos/legend-application';
import { buildElementOption, getPackageableElementOptionFormatter, } from '@finos/legend-lego/graph-editor';
import { LEGEND_STUDIO_APPLICATION_NAVIGATION_CONTEXT_KEY } from '../../../../__lib__/LegendStudioApplicationNavigationContext.js';
const ModelConnectionEditor = observer((props) => {
    const { connectionValueState, isReadOnly, disableChangingClass } = props;
    const connection = connectionValueState.connection;
    const applicationStore = useApplicationStore();
    const editorStore = useEditorStore();
    // classOptions
    const classOptions = editorStore.graphManagerState.usableClasses.map(buildElementOption);
    const sourceClass = connection.class.value;
    const onSourceClassChange = (val) => modelConnection_setClass(connection, val.value);
    // TODO: handle content type (XML/JSON)
    // url
    const changeUrl = (event) => modelConnection_setUrl(connection, event.target.value);
    return (_jsxs("div", { className: "panel__content__form", children: [_jsxs("div", { className: "panel__content__form__section", children: [_jsxs("div", { className: "panel__content__form__section__header__label", children: [_jsx("div", { className: "panel__content__form__section__header__label__text", children: "Source Class" }), disableChangingClass && (_jsx("div", { className: "panel__content__form__section__header__label__lock", children: _jsx(LockIcon, {}) }))] }), _jsx("div", { className: "panel__content__form__section__header__prompt", children: "Specifies the class being used for the model store" }), _jsx(CustomSelectorInput, { disabled: isReadOnly || disableChangingClass, className: "panel__content__form__section__dropdown", options: classOptions, onChange: onSourceClassChange, value: { label: sourceClass.name, value: sourceClass }, darkMode: !applicationStore.layoutService
                            .TEMPORARY__isLightColorThemeEnabled, formatOptionLabel: getPackageableElementOptionFormatter({
                            darkMode: !applicationStore.layoutService
                                .TEMPORARY__isLightColorThemeEnabled,
                        }) })] }), _jsxs("div", { className: "panel__content__form__section", children: [_jsx("div", { className: "panel__content__form__section__header__label", children: "URL" }), _jsx("div", { className: "panel__content__form__section__header__prompt", children: "Specifies the connection URL" }), _jsx("textarea", { className: "panel__content__form__section__textarea connection-editor__model-connection-url__textarea", spellCheck: false, value: connection.url, onChange: changeUrl, disabled: isReadOnly })] })] }));
});
export const ConnectionEditor = observer((props) => {
    const { connectionEditorState, isReadOnly, disableChangingStore } = props;
    const connectionValueState = connectionEditorState.connectionValueState;
    const editorStore = useEditorStore();
    const plugins = editorStore.pluginManager.getApplicationPlugins();
    const renderConnectionValueEditor = () => {
        if (connectionValueState instanceof JsonModelConnectionValueState) {
            return (_jsx(ModelConnectionEditor, { connectionValueState: connectionValueState, isReadOnly: isReadOnly, disableChangingClass: disableChangingStore }));
        }
        else if (connectionValueState instanceof FlatDataConnectionValueState) {
            return (_jsx(FlatDataConnectionEditor, { connectionValueState: connectionValueState, isReadOnly: isReadOnly }));
        }
        else if (connectionValueState instanceof RelationalDatabaseConnectionValueState) {
            return (_jsx(RelationalDatabaseConnectionEditor, { connectionValueState: connectionValueState, isReadOnly: isReadOnly }));
        }
        else {
            const extraConnectionEditorRenderers = plugins.flatMap((plugin) => plugin.getExtraConnectionEditorRenderers?.() ?? []);
            for (const editorRenderer of extraConnectionEditorRenderers) {
                const editor = editorRenderer(connectionValueState, isReadOnly);
                if (editor) {
                    return editor;
                }
            }
            return (_jsx(UnsupportedEditorPanel, { text: "Can't display this connection in form-mode", isReadOnly: isReadOnly }));
        }
    };
    return (_jsxs(Panel, { className: "connection-editor", children: [_jsx(PanelHeader, { title: connectionValueState.label() }), _jsx(PanelContent, { children: renderConnectionValueEditor() })] }));
});
export const PackageableConnectionEditor = observer(() => {
    const editorStore = useEditorStore();
    const editorState = editorStore.tabManagerState.getCurrentEditorState(PackageableConnectionEditorState);
    const isReadOnly = editorState.isReadOnly;
    useApplicationNavigationContext(LEGEND_STUDIO_APPLICATION_NAVIGATION_CONTEXT_KEY.CONNECTION_EDITOR);
    return (_jsx(ConnectionEditor, { connectionEditorState: editorState.connectionState, isReadOnly: isReadOnly }));
});
//# sourceMappingURL=ConnectionEditor.js.map