pricing4react
Version:
A library of components that ease the integration of feature toggling driven by pricing plans into your React application's UI.
45 lines (44 loc) • 3.95 kB
JavaScript
"use strict";
var __assign = (this && this.__assign) || function () {
__assign = Object.assign || function(t) {
for (var s, i = 1, n = arguments.length; i < n; i++) {
s = arguments[i];
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
t[p] = s[p];
}
return t;
};
return __assign.apply(this, arguments);
};
exports.__esModule = true;
exports.ConditionEvaluationForm = void 0;
var jsx_runtime_1 = require("react/jsx-runtime");
var react_1 = require("react");
var Button_1 = require("../../components/Button");
var utils_1 = require("../../utils");
var EditorContextProvider_1 = require("../../context/EditorContextProvider");
function ConditionEvaluationForm(_a) {
var attribute = _a.attribute, onSubmit = _a.onSubmit, setVisible = _a.setVisible;
var parsedExpression = (0, utils_1.parseExpression)(attribute.expression);
var _b = (0, react_1.useState)({
operator: parsedExpression.operator,
userContextValue: parsedExpression.userContext
}), expression = _b[0], setExpression = _b[1];
var userContextAttributes = (0, react_1.useContext)(EditorContextProvider_1.EditorContext).userContextAttributes;
var conditionAttributes = userContextAttributes.filter(function (attribute) { return attribute.type === "CONDITION"; });
console.log(parsedExpression);
var handleSubmit = function (e) {
e.preventDefault();
var leftOperand = "planContext['".concat(attribute.id, "']");
var rightOperand = "userContext['".concat(expression.userContextValue, "']");
var exp = (0, utils_1.computeEvaluation)(leftOperand, expression.operator, rightOperand);
onSubmit(attribute.id, exp);
setVisible(false);
};
return ((0, jsx_runtime_1.jsxs)("form", __assign({ className: "pp-form", onSubmit: handleSubmit }, { children: [(0, jsx_runtime_1.jsxs)("div", __assign({ className: "pp-field" }, { children: [(0, jsx_runtime_1.jsx)("label", __assign({ id: "name" }, { children: "Name" })), (0, jsx_runtime_1.jsx)("input", { id: "name", value: attribute.id, readOnly: true })] })), (0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("label", __assign({ id: "operator" }, { children: "Operator" })), (0, jsx_runtime_1.jsxs)("select", __assign({ id: "operator", value: expression.operator, onChange: function (e) {
return setExpression(__assign(__assign({}, expression), { operator: e.target.value }));
} }, { children: [(0, jsx_runtime_1.jsx)("option", __assign({ value: "" }, { children: "DON'T EVALUATE" })), (0, jsx_runtime_1.jsx)("option", __assign({ value: "&&" }, { children: "AND" })), (0, jsx_runtime_1.jsx)("option", __assign({ value: "||" }, { children: "OR" })), (0, jsx_runtime_1.jsx)("option", __assign({ value: "None" }, { children: "NONE" }))] }))] }), (0, jsx_runtime_1.jsxs)("div", __assign({ className: "pp-field" }, { children: [(0, jsx_runtime_1.jsx)("label", { id: "value-to-compare" }), (0, jsx_runtime_1.jsxs)("select", __assign({ id: "value-to-compare", name: "value-to-compare", value: expression.userContextValue, onChange: function (e) {
return setExpression(__assign(__assign({}, expression), { userContextValue: e.target.value }));
} }, { children: [(0, jsx_runtime_1.jsx)("option", __assign({ value: "" }, { children: "None" })), conditionAttributes.map(function (attribute) { return ((0, jsx_runtime_1.jsx)("option", __assign({ value: attribute.id }, { children: attribute.id }), attribute.id)); })] }))] })), (0, jsx_runtime_1.jsx)(Button_1.Button, __assign({ type: "button", className: "pp-btn", onClick: function () { return setVisible(false); } }, { children: "Close" })), (0, jsx_runtime_1.jsx)(Button_1.Button, __assign({ className: "pp-btn" }, { children: "Save" }))] })));
}
exports.ConditionEvaluationForm = ConditionEvaluationForm;