[ES|QL] Small changes before GA (elastic#181653)

## Summary Closes elastic#181551 Changes the icon / button bg when the user has changed the query but not submitted. <img width="389" alt="image" src="https://github.com/elastic/kibana/assets/17003240/ee583a30-402d-4c86-8cf2-bb4ad4d20e10"> It also slightly changes the advanced setting description. <img width="1181" alt="image" src="https://github.com/elastic/kibana/assets/17003240/78566b1c-fc6e-4652-9c4c-5b91d81b1f6a">
fkanout · Apr 26, 2024 · 2654a61 · 2654a61
1 parent 3f8cd57
commit 2654a61
Show file tree

Hide file tree

Showing 6 changed files with 19 additions and 9 deletions.
diff --git a/packages/kbn-text-based-editor/src/editor_footer.tsx b/packages/kbn-text-based-editor/src/editor_footer.tsx
@@ -118,6 +118,7 @@ interface EditorFooterProps {
   hideQueryHistory?: boolean;
   refetchHistoryItems?: boolean;
   isInCompactMode?: boolean;
+  queryHasChanged?: boolean;
 }
 
 export const EditorFooter = memo(function EditorFooter({
@@ -142,6 +143,7 @@ export const EditorFooter = memo(function EditorFooter({
   hideQueryHistory,
   refetchHistoryItems,
   isInCompactMode,
+  queryHasChanged,
 }: EditorFooterProps) {
   const { euiTheme } = useEuiTheme();
   const [isErrorPopoverOpen, setIsErrorPopoverOpen] = useState(false);
@@ -329,9 +331,15 @@ export const EditorFooter = memo(function EditorFooter({
                     >
                       <EuiButtonIcon
                         display="base"
-                        color="primary"
+                        color={queryHasChanged ? 'success' : 'primary'}
                         onClick={runQuery}
-                        iconType={allowQueryCancellation && isLoading ? 'cross' : 'refresh'}
+                        iconType={
+                          allowQueryCancellation && isLoading
+                            ? 'cross'
+                            : queryHasChanged
+                            ? 'play'
+                            : 'refresh'
+                        }
                         size="s"
                         isLoading={isLoading && !allowQueryCancellation}
                         isDisabled={Boolean(disableSubmitAction && !allowQueryCancellation)}

diff --git a/packages/kbn-text-based-editor/src/text_based_languages_editor.tsx b/packages/kbn-text-based-editor/src/text_based_languages_editor.tsx
@@ -967,6 +967,7 @@ export const TextBasedLanguagesEditor = memo(function TextBasedLanguagesEditor({
                         hideQueryHistory={hideHistoryComponent}
                         refetchHistoryItems={refetchHistoryItems}
                         isInCompactMode={true}
+                        queryHasChanged={code !== codeWhenSubmitted}
                       />
                     )}
                   </div>
@@ -1065,6 +1066,7 @@ export const TextBasedLanguagesEditor = memo(function TextBasedLanguagesEditor({
           containerWidth={editorWidth}
           hideQueryHistory={hideHistoryComponent}
           refetchHistoryItems={refetchHistoryItems}
+          queryHasChanged={code !== codeWhenSubmitted}
         />
       )}
       {isCodeEditorExpanded && (

diff --git a/packages/shared-ux/prompt/no_data_views/impl/src/actions.tsx b/packages/shared-ux/prompt/no_data_views/impl/src/actions.tsx
@@ -49,7 +49,7 @@ export const NoDataButtonLink = ({
         <EuiText size="xs" color={'subdued'}>
           <FormattedMessage
             id="sharedUXPackages.no_data_views.esqlMessage"
-            defaultMessage="Alternatively, you can query your data directly using ES|QL (technical preview). {docsLink}"
+            defaultMessage="Alternatively, you can query your data directly using ES|QL. {docsLink}"
             values={{
               docsLink: esqlDocLink && (
                 <EuiLink href={esqlDocLink} target="_blank">
@@ -65,7 +65,7 @@ export const NoDataButtonLink = ({
           <EuiButton color="success" onClick={onTryESQL} size="s" data-test-subj="tryESQLLink">
             <FormattedMessage
               id="sharedUXPackages.no_data_views.esqlButtonLabel"
-              defaultMessage="Try ES|QL"
+              defaultMessage="Language: ES|QL"
             />
           </EuiButton>
         </EuiText>

diff --git a/src/plugins/discover/server/ui_settings.ts b/src/plugins/discover/server/ui_settings.ts
@@ -317,12 +317,12 @@ export const getUiSettings: (
     value: true,
     description: i18n.translate('discover.advancedSettings.enableESQLDescription', {
       defaultMessage:
-        'This setting enables ES|QL in Discover. If you have feedback on this experience please reach out to us on {link}',
+        'This setting enables ES|QL in Kibana. By switching it off you will hide the ES|QL user interface from various applications. However, users will be able to access existing ES|QL saved searches, visualizations, etc. If you have feedback on this experience please reach out to us on {link}',
       values: {
         link:
-          `<a href="https://discuss.elastic.co/c/elastic-stack/kibana" target="_blank" rel="noopener">` +
+          `<a href="https://ela.st/esql-feedback" target="_blank" rel="noopener">` +
           i18n.translate('discover.advancedSettings.enableESQL.discussLinkText', {
-            defaultMessage: 'discuss.elastic.co/c/elastic-stack/kibana',
+            defaultMessage: 'https://ela.st/esql-feedback',
           }) +
           '</a>',
       },

diff --git a/src/plugins/unified_search/public/dataview_picker/change_dataview.tsx b/src/plugins/unified_search/public/dataview_picker/change_dataview.tsx
@@ -358,7 +358,7 @@ export function ChangeDataView({
             }}
           >
             {i18n.translate('unifiedSearch.query.queryBar.textBasedLanguagesTryLabel', {
-              defaultMessage: 'Try ES|QL',
+              defaultMessage: 'Language: ES|QL',
             })}
           </EuiButton>
         </EuiPanel>

diff --git a/...observability_solution/logs_explorer/public/components/data_source_selector/constants.tsx b/...observability_solution/logs_explorer/public/components/data_source_selector/constants.tsx
@@ -88,7 +88,7 @@ export const noDataRetryLabel = i18n.translate(
 );
 
 export const tryEsql = i18n.translate('xpack.logsExplorer.dataSourceSelector.TryEsql', {
-  defaultMessage: 'Try ES|QL',
+  defaultMessage: 'Language: ES|QL',
 });
 
 export const technicalPreview = i18n.translate('xpack.logsExplorer.TechPreview', {