cozy-search
Version:
UI components about search bar and IA assistant
250 lines (201 loc) • 8.93 kB
JavaScript
"use strict";
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.useAssistantDialog = exports.STEPS = void 0;
var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
var _react = require("react");
var _cozyMinilog = _interopRequireDefault(require("cozy-minilog"));
var _Alert = require("cozy-ui/transpiled/react/providers/Alert");
var _twakeI18n = require("twake-i18n");
var _locales = require("../../locales");
var _constants = require("../constants");
var _helpers = require("./helpers");
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
var log = (0, _cozyMinilog.default)('[AssistantDialog]');
var STEPS = {
BASIC_INFO: 0,
MODEL_SELECTION: 1,
API_KEY: 2
};
/**
* Hook to manage the state and logic of Assistant Dialogs (Create/Edit).
* @param {Object} props
* @param {Function} props.onClose - Function to close the dialog
* @param {Object} [props.initialData] - Initial formData
*/
exports.STEPS = STEPS;
var useAssistantDialog = function useAssistantDialog(_ref) {
var onClose = _ref.onClose,
_ref$initialData = _ref.initialData,
initialData = _ref$initialData === void 0 ? {} : _ref$initialData;
(0, _twakeI18n.useExtendI18n)(_locales.locales);
var _useI18n = (0, _twakeI18n.useI18n)(),
t = _useI18n.t;
var _useAlert = (0, _Alert.useAlert)(),
showAlert = _useAlert.showAlert;
var _useState = (0, _react.useState)(STEPS.BASIC_INFO),
_useState2 = (0, _slicedToArray2.default)(_useState, 2),
step = _useState2[0],
setStep = _useState2[1];
var _useState3 = (0, _react.useState)(initialData.selectedProvider || null),
_useState4 = (0, _slicedToArray2.default)(_useState3, 2),
selectedProvider = _useState4[0],
setSelectedProvider = _useState4[1];
var _useState5 = (0, _react.useState)(_objectSpread({
name: '',
description: '',
icon: null,
model: '',
baseUrl: '',
apiKey: ''
}, initialData)),
_useState6 = (0, _slicedToArray2.default)(_useState5, 2),
formData = _useState6[0],
setFormData = _useState6[1];
var canSubmit = (0, _react.useMemo)(function () {
return step === STEPS.API_KEY || step === STEPS.MODEL_SELECTION && (selectedProvider === null || selectedProvider === void 0 ? void 0 : selectedProvider.id) === _constants.OPENRAG_MODEL;
}, [step, selectedProvider === null || selectedProvider === void 0 ? void 0 : selectedProvider.id]);
var handleChange = function handleChange(field) {
return function (event) {
var _event$target;
var value = ((_event$target = event.target) === null || _event$target === void 0 ? void 0 : _event$target.value) !== undefined ? event.target.value : event;
setFormData(function (prev) {
return _objectSpread(_objectSpread({}, prev), {}, (0, _defineProperty2.default)({}, field, value));
});
};
};
var handleChangeModel = function handleChangeModel(value) {
handleChange('model')({
target: {
value: value
}
});
setSelectedProvider(function (prev) {
return prev ? _objectSpread(_objectSpread({}, prev), {}, {
model: value
}) : prev;
});
};
var handleAvatarChange = function handleAvatarChange(avatarData) {
setFormData(function (prev) {
return _objectSpread(_objectSpread({}, prev), {}, {
icon: avatarData
});
});
};
var handleProviderSelection = function handleProviderSelection(provider) {
setFormData(function (prev) {
var _provider$baseUrl, _provider$models$, _provider$models;
return _objectSpread(_objectSpread({}, prev), {}, {
baseUrl: (_provider$baseUrl = provider.baseUrl) !== null && _provider$baseUrl !== void 0 ? _provider$baseUrl : '',
model: (_provider$models$ = (_provider$models = provider.models) === null || _provider$models === void 0 ? void 0 : _provider$models[0]) !== null && _provider$models$ !== void 0 ? _provider$models$ : '',
apiKey: '',
encryptedApiKey: '',
providerId: provider.id
});
});
setSelectedProvider(_objectSpread(_objectSpread({}, provider), {}, {
name: provider.id === 'custom' ? undefined : provider.name
}));
};
var handleBack = function handleBack() {
if (step === STEPS.BASIC_INFO) {
onClose();
} else {
setStep(function (prev) {
return prev - 1;
});
}
};
/**
* Handles the Next button click.
* @param {Function} onSubmit - Async function to execute on the final step (Create/Edit).
*/
var handleNext = /*#__PURE__*/function () {
var _ref2 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee(onSubmit) {
return _regenerator.default.wrap(function _callee$(_context) {
while (1) {
switch (_context.prev = _context.next) {
case 0:
_context.prev = 0;
if (!canSubmit) {
_context.next = 7;
break;
}
_context.next = 4;
return onSubmit(formData);
case 4:
onClose();
_context.next = 8;
break;
case 7:
setStep(function (prev) {
return prev + 1;
});
case 8:
_context.next = 14;
break;
case 10:
_context.prev = 10;
_context.t0 = _context["catch"](0);
log.error('Error in handleNext:', _context.t0);
showAlert({
message: t('assistant.default_error'),
severity: 'error'
});
case 14:
case "end":
return _context.stop();
}
}
}, _callee, null, [[0, 10]]);
}));
return function handleNext(_x) {
return _ref2.apply(this, arguments);
};
}();
var isNextDisabled = function isNextDisabled(isAllowToSkipApiKey) {
var _formData$name;
switch (step) {
case STEPS.BASIC_INFO:
return !((_formData$name = formData.name) !== null && _formData$name !== void 0 && _formData$name.trim());
case STEPS.MODEL_SELECTION:
return !selectedProvider;
case STEPS.API_KEY:
{
var _formData$apiKey, _formData$model, _formData$baseUrl;
var isCustom = (selectedProvider === null || selectedProvider === void 0 ? void 0 : selectedProvider.id) === 'custom';
var apiKeyMissing = !((_formData$apiKey = formData.apiKey) !== null && _formData$apiKey !== void 0 && _formData$apiKey.trim()) && !isAllowToSkipApiKey;
var modelMissing = !((_formData$model = formData.model) !== null && _formData$model !== void 0 && _formData$model.trim());
var baseUrlMissing = isCustom && !((_formData$baseUrl = formData.baseUrl) !== null && _formData$baseUrl !== void 0 && _formData$baseUrl.trim());
var modelUnsupported = (0, _helpers.checkIfModelUnsupported)(selectedProvider, formData.model);
return apiKeyMissing || modelMissing || baseUrlMissing || modelUnsupported;
}
default:
return false;
}
};
return {
step: step,
setStep: setStep,
formData: formData,
setFormData: setFormData,
selectedProvider: selectedProvider,
setSelectedProvider: setSelectedProvider,
handleChange: handleChange,
handleAvatarChange: handleAvatarChange,
handleProviderSelection: handleProviderSelection,
handleBack: handleBack,
handleNext: handleNext,
isNextDisabled: isNextDisabled,
handleChangeModel: handleChangeModel,
canSubmit: canSubmit
};
};
exports.useAssistantDialog = useAssistantDialog;