"use strict"; var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault"); Object.defineProperty(exports, "__esModule", { value: true }); exports.InitialSetupPanel = InitialSetupPanel; var _react = _interopRequireDefault(require("react")); var _eui = require("@elastic/eui"); var _i18n = require("@kbn/i18n"); var _connector_selector_base = require("../connector_selector/connector_selector_base"); var _experimental_feature_banner = require("./experimental_feature_banner"); /* * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one * or more contributor license agreements. Licensed under the Elastic License * 2.0; you may not use this file except in compliance with the Elastic License * 2.0. */ function InitialSetupPanel({ connectors, connectorsManagementHref, knowledgeBase, startedFrom }) { var _knowledgeBase$status, _knowledgeBase$status2, _connectors$connector, _connectors$connector2; return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_experimental_feature_banner.ExperimentalFeatureBanner, null), /*#__PURE__*/_react.default.createElement(_eui.EuiPanel, { paddingSize: "m", style: { overflowY: 'auto' } }, /*#__PURE__*/_react.default.createElement(_eui.EuiSpacer, { size: "s" }), /*#__PURE__*/_react.default.createElement(_eui.EuiText, { color: "subdued", size: "s" }, /*#__PURE__*/_react.default.createElement("p", null, _i18n.i18n.translate('xpack.observabilityAiAssistant.initialSetupPanel.title', { defaultMessage: 'Start your Al experience with Elastic by completing the steps below.' }))), /*#__PURE__*/_react.default.createElement(_eui.EuiSpacer, { size: "l" }), /*#__PURE__*/_react.default.createElement(_eui.EuiFlexGroup, { direction: startedFrom === 'conversationView' ? 'row' : 'column' }, /*#__PURE__*/_react.default.createElement(_eui.EuiFlexItem, null, /*#__PURE__*/_react.default.createElement(_eui.EuiCard, { icon: /*#__PURE__*/_react.default.createElement(_eui.EuiIcon, { type: "machineLearningApp", size: "xl" }), title: _i18n.i18n.translate('xpack.observabilityAiAssistant.initialSetupPanel.knowledgeBase.title', { defaultMessage: 'Knowledge Base' }), description: /*#__PURE__*/_react.default.createElement(_eui.EuiText, { size: "s" }, /*#__PURE__*/_react.default.createElement("p", null, _i18n.i18n.translate('xpack.observabilityAiAssistant.initialSetupPanel.knowledgeBase.description.paragraph1', { defaultMessage: 'We recommend you enable the knowledge base for a better experience. It will provide the assistant with the ability to learn from your interaction with it.' })), /*#__PURE__*/_react.default.createElement("p", null, _i18n.i18n.translate('xpack.observabilityAiAssistant.initialSetupPanel.knowledgeBase.description.paragraph2', { defaultMessage: 'This step is optional, you can always do it later.' }))), footer: (_knowledgeBase$status = knowledgeBase.status.value) !== null && _knowledgeBase$status !== void 0 && _knowledgeBase$status.ready ? /*#__PURE__*/_react.default.createElement(_eui.EuiCallOut, { color: "success", iconType: "checkInCircleFilled", size: "s", style: { padding: '10px 14px', display: 'inline-flex', borderRadius: '6px' }, title: _i18n.i18n.translate('xpack.observabilityAiAssistant.initialSetupPanel.knowledgeBase.buttonLabel.alreadyInstalled', { defaultMessage: 'Knowledge base installed' }) }) : /*#__PURE__*/_react.default.createElement(_eui.EuiButton, { "data-test-subj": "observabilityAiAssistantInitialSetupPanelButton", color: (_knowledgeBase$status2 = knowledgeBase.status.value) !== null && _knowledgeBase$status2 !== void 0 && _knowledgeBase$status2.ready ? 'success' : 'primary', fill: true, isLoading: knowledgeBase.isInstalling || knowledgeBase.status.loading, onClick: knowledgeBase.install, iconType: "dotInCircle" }, knowledgeBase.isInstalling || knowledgeBase.status.loading ? _i18n.i18n.translate('xpack.observabilityAiAssistant.initialSetupPanel.knowledgeBase.buttonLabel.installingKb', { defaultMessage: 'Installing knowledge base' }) : _i18n.i18n.translate('xpack.observabilityAiAssistant.initialSetupPanel.knowledgeBase.buttonLabel.kbNotInstalledYet', { defaultMessage: 'Set up knowledge base' })) })), /*#__PURE__*/_react.default.createElement(_eui.EuiFlexItem, null, /*#__PURE__*/_react.default.createElement(_eui.EuiCard, { icon: /*#__PURE__*/_react.default.createElement(_eui.EuiIcon, { type: "devToolsApp", size: "xl" }), title: _i18n.i18n.translate('xpack.observabilityAiAssistant.initialSetupPanel.setupConnector.title', { defaultMessage: 'Connector setup' }), description: !((_connectors$connector = connectors.connectors) !== null && _connectors$connector !== void 0 && _connectors$connector.length) ? /*#__PURE__*/_react.default.createElement(_eui.EuiText, { size: "s" }, /*#__PURE__*/_react.default.createElement("p", null, _i18n.i18n.translate('xpack.observabilityAiAssistant.initialSetupPanel.setupConnector.description1', { defaultMessage: 'Set up a Generative AI connector with your AI provider.' })), /*#__PURE__*/_react.default.createElement("p", null, _i18n.i18n.translate('xpack.observabilityAiAssistant.initialSetupPanel.setupConnector.description2', { defaultMessage: 'The Generative AI model needs to support function calls. We strongly recommend using GPT4.' }), /*#__PURE__*/_react.default.createElement(_eui.EuiBetaBadge, { label: "", css: { boxShadow: 'none' }, tooltipContent: _i18n.i18n.translate('xpack.observabilityAiAssistant.technicalPreviewBadgeDescription', { defaultMessage: "GPT4 is required for a more consistent experience when using function calls (for example when performing root cause analysis, visualizing data and more). GPT3.5 can work for some of the simpler workflows, such as explaining errors or for a ChatGPT like experience within Kibana which don't require the use of frequent function calls." }), iconType: "iInCircle", size: "s" }))) : connectors.connectors.length && !connectors.selectedConnector ? /*#__PURE__*/_react.default.createElement(_eui.EuiText, { size: "s" }, /*#__PURE__*/_react.default.createElement("p", null, _i18n.i18n.translate('xpack.observabilityAiAssistant.initialSetupPanel.setupConnector.description', { defaultMessage: 'Please select a provider.' }))) : '', footer: !((_connectors$connector2 = connectors.connectors) !== null && _connectors$connector2 !== void 0 && _connectors$connector2.length) ? /*#__PURE__*/_react.default.createElement(_eui.EuiButton, { "data-test-subj": "observabilityAiAssistantInitialSetupPanelSetUpGenerativeAiConnectorButton", fill: true, color: "primary", href: connectorsManagementHref }, _i18n.i18n.translate('xpack.observabilityAiAssistant.initialSetupPanel.setupConnector.buttonLabel', { defaultMessage: 'Set up Generative AI connector' })) : connectors.connectors.length && !connectors.selectedConnector ? /*#__PURE__*/_react.default.createElement(_connector_selector_base.ConnectorSelectorBase, connectors) : null }))), /*#__PURE__*/_react.default.createElement(_eui.EuiSpacer, { size: "xxl" }), /*#__PURE__*/_react.default.createElement(_eui.EuiText, { color: "subdued", size: "s" }, /*#__PURE__*/_react.default.createElement("p", null, _i18n.i18n.translate('xpack.observabilityAiAssistant.initialSetupPanel.disclaimer', { defaultMessage: 'The AI provider that is configured may collect telemetry when using the Elastic AI Assistant. Contact your AI provider for information on how data is collected.' }))))); }