@notebook-intelligence/notebook-intelligence
Version:
AI coding assistant for JupyterLab
59 lines (58 loc) • 3.81 kB
JavaScript
// Copyright (c) Mehmet Bektas <mbektasgh@outlook.com>
import React, { useState } from 'react';
export function AskUserQuestion(props) {
const userQuestions = props.userQuestions.content;
const [selectedAnswers, setSelectedAnswers] = useState({});
const onOptionSelected = (question, option) => {
var _a, _b, _c;
if (question.multiSelect) {
if ((_a = selectedAnswers[question.question]) === null || _a === void 0 ? void 0 : _a.includes(option.label)) {
setSelectedAnswers({
...selectedAnswers,
[question.question]: ((_b = selectedAnswers[question.question]) !== null && _b !== void 0 ? _b : []).filter((o) => o !== option.label)
});
}
else {
setSelectedAnswers({
...selectedAnswers,
[question.question]: [
...((_c = selectedAnswers[question.question]) !== null && _c !== void 0 ? _c : []),
option.label
]
});
}
}
else {
setSelectedAnswers({
...selectedAnswers,
[question.question]: [option.label]
});
}
};
return (React.createElement(React.Fragment, null,
userQuestions.title ? (React.createElement("div", null,
React.createElement("b", null, userQuestions.title))) : null,
userQuestions.message ? React.createElement("div", null, userQuestions.message) : null,
userQuestions.questions.map((question) => (React.createElement("div", { className: "ask-user-question-container", key: question.question },
React.createElement("form", { className: "ask-user-question-form" },
React.createElement("div", { className: "ask-user-question-question" }, question.question),
React.createElement("div", { className: "ask-user-question-header" }, question.header),
React.createElement("div", { className: "ask-user-question-options" }, question.options.map((option) => {
var _a, _b;
return (React.createElement("div", { className: "ask-user-question-option", key: option.label },
React.createElement("div", { className: "ask-user-question-option-input-container" },
React.createElement("input", { id: option.label, type: "checkbox", checked: (_b = (_a = selectedAnswers[question.question]) === null || _a === void 0 ? void 0 : _a.includes(option.label)) !== null && _b !== void 0 ? _b : false, onChange: () => onOptionSelected(question, option) }),
React.createElement("label", { htmlFor: option.label, className: "ask-user-question-option-label-container" },
React.createElement("div", { className: "ask-user-question-option-label" }, option.label),
React.createElement("div", { className: "ask-user-question-option-description" }, option.description)))));
})))))),
React.createElement("div", { className: "ask-user-question-footer" },
React.createElement("button", { className: "jp-Dialog-button jp-mod-accept jp-mod-styled", onClick: () => {
props.onSubmit(selectedAnswers);
} },
React.createElement("div", { className: "jp-Dialog-buttonLabel" }, userQuestions.submitLabel)),
React.createElement("button", { className: "jp-Dialog-button jp-mod-reject jp-mod-styled", onClick: () => {
props.onCancel();
} },
React.createElement("div", { className: "jp-Dialog-buttonLabel" }, userQuestions.cancelLabel)))));
}