Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[Proposal] - Query assistance #6077

Closed
shanilpa opened this issue Mar 7, 2024 · 0 comments · Fixed by #7034
Closed

[Proposal] - Query assistance #6077

shanilpa opened this issue Mar 7, 2024 · 0 comments · Fixed by #7034
Assignees

Comments

@shanilpa
Copy link

shanilpa commented Mar 7, 2024

Overview

The following proposal aims to show an experience where users can leverage a natural language driven query assistant to help the craft queries in supported languages, diagnose issues, or learn more about the query.

Query.assist.mp4

Triggering the Assistant

The assistant is available when needed through the suggest menu when a user clicks into the Query box. This way the query assistant can be invoked when needed and is hidden when not. When triggered the assistant appears in a popup that is moveable by the user.
image

Asking a natural language question

Users are able to ask the assistant a question about their data, how to craft a query, what a query means, or to assist in crafting, editing, or troubleshooting a query

image

image

image

Progressive Disclosure

When a user triggers an action the results should be progressively disclosed with the option to stop the assistant if the response does not match user expectations
image

@kavilla kavilla linked a pull request Jun 15, 2024 that will close this issue
7 tasks
kavilla pushed a commit that referenced this issue Jun 20, 2024
### Description

see #6894 

This PR picks #6894, #6895, #6933, #6972 to main. Additionally,
- separates extensions from query enhancements
- adds banner support
- partially revert #6972 as it's pending on the data source commit to main
- renames search bar extension to query editor extension

A query editor extension can display a UI component above the query editor and/or a banner above the language selector. The component has the ability to read and write discover search bar states to enhance the search experience for users. The configuration is part of UI Enhancements.

```ts
export interface QueryEditorExtensionDependencies {
  /**
   * Currently selected index patterns.
   */
  indexPatterns?: Array<IIndexPattern | string>;
  /**
   * Currently selected data source.
   */
  dataSource?: DataSource;
  /**
   * Currently selected query language.
   */
  language: string;
}

export interface QueryEditorExtensionConfig {
  /**
   * The id for the search bar extension.
   */
  id: string;
  /**
   * Lower order indicates higher position on UI.
   */
  order: number;
  /**
   * A function that determines if the search bar extension is enabled and should be rendered on UI.
   * @returns whether the extension is enabled.
   */
  isEnabled: (dependencies: QueryEditorExtensionDependencies) => Promise<boolean>;
  /**
   * A function that returns the search bar extension component. The component
   * will be displayed on top of the query editor in the search bar.
   * @param dependencies - The dependencies required for the extension.
   * @returns The component the search bar extension.
   */
  getComponent?: (dependencies: QueryEditorExtensionDependencies) => React.ReactElement | null;
  /**
   * A function that returns the search bar extension banner. The banner is a
   * component that will be displayed on top of the search bar.
   * @param dependencies - The dependencies required for the extension.
   * @returns The component the search bar extension.
   */
  getBanner?: (dependencies: QueryEditorExtensionDependencies) => React.ReactElement | null;
}

export interface UiEnhancements {
  query?: QueryEnhancement;
+ queryEditorExtension?: QueryEditorExtensionConfig;
}
```
Developers can utilize search bar extensions to add additional features to the search bar, such as query assist.

Issues resolved: #6077

A search bar extension can display a UI component above the query bar. The component has the ability to read and write discover search bar states to enhance the search experience for users. The configuration is part of Query Enhancements.

Signed-off-by: Joshua Li <joshuali925@gmail.com>
opensearch-trigger-bot bot pushed a commit that referenced this issue Jun 20, 2024
### Description

see #6894

This PR picks #6894, #6895, #6933, #6972 to main. Additionally,
- separates extensions from query enhancements
- adds banner support
- partially revert #6972 as it's pending on the data source commit to main
- renames search bar extension to query editor extension

A query editor extension can display a UI component above the query editor and/or a banner above the language selector. The component has the ability to read and write discover search bar states to enhance the search experience for users. The configuration is part of UI Enhancements.

```ts
export interface QueryEditorExtensionDependencies {
  /**
   * Currently selected index patterns.
   */
  indexPatterns?: Array<IIndexPattern | string>;
  /**
   * Currently selected data source.
   */
  dataSource?: DataSource;
  /**
   * Currently selected query language.
   */
  language: string;
}

export interface QueryEditorExtensionConfig {
  /**
   * The id for the search bar extension.
   */
  id: string;
  /**
   * Lower order indicates higher position on UI.
   */
  order: number;
  /**
   * A function that determines if the search bar extension is enabled and should be rendered on UI.
   * @returns whether the extension is enabled.
   */
  isEnabled: (dependencies: QueryEditorExtensionDependencies) => Promise<boolean>;
  /**
   * A function that returns the search bar extension component. The component
   * will be displayed on top of the query editor in the search bar.
   * @param dependencies - The dependencies required for the extension.
   * @returns The component the search bar extension.
   */
  getComponent?: (dependencies: QueryEditorExtensionDependencies) => React.ReactElement | null;
  /**
   * A function that returns the search bar extension banner. The banner is a
   * component that will be displayed on top of the search bar.
   * @param dependencies - The dependencies required for the extension.
   * @returns The component the search bar extension.
   */
  getBanner?: (dependencies: QueryEditorExtensionDependencies) => React.ReactElement | null;
}

export interface UiEnhancements {
  query?: QueryEnhancement;
+ queryEditorExtension?: QueryEditorExtensionConfig;
}
```
Developers can utilize search bar extensions to add additional features to the search bar, such as query assist.

Issues resolved: #6077

A search bar extension can display a UI component above the query bar. The component has the ability to read and write discover search bar states to enhance the search experience for users. The configuration is part of Query Enhancements.

Signed-off-by: Joshua Li <joshuali925@gmail.com>
(cherry picked from commit 4f54049)
Signed-off-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
kavilla pushed a commit that referenced this issue Jun 22, 2024
### Description

see #6894

This PR picks #6894, #6895, #6933, #6972 to main. Additionally,
- separates extensions from query enhancements
- adds banner support
- partially revert #6972 as it's pending on the data source commit to main
- renames search bar extension to query editor extension

A query editor extension can display a UI component above the query editor and/or a banner above the language selector. The component has the ability to read and write discover search bar states to enhance the search experience for users. The configuration is part of UI Enhancements.

```ts
export interface QueryEditorExtensionDependencies {
  /**
   * Currently selected index patterns.
   */
  indexPatterns?: Array<IIndexPattern | string>;
  /**
   * Currently selected data source.
   */
  dataSource?: DataSource;
  /**
   * Currently selected query language.
   */
  language: string;
}

export interface QueryEditorExtensionConfig {
  /**
   * The id for the search bar extension.
   */
  id: string;
  /**
   * Lower order indicates higher position on UI.
   */
  order: number;
  /**
   * A function that determines if the search bar extension is enabled and should be rendered on UI.
   * @returns whether the extension is enabled.
   */
  isEnabled: (dependencies: QueryEditorExtensionDependencies) => Promise<boolean>;
  /**
   * A function that returns the search bar extension component. The component
   * will be displayed on top of the query editor in the search bar.
   * @param dependencies - The dependencies required for the extension.
   * @returns The component the search bar extension.
   */
  getComponent?: (dependencies: QueryEditorExtensionDependencies) => React.ReactElement | null;
  /**
   * A function that returns the search bar extension banner. The banner is a
   * component that will be displayed on top of the search bar.
   * @param dependencies - The dependencies required for the extension.
   * @returns The component the search bar extension.
   */
  getBanner?: (dependencies: QueryEditorExtensionDependencies) => React.ReactElement | null;
}

export interface UiEnhancements {
  query?: QueryEnhancement;
+ queryEditorExtension?: QueryEditorExtensionConfig;
}
```
Developers can utilize search bar extensions to add additional features to the search bar, such as query assist.

Issues resolved: #6077

A search bar extension can display a UI component above the query bar. The component has the ability to read and write discover search bar states to enhance the search experience for users. The configuration is part of Query Enhancements.


(cherry picked from commit 4f54049)

Signed-off-by: Joshua Li <joshuali925@gmail.com>
Signed-off-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>
mengweieric pushed a commit to mengweieric/OpenSearch-Dashboards that referenced this issue Jun 24, 2024
### Description

see opensearch-project#6894 

This PR picks opensearch-project#6894, opensearch-project#6895, opensearch-project#6933, opensearch-project#6972 to main. Additionally,
- separates extensions from query enhancements
- adds banner support
- partially revert opensearch-project#6972 as it's pending on the data source commit to main
- renames search bar extension to query editor extension

A query editor extension can display a UI component above the query editor and/or a banner above the language selector. The component has the ability to read and write discover search bar states to enhance the search experience for users. The configuration is part of UI Enhancements.

```ts
export interface QueryEditorExtensionDependencies {
  /**
   * Currently selected index patterns.
   */
  indexPatterns?: Array<IIndexPattern | string>;
  /**
   * Currently selected data source.
   */
  dataSource?: DataSource;
  /**
   * Currently selected query language.
   */
  language: string;
}

export interface QueryEditorExtensionConfig {
  /**
   * The id for the search bar extension.
   */
  id: string;
  /**
   * Lower order indicates higher position on UI.
   */
  order: number;
  /**
   * A function that determines if the search bar extension is enabled and should be rendered on UI.
   * @returns whether the extension is enabled.
   */
  isEnabled: (dependencies: QueryEditorExtensionDependencies) => Promise<boolean>;
  /**
   * A function that returns the search bar extension component. The component
   * will be displayed on top of the query editor in the search bar.
   * @param dependencies - The dependencies required for the extension.
   * @returns The component the search bar extension.
   */
  getComponent?: (dependencies: QueryEditorExtensionDependencies) => React.ReactElement | null;
  /**
   * A function that returns the search bar extension banner. The banner is a
   * component that will be displayed on top of the search bar.
   * @param dependencies - The dependencies required for the extension.
   * @returns The component the search bar extension.
   */
  getBanner?: (dependencies: QueryEditorExtensionDependencies) => React.ReactElement | null;
}

export interface UiEnhancements {
  query?: QueryEnhancement;
+ queryEditorExtension?: QueryEditorExtensionConfig;
}
```
Developers can utilize search bar extensions to add additional features to the search bar, such as query assist.

Issues resolved: opensearch-project#6077

A search bar extension can display a UI component above the query bar. The component has the ability to read and write discover search bar states to enhance the search experience for users. The configuration is part of Query Enhancements.

Signed-off-by: Joshua Li <joshuali925@gmail.com>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging a pull request may close this issue.

4 participants