@unito/integration-debugger
Version:
The Unito Integration Debugger
98 lines (97 loc) • 4.51 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", { value: true });
const jsx_runtime_1 = require("react/jsx-runtime");
const react_1 = require("react");
const store_1 = require("../../store");
const styles_1 = require("../../styles");
const SetUrl = (props) => {
const configuration = (0, store_1.useConfigurationState)();
const inputRef = (0, react_1.useRef)(null);
(0, react_1.useEffect)(() => {
if (inputRef.current) {
inputRef.current.focus();
inputRef.current.setValue(configuration.integrationUrl ?? '');
inputRef.current.key(['escape'], function () {
props.close();
});
inputRef.current.on('submit', integrationUrl => {
configuration.integrationUrl = integrationUrl;
configuration.integrationId = undefined;
props.nextStep();
});
}
return () => {
if (inputRef.current) {
inputRef.current.free();
}
};
}, [inputRef]);
return ((0, jsx_runtime_1.jsx)("box", { label: (0, styles_1.paneTitle)('set the URL to your integration | <enter> = confirm, <esc> = cancel'), top: "center", left: "center", width: 80, height: 3, border: styles_1.paneBorder, style: styles_1.pane, children: (0, jsx_runtime_1.jsx)("textbox", { ref: inputRef, keys: true, inputOnFocus: true }) }));
};
const SetGraphRelativeUrl = (props) => {
const configuration = (0, store_1.useConfigurationState)();
const inputRef = (0, react_1.useRef)(null);
(0, react_1.useEffect)(() => {
if (inputRef.current) {
inputRef.current.focus();
inputRef.current.setValue(configuration.graphRelativeUrl ?? '/');
inputRef.current.key(['escape'], function () {
props.close();
});
inputRef.current.on('submit', graphRelativeUrl => {
configuration.graphRelativeUrl = graphRelativeUrl;
configuration.integrationId = undefined;
props.nextStep();
});
}
return () => {
if (inputRef.current) {
inputRef.current.free();
}
};
}, [inputRef]);
return ((0, jsx_runtime_1.jsx)("box", { label: (0, styles_1.paneTitle)('set the relative graph URL | <enter> = confirm, <esc> = cancel'), top: "center", left: "center", width: 80, height: 3, border: styles_1.paneBorder, style: styles_1.pane, children: (0, jsx_runtime_1.jsx)("textbox", { ref: inputRef, keys: true, inputOnFocus: true }) }));
};
const SetCredentialAccountRelativeUrl = (props) => {
const configuration = (0, store_1.useConfigurationState)();
const inputRef = (0, react_1.useRef)(null);
(0, react_1.useEffect)(() => {
if (inputRef.current) {
inputRef.current.focus();
inputRef.current.setValue(configuration.credentialAccountRelativeUrl ?? '/me');
inputRef.current.key(['escape'], function () {
props.close();
});
inputRef.current.on('submit', credentialAccountRelativeUrl => {
configuration.credentialAccountRelativeUrl = credentialAccountRelativeUrl;
configuration.integrationId = undefined;
props.nextStep();
});
}
return () => {
if (inputRef.current) {
inputRef.current.free();
}
};
}, [inputRef]);
return ((0, jsx_runtime_1.jsx)("box", { label: (0, styles_1.paneTitle)('set the relative credentials account URL | <enter> = confirm, <esc> = cancel'), top: "center", left: "center", width: 80, height: 3, border: styles_1.paneBorder, style: styles_1.pane, children: (0, jsx_runtime_1.jsx)("textbox", { ref: inputRef, keys: true, inputOnFocus: true }) }));
};
const SetIntegration = (props) => {
const [step, setStep] = (0, react_1.useState)('url');
let view;
if (step === 'url') {
view = ((0, jsx_runtime_1.jsx)(SetUrl, { close: props.close, nextStep: () => {
setStep('graph');
} }));
}
else if (step === 'graph') {
view = ((0, jsx_runtime_1.jsx)(SetGraphRelativeUrl, { close: props.close, nextStep: () => {
setStep('me');
} }));
}
else {
view = (0, jsx_runtime_1.jsx)(SetCredentialAccountRelativeUrl, { close: props.close, nextStep: props.close });
}
return view;
};
exports.default = SetIntegration;