[Discover]Sample Queries and Saved Queries in No Results Page (#8616)

* Sample Queries and Saved Queries in No Results Page Signed-off-by: Sean Li <[email protected]> Signed-off-by: Miki <[email protected]> * Changeset file for PR #8616 created/updated * Update styling Signed-off-by: Miki <[email protected]> --------- Signed-off-by: Sean Li <[email protected]> Signed-off-by: Miki <[email protected]> Co-authored-by: opensearch-changeset-bot[bot] <154024398+opensearch-changeset-bot[bot]@users.noreply.github.com> Co-authored-by: Miki <[email protected]>
opensearch-project · Oct 18, 2024 · 9da1b77 · 9da1b77
1 parent 6659139
commit 9da1b77
Show file tree

Hide file tree

Showing 13 changed files with 413 additions and 33 deletions.
diff --git a/changelogs/fragments/8616.yml b/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))
diff --git a/src/plugins/data/public/query/query_string/dataset_service/lib/index_pattern_type.ts b/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 @@ export const indexPatternTypeConfig: DatasetTypeConfig = {
     }
     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[]> => {

diff --git a/src/plugins/data/public/query/query_string/dataset_service/lib/index_type.ts b/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 @@ export const indexTypeConfig: DatasetTypeConfig = {
   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) => {

diff --git a/src/plugins/data/public/query/query_string/dataset_service/types.ts b/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;
 }
diff --git a/src/plugins/data/public/query/query_string/language_service/lib/dql_language.ts b/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:*',
+      },
+    ],
   };
 };
diff --git a/src/plugins/data/public/query/query_string/language_service/lib/lucene_language.ts b/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:*',
+      },
+    ],
   };
 };
diff --git a/src/plugins/data/public/query/query_string/language_service/types.ts b/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[];
 }
diff --git a/src/plugins/data/public/ui/_common.scss b/src/plugins/data/public/ui/_common.scss
@@ -1,3 +1,8 @@
+/*
+ * Copyright OpenSearch Contributors
+ * SPDX-License-Identifier: Apache-2.0
+ */
+
 .dataUI-centerPanel {
   height: 100%;
   width: 100%;

diff --git a/src/plugins/discover/public/application/components/no_results/no_results.scss b/src/plugins/discover/public/application/components/no_results/no_results.scss
@@ -0,0 +1,10 @@
+/*
+ * Copyright OpenSearch Contributors
+ * SPDX-License-Identifier: Apache-2.0
+ */
+
+.discoverNoResults-sampleContainer {
+  @include euiLegibilityMaxWidth(100%);
+
+  margin: 0 auto;
+}