cozy-search
Version:
UI components about search bar and IA assistant
247 lines (200 loc) • 12.9 kB
JavaScript
"use strict";
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = void 0;
var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
var _twakeIcons = require("@linagora/twake-icons");
var _react = _interopRequireWildcard(require("react"));
var _cozyClient = require("cozy-client");
var _assistant = require("cozy-client/dist/models/assistant");
var _Buttons = _interopRequireDefault(require("cozy-ui/transpiled/react/Buttons"));
var _Dialog = _interopRequireWildcard(require("cozy-ui/transpiled/react/Dialog"));
var _IconButton = _interopRequireDefault(require("cozy-ui/transpiled/react/IconButton"));
var _Alert = require("cozy-ui/transpiled/react/providers/Alert");
var _Breakpoints = require("cozy-ui/transpiled/react/providers/Breakpoints");
var _twakeI18n = require("twake-i18n");
var _locales = require("../../locales");
var _AssistantProvider = require("../AssistantProvider");
var _AssistantDialogContent = _interopRequireDefault(require("../CreateAssistantSteps/AssistantDialogContent"));
var _helpers = require("../CreateAssistantSteps/helpers");
var _useAssistantDialog2 = require("../CreateAssistantSteps/useAssistantDialog");
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
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 styles = {
"BasicInfoStep": "styles__BasicInfoStep___2r0eM",
"avatar-container": "styles__avatar-container___kJ_64",
"avatar-image": "styles__avatar-image___2Mkxj",
"file-input": "styles__file-input___2fB5n",
"ModelSelectionStep": "styles__ModelSelectionStep___1auXB",
"grid-container": "styles__grid-container___3wOus",
"grid-container--mobile": "styles__grid-container--mobile___uCAg1",
"model-card": "styles__model-card___fbAqF",
"model-card--selected": "styles__model-card--selected___3hKq3",
"model-card--openrag--light": "styles__model-card--openrag--light___1vabR",
"model-card--openrag--dark": "styles__model-card--openrag--dark___1x0sK",
"icon-container": "styles__icon-container___1vaTp",
"icon-container--google": "styles__icon-container--google___3gtC7",
"icon-container--custom": "styles__icon-container--custom___1_EFK",
"icon-container--openai": "styles__icon-container--openai___3DsoO",
"check-icon": "styles__check-icon___3uPUk",
"CreateAssistantDialog": "styles__CreateAssistantDialog___1dSe_",
"close-button": "styles__close-button___3jc_w"
};
var EditAssistantDialog = function EditAssistantDialog(_ref) {
var open = _ref.open,
onClose = _ref.onClose;
(0, _twakeI18n.useExtendI18n)(_locales.locales);
var _useI18n = (0, _twakeI18n.useI18n)(),
t = _useI18n.t;
var client = (0, _cozyClient.useClient)();
var _useAssistant = (0, _AssistantProvider.useAssistant)(),
assistantIdInAction = _useAssistant.assistantIdInAction,
setSelectedAssistantId = _useAssistant.setSelectedAssistantId;
var _useAlert = (0, _Alert.useAlert)(),
showAlert = _useAlert.showAlert;
var _useBreakpoints = (0, _Breakpoints.useBreakpoints)(),
isMobile = _useBreakpoints.isMobile;
var _useAssistantDialog = (0, _useAssistantDialog2.useAssistantDialog)({
onClose: onClose
}),
step = _useAssistantDialog.step,
formData = _useAssistantDialog.formData,
selectedProvider = _useAssistantDialog.selectedProvider,
canSubmit = _useAssistantDialog.canSubmit,
setFormData = _useAssistantDialog.setFormData,
setSelectedProvider = _useAssistantDialog.setSelectedProvider,
handleBack = _useAssistantDialog.handleBack,
handleNext = _useAssistantDialog.handleNext,
handleChange = _useAssistantDialog.handleChange,
handleProviderSelection = _useAssistantDialog.handleProviderSelection,
handleAvatarChange = _useAssistantDialog.handleAvatarChange,
isNextDisabled = _useAssistantDialog.isNextDisabled,
handleChangeModel = _useAssistantDialog.handleChangeModel;
(0, _react.useEffect)(function () {
if (!open || !assistantIdInAction) return;
var fetchAssistant = /*#__PURE__*/function () {
var _ref2 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee() {
var _assistant$relationsh, _assistant$relationsh2, _assistant$relationsh3, _assistant$relationsh4, _provider$auth, _provider$data, _provider$auth2, _provider$auth3, _provider$auth4, _provider$data2, _provider$auth5;
var response, assistant, provider, providerId, selectProviderDefault;
return _regenerator.default.wrap(function _callee$(_context) {
while (1) {
switch (_context.prev = _context.next) {
case 0:
_context.next = 2;
return client.query((0, _cozyClient.Q)('io.cozy.ai.chat.assistants').getById(assistantIdInAction).include(['provider']));
case 2:
response = _context.sent;
assistant = response.data;
provider = response.included[0];
providerId = assistant === null || assistant === void 0 ? void 0 : (_assistant$relationsh = assistant.relationships) === null || _assistant$relationsh === void 0 ? void 0 : (_assistant$relationsh2 = _assistant$relationsh.provider) === null || _assistant$relationsh2 === void 0 ? void 0 : (_assistant$relationsh3 = _assistant$relationsh2.data) === null || _assistant$relationsh3 === void 0 ? void 0 : (_assistant$relationsh4 = _assistant$relationsh3.metadata) === null || _assistant$relationsh4 === void 0 ? void 0 : _assistant$relationsh4.providerId;
setFormData({
name: assistant.name || '',
description: assistant.prompt || '',
icon: assistant.icon || '',
model: (provider === null || provider === void 0 ? void 0 : (_provider$auth = provider.auth) === null || _provider$auth === void 0 ? void 0 : _provider$auth.login) || '',
baseUrl: (provider === null || provider === void 0 ? void 0 : (_provider$data = provider.data) === null || _provider$data === void 0 ? void 0 : _provider$data.baseUrl) || '',
apiKey: (provider === null || provider === void 0 ? void 0 : (_provider$auth2 = provider.auth) === null || _provider$auth2 === void 0 ? void 0 : _provider$auth2.apiKey) || '',
encryptedApiKey: (provider === null || provider === void 0 ? void 0 : (_provider$auth3 = provider.auth) === null || _provider$auth3 === void 0 ? void 0 : _provider$auth3.credentials_encrypted) || '',
providerId: providerId
});
selectProviderDefault = (0, _helpers.getSelectedProviderById)(providerId);
setSelectedProvider(_objectSpread(_objectSpread({}, selectProviderDefault), {}, {
model: provider === null || provider === void 0 ? void 0 : (_provider$auth4 = provider.auth) === null || _provider$auth4 === void 0 ? void 0 : _provider$auth4.login,
baseUrl: provider === null || provider === void 0 ? void 0 : (_provider$data2 = provider.data) === null || _provider$data2 === void 0 ? void 0 : _provider$data2.baseUrl,
name: selectProviderDefault.id === 'custom' ? provider === null || provider === void 0 ? void 0 : (_provider$auth5 = provider.auth) === null || _provider$auth5 === void 0 ? void 0 : _provider$auth5.login : selectProviderDefault.name
}));
case 9:
case "end":
return _context.stop();
}
}
}, _callee);
}));
return function fetchAssistant() {
return _ref2.apply(this, arguments);
};
}();
fetchAssistant();
}, [client, assistantIdInAction, open, setFormData, setSelectedProvider]);
var getTitle = function getTitle() {
if (step === _useAssistantDialog2.STEPS.API_KEY) {
return t('assistant_edit.configure_api_key_title');
}
return t('assistant_edit.title');
};
var onSubmit = /*#__PURE__*/function () {
var _ref3 = (0, _asyncToGenerator2.default)( /*#__PURE__*/_regenerator.default.mark(function _callee2() {
return _regenerator.default.wrap(function _callee2$(_context2) {
while (1) {
switch (_context2.prev = _context2.next) {
case 0:
_context2.next = 2;
return (0, _assistant.editAssistant)(client, assistantIdInAction, {
name: formData.name,
prompt: formData.description,
icon: formData.icon,
model: formData.model,
apiKey: formData.apiKey,
baseUrl: formData.baseUrl,
providerId: selectedProvider.id
});
case 2:
setSelectedAssistantId(assistantIdInAction);
showAlert({
message: t('assistant_edit.success'),
severity: 'success'
});
case 4:
case "end":
return _context2.stop();
}
}
}, _callee2);
}));
return function onSubmit() {
return _ref3.apply(this, arguments);
};
}();
return /*#__PURE__*/_react.default.createElement(_Dialog.default, {
open: open,
onClose: onClose,
maxWidth: "lg",
fullScreen: !!isMobile,
className: styles.CreateAssistantDialog
}, /*#__PURE__*/_react.default.createElement(_Dialog.DialogTitle, {
disableTypography: true
}, getTitle()), /*#__PURE__*/_react.default.createElement(_IconButton.default, {
"aria-label": t('assistant.dialog.close'),
onClick: onClose,
className: styles['close-button']
}, /*#__PURE__*/_react.default.createElement(_twakeIcons.Icon, {
icon: _twakeIcons.Cross
})), /*#__PURE__*/_react.default.createElement(_Dialog.DialogContent, null, /*#__PURE__*/_react.default.createElement(_AssistantDialogContent.default, {
step: step,
formData: formData,
selectedProvider: selectedProvider,
onChange: handleChange,
onAvatarChange: handleAvatarChange,
onProviderSelect: handleProviderSelection,
onModelSelect: handleChangeModel
})), /*#__PURE__*/_react.default.createElement(_Dialog.DialogActions, null, /*#__PURE__*/_react.default.createElement(_Buttons.default, {
variant: "secondary",
onClick: handleBack,
label: t('assistant_edit.buttons.cancel')
}), /*#__PURE__*/_react.default.createElement(_Buttons.default, {
variant: "primary",
onClick: function onClick() {
return handleNext(onSubmit);
},
disabled: isNextDisabled(!!formData.encryptedApiKey),
label: canSubmit ? t('assistant_edit.buttons.edit') : t('assistant_edit.buttons.next')
})));
};
var _default = EditAssistantDialog;
exports.default = _default;