terriajs/dist/ReactViews/Analytics/InvokeFunction.js

Geospatial data visualization platform.

var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
    return c > 3 && r && Object.defineProperty(target, key, r), r;
};
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { makeObservable, observable, runInAction } from "mobx";
import { observer } from "mobx-react";
import { useMemo } from "react";
import { useTranslation } from "react-i18next";
import styled from "styled-components";
import TerriaError from "../../Core/TerriaError";
import Button from "../../Styled/Button";
import { scrollBars } from "../../Styled/mixins";
import { useViewState } from "../Context";
import parseCustomMarkdownToReact from "../Custom/parseCustomMarkdownToReact";
import Loader from "../Loader";
import WarningBox from "../Preview/WarningBox";
import ParameterEditor from "./ParameterEditor";
class FunctionViewModel {
    catalogFunction;
    _parameters = {};
    constructor(catalogFunction) {
        this.catalogFunction = catalogFunction;
        this._parameters = {};
    }
    getParameter(parameter) {
        let result = this._parameters[parameter.id];
        if (!result || result.parameter !== parameter) {
            result = this._parameters[parameter.id] = new ParameterViewModel(parameter);
        }
        return result;
    }
    validateParameter(parameter) {
        if (!parameter.isValid || !this.getParameter(parameter).isValueValid) {
            // Editor says it's not valid, so it's not valid.
            return false;
        }
        // Verify that required parameters have a value.
        if (parameter.isRequired &&
            (parameter.value === undefined || parameter.value === null)) {
            return false;
        }
        return true;
    }
}
class ParameterViewModel {
    parameter;
    userValue = undefined;
    isValueValid = true;
    wasEverBlurredWhileInvalid = false;
    constructor(parameter) {
        makeObservable(this);
        this.parameter = parameter;
    }
}
__decorate([
    observable
], ParameterViewModel.prototype, "userValue", void 0);
__decorate([
    observable
], ParameterViewModel.prototype, "isValueValid", void 0);
__decorate([
    observable
], ParameterViewModel.prototype, "wasEverBlurredWhileInvalid", void 0);
const InvokeFunction = observer(({ previewed }) => {
    const viewState = useViewState();
    const [t] = useTranslation();
    let functionParameters, parametersError;
    try {
        functionParameters = previewed.functionParameters;
    }
    catch (e) {
        // .functionParameters might throw an error. Handle it here.
        parametersError = TerriaError.from(e);
    }
    const error = previewed.loadMetadataResult?.error ?? parametersError;
    const description = previewed.description
        ? parseCustomMarkdownToReact(previewed.description, {
            catalogItem: previewed
        })
        : undefined;
    const functionViewModel = useMemo(() => new FunctionViewModel(previewed), [previewed]);
    const invalidParameters = !functionParameters ||
        functionParameters.some((param) => functionViewModel.validateParameter(param) !== true);
    const runAnalysis = () => {
        previewed.submitJob().catch((e) => {
            viewState.terria.raiseErrorToUser(e);
        });
        runInAction(() => {
            // Close modal window
            viewState.explorerPanelIsVisible = false;
            // mobile switch to nowvewing
            viewState.switchMobileView(viewState.mobileViewOptions.preview);
        });
    };
    if (previewed.isLoading) {
        return _jsx(Loader, {});
    }
    return (_jsxs(Wrapper, { children: [_jsxs(Content, { children: [_jsx("h3", { children: previewed.name }), error && _jsx(WarningBox, { error: error, viewState: viewState }), description && _jsx("div", { children: description }), _jsx("div", { children: functionParameters &&
                            functionParameters.map((param) => (_jsx(ParameterEditor, { parameter: param, viewState: viewState, previewed: previewed, parameterViewModel: functionViewModel.getParameter(param) }, param.id + previewed.uniqueId))) })] }), _jsx(Footer, { children: _jsx(Button, { primary: true, fullWidth: true, disabled: invalidParameters, onClick: runAnalysis, children: t("analytics.runAnalysis") }) })] }));
});
const Wrapper = styled.div `
  display: flex;
  flex-direction: column;
  padding: ${(p) => p.theme.paddingSmall};
  position: relative;
  height: calc(100% - ${(p) => p.theme.paddingSmall} * 2);
  a {
    color: variables.$color-primary;
  }
`;
const Content = styled.div `
  ${(p) => scrollBars(p)}
  overflow-y: auto;
  height: calc(100% - ${(p) => p.theme.inputHeight});
  padding-right: ${(p) => p.theme.padding};
  padding-left: ${(p) => p.theme.padding};
  h3 {
    margin-top: 0;
  }
`;
const Footer = styled.div `
  background: ${(p) => p.theme.modalBg};
  padding: ${(p) => p.theme.paddingSmall};
`;
export default InvokeFunction;
//# sourceMappingURL=InvokeFunction.js.map