[Manual backport 2.x] [Discover]Sample Queries and Saved Queries in No Results Page #8616

changelogs/fragments/8616.yml

@@ -0,0 +1,2 @@
+feat:
+- Adds sample queries and saved queries to Discover no results page ([#8616](https://github.com/opensearch-project/OpenSearch-Dashboards/pull/8616))

changelogs/fragments/8651.yml

@@ -0,0 +1,2 @@
+feat:
+- Update the appearance of Discover ([#8651](https://github.com/opensearch-project/OpenSearch-Dashboards/pull/8651))

src/core/public/chrome/ui/header/collapsible_nav_group_enabled.scss

@@ -1,9 +1,9 @@
 .context-nav-wrapper {
   border: none !important;
   border-top-right-radius: $euiSizeL;
-  border-bottom-right-radius: $euiSizeL;
   background-color: $euiSideNavBackgroundColor;
   overflow: hidden;
+  box-shadow: 1px 0 0 $euiBorderColor !important;
 
   .nav-link-item {
     padding: $euiSizeS;

src/plugins/data/common/index_patterns/index_patterns/ensure_default_index_pattern.ts

@@ -32,7 +32,9 @@
 import { IndexPatternsContract } from './index_patterns';
 import { UiSettingsCommon } from '../types';
 
-export type EnsureDefaultIndexPattern = () => Promise<unknown> | undefined;
+export type EnsureDefaultIndexPattern = (
+  shouldRedirect?: boolean
+) => Promise<unknown | void> | undefined;
 
 export const createEnsureDefaultIndexPattern = (
   uiSettings: UiSettingsCommon,
@@ -42,7 +44,10 @@
    * Checks whether a default index pattern is set and exists and defines
    * one otherwise.
    */
-  return async function ensureDefaultIndexPattern(this: IndexPatternsContract) {
+  return async function ensureDefaultIndexPattern(
+    this: IndexPatternsContract,
+    shouldRedirect: boolean = true
+  ) {
     const patterns = await this.getIds();
     let defaultId = await uiSettings.get('defaultIndex');
     let defined = !!defaultId;
@@ -62,7 +67,8 @@
       defaultId = patterns[0];
       await uiSettings.set('defaultIndex', defaultId);
     } else {
-      return onRedirectNoIndexPattern();
+      if (shouldRedirect) return onRedirectNoIndexPattern();
+      else return;
     }
   };
 };

src/plugins/data/public/index.ts

@@ -62,7 +62,16 @@ import {
 } from '../common';
 
 import { FilterLabel } from './ui';
-export { createEditor, DefaultInput, DQLBody, SingleLineInput } from './ui';
+export {
+  createEditor,
+  DefaultInput,
+  DQLBody,
+  SingleLineInput,
+  DatasetSelector,
+  AdvancedSelector,
+  NoIndexPatternsPanel,
+  DatasetSelectorAppearance,
+} from './ui';
 
 import {
   generateFilters,

src/plugins/data/public/query/query_string/dataset_service/dataset_service.ts

@@ -207,6 +207,11 @@
     return Number(this.sessionStorage.get('lastCacheTime')) || undefined;
   }
 
+  public removeFromRecentDatasets(datasetId: string): void {
+    this.recentDatasets.del(datasetId);
+    this.serializeRecentDatasets();
+  }
+
   private setLastCacheTime(time: number): void {
     this.sessionStorage.set('lastCacheTime', time);
   }

src/plugins/data/public/query/query_string/dataset_service/lib/index_pattern_type.ts

@@ -4,6 +4,7 @@
  */
 
 import { SavedObjectsClientContract } from 'opensearch-dashboards/public';
+import { i18n } from '@osd/i18n';
 import { DataSourceAttributes } from '../../../../../../data_source/common/data_sources';
 import {
   DEFAULT_DATA,
@@ -70,6 +71,29 @@
     }
     return ['kuery', 'lucene', 'PPL', 'SQL'];
   },
+
+  getSampleQueries: (dataset: Dataset, language: string) => {
+    switch (language) {
+      case 'PPL':
+        return [
+          {
+            title: i18n.translate('data.indexPatternType.sampleQuery.basicPPLQuery', {
+              defaultMessage: 'Sample query for PPL',
+            }),
+            query: `source = ${dataset.title}`,
+          },
+        ];
+      case 'SQL':
+        return [
+          {
+            title: i18n.translate('data.indexPatternType.sampleQuery.basicSQLQuery', {
+              defaultMessage: 'Sample query for SQL',
+            }),
+            query: `SELECT * FROM ${dataset.title} LIMIT 10`,
+          },
+        ];
+    }
+  },
 };
 
 const fetchIndexPatterns = async (client: SavedObjectsClientContract): Promise<DataStructure[]> => {

src/plugins/data/public/query/query_string/dataset_service/lib/index_type.ts

@@ -5,6 +5,7 @@
 
 import { SavedObjectsClientContract } from 'opensearch-dashboards/public';
 import { map } from 'rxjs/operators';
+import { i18n } from '@osd/i18n';
 import {
   DEFAULT_DATA,
   DataStructure,
@@ -88,6 +89,29 @@
   supportedLanguages: (dataset: Dataset): string[] => {
     return ['SQL', 'PPL'];
   },
+
+  getSampleQueries: (dataset: Dataset, language: string) => {
+    switch (language) {
+      case 'PPL':
+        return [
+          {
+            title: i18n.translate('data.indexType.sampleQuery.basicPPLQuery', {
+              defaultMessage: 'Sample query for PPL',
+            }),
+            query: `source = ${dataset.title}`,
+          },
+        ];
+      case 'SQL':
+        return [
+          {
+            title: i18n.translate('data.indexType.sampleQuery.basicSQLQuery', {
+              defaultMessage: 'Sample query for SQL',
+            }),
+            query: `SELECT * FROM ${dataset.title} LIMIT 10`,
+          },
+        ];
+    }
+  },
 };
 
 const fetchDataSources = async (client: SavedObjectsClientContract) => {

src/plugins/data/public/query/query_string/dataset_service/types.ts

@@ -71,4 +71,8 @@ export interface DatasetTypeConfig {
    * @see https://github.com/opensearch-project/OpenSearch-Dashboards/issues/8362.
    */
   combineDataStructures?: (dataStructures: DataStructure[]) => DataStructure | undefined;
+  /**
+   * Returns a list of sample queries for this dataset type
+   */
+  getSampleQueries?: (dataset: Dataset, language: string) => any;
 }

src/plugins/data/public/query/query_string/language_service/lib/dql_language.ts

@@ -3,6 +3,7 @@
  * SPDX-License-Identifier: Apache-2.0
  */
 
+import { i18n } from '@osd/i18n';
 import { LanguageConfig } from '../types';
 import { ISearchInterceptor } from '../../../../search';
 
@@ -25,5 +26,51 @@ export const getDQLLanguageConfig = (
     showDocLinks: true,
     editorSupportedAppNames: ['discover'],
     supportedAppNames: ['discover', 'dashboards', 'visualize', 'data-explorer', 'vis-builder', '*'],
+    sampleQueries: [
+      {
+        title: i18n.translate('data.dqlLanguage.sampleQuery.titleContainsWind', {
+          defaultMessage: 'The title field contains the word wind.',
+        }),
+        query: 'title: wind',
+      },
+      {
+        title: i18n.translate('data.dqlLanguage.sampleQuery.titleContainsWindOrWindy', {
+          defaultMessage: 'The title field contains the word wind or the word windy.',
+        }),
+        query: 'title: (wind OR windy)',
+      },
+      {
+        title: i18n.translate('data.dqlLanguage.sampleQuery.titleContainsPhraseWindRises', {
+          defaultMessage: 'The title field contains the phrase wind rises.',
+        }),
+        query: 'title: "wind rises"',
+      },
+      {
+        title: i18n.translate('data.dqlLanguage.sampleQuery.titleKeywordExactMatch', {
+          defaultMessage: 'The title.keyword field exactly matches The wind rises.',
+        }),
+        query: 'title.keyword: The wind rises',
+      },
+      {
+        title: i18n.translate('data.dqlLanguage.sampleQuery.titleFieldsContainWind', {
+          defaultMessage:
+            'Any field that starts with title (for example, title and title.keyword) contains the word wind',
+        }),
+        query: 'title*: wind',
+      },
+      {
+        title: i18n.translate('data.dqlLanguage.sampleQuery.articleTitleContainsWind', {
+          defaultMessage:
+            'The field that starts with article and ends with title contains the word wind. Matches the field article title.',
+        }),
+        query: 'article*title: wind',
+      },
+      {
+        title: i18n.translate('data.dqlLanguage.sampleQuery.descriptionFieldExists', {
+          defaultMessage: 'Documents in which the field description exists.',
+        }),
+        query: 'description:*',
+      },
+    ],
   };
 };

src/plugins/data/public/query/query_string/language_service/lib/lucene_language.ts

@@ -3,6 +3,7 @@
  * SPDX-License-Identifier: Apache-2.0
  */
 
+import { i18n } from '@osd/i18n';
 import { LanguageConfig } from '../types';
 import { ISearchInterceptor } from '../../../../search';
 
@@ -25,5 +26,51 @@ export const getLuceneLanguageConfig = (
     showDocLinks: true,
     editorSupportedAppNames: ['discover'],
     supportedAppNames: ['discover', 'dashboards', 'visualize', 'data-explorer', 'vis-builder', '*'],
+    sampleQueries: [
+      {
+        title: i18n.translate('data.luceneLanguage.sampleQuery.titleContainsWind', {
+          defaultMessage: 'The title field contains the word wind.',
+        }),
+        query: 'title: wind',
+      },
+      {
+        title: i18n.translate('data.luceneLanguage.sampleQuery.titleContainsWindOrWindy', {
+          defaultMessage: 'The title field contains the word wind or the word windy.',
+        }),
+        query: 'title: (wind OR windy)',
+      },
+      {
+        title: i18n.translate('data.luceneLanguage.sampleQuery.titleContainsPhraseWindRises', {
+          defaultMessage: 'The title field contains the phrase wind rises.',
+        }),
+        query: 'title: "wind rises"',
+      },
+      {
+        title: i18n.translate('data.luceneLanguage.sampleQuery.titleKeywordExactMatch', {
+          defaultMessage: 'The title.keyword field exactly matches The wind rises.',
+        }),
+        query: 'title.keyword: The wind rises',
+      },
+      {
+        title: i18n.translate('data.luceneLanguage.sampleQuery.titleFieldsContainWind', {
+          defaultMessage:
+            'Any field that starts with title (for example, title and title.keyword) contains the word wind',
+        }),
+        query: 'title*: wind',
+      },
+      {
+        title: i18n.translate('data.luceneLanguage.sampleQuery.articleTitleContainsWind', {
+          defaultMessage:
+            'The field that starts with article and ends with title contains the word wind. Matches the field article title.',
+        }),
+        query: 'article*title: wind',
+      },
+      {
+        title: i18n.translate('data.luceneLanguage.sampleQuery.descriptionFieldExists', {
+          defaultMessage: 'Documents in which the field description exists.',
+        }),
+        query: 'description:*',
+      },
+    ],
   };
 };

src/plugins/data/public/query/query_string/language_service/types.ts

@@ -35,6 +35,11 @@ export interface EditorEnhancements {
   queryEditorExtension?: QueryEditorExtensionConfig;
 }
 
+export interface SampleQuery {
+  title: string;
+  query: string;
+}
+
 export interface LanguageConfig {
   id: string;
   title: string;
@@ -53,4 +58,5 @@ export interface LanguageConfig {
   editorSupportedAppNames?: string[];
   supportedAppNames?: string[];
   hideDatePicker?: boolean;
+  sampleQueries?: SampleQuery[];
 }

src/plugins/data/public/ui/_common.scss

@@ -0,0 +1,16 @@
+/*
+ * Copyright OpenSearch Contributors
+ * SPDX-License-Identifier: Apache-2.0
+ */
+
+.dataUI-centerPanel {
+  height: 100%;
+  width: 100%;
+
+  // Push the centralized child up, just like ouiOverlayMask
+  padding-bottom: 10vh;
+
+  & > * {
+    @include euiLegibilityMaxWidth(100%);
+  }
+}

src/plugins/data/public/ui/_index.scss

@@ -1,3 +1,4 @@
+@import "./common";
 @import "./filter_bar/index";
 @import "./typeahead/index";
 @import "./saved_query_management/index";

src/plugins/data/public/ui/dataset_selector/_dataset_selector.scss

@@ -19,7 +19,9 @@
   &__advancedModal {
     width: 1200px;
     height: 800px;
-    max-height: calc(100vh - $euiSizeS);
+
+    // euiOverlayMask pushes the modal up due to having padding-bottom: 10vh
+    max-height: calc(90vh - $euiSizeL);
 
     .euiModal__flex {
       max-height: none;