Merge branch '2.x' into backport/backport-8222-to-2.x

Signed-off-by: Kawika Avilla <[email protected]>

changelogs/fragments/8151.yml

@@ -0,0 +1,2 @@
+fix:
+- Remove workspace detail title in navigation when new nav is disabled ([#8151](https://github.com/opensearch-project/OpenSearch-Dashboards/pull/8151))

changelogs/fragments/8227.yml

@@ -0,0 +1,2 @@
+feat:
+- Adjust semantics and sizing of page titles in application headers ([#8227](https://github.com/opensearch-project/OpenSearch-Dashboards/pull/8227))

changelogs/fragments/8320.yml

@@ -0,0 +1,2 @@
+fix:
+- Update osd to respect new oui breakpoints ([#8320](https://github.com/opensearch-project/OpenSearch-Dashboards/pull/8320))

changelogs/fragments/8331.yml

@@ -0,0 +1,2 @@
+fix:
+- Discover query input background not shrink when window resize ([#8331](https://github.com/opensearch-project/OpenSearch-Dashboards/pull/8331))

changelogs/fragments/8334.yml

@@ -0,0 +1,2 @@
+refactor:
+- Move the render of query extension control buttons to extension component ([#8334](https://github.com/opensearch-project/OpenSearch-Dashboards/pull/8334))

src/core/public/chrome/ui/header/collapsible_nav.tsx

@@ -282,7 +282,7 @@ export function CollapsibleNav({
         ))}
 
         {/* Docking button only for larger screens that can support it*/}
-        <EuiShowFor sizes={['l', 'xl']}>
+        <EuiShowFor sizes={['l', 'xl', 'xxl', 'xxxl']}>
           <EuiCollapsibleNavGroup>
             <EuiListGroup flush>
               <EuiListGroupItem

src/core/public/chrome/ui/header/header.tsx

@@ -197,15 +197,15 @@ export function Header({
         },
         {
           items: [
-            <EuiShowFor sizes={['m', 'l', 'xl']}>
+            <EuiShowFor sizes={['m', 'l', 'xl', 'xxl', 'xxxl']}>
               <HeaderNavControls navControls$={observables.navControlsExpandedCenter$} />
             </EuiShowFor>,
           ],
           borders: 'none',
         },
         {
           items: [
-            <EuiHideFor sizes={['m', 'l', 'xl']}>
+            <EuiHideFor sizes={['m', 'l', 'xl', 'xxl', 'xxxl']}>
               <HeaderNavControls navControls$={observables.navControlsExpandedCenter$} />
             </EuiHideFor>,
             <HeaderNavControls navControls$={observables.navControlsExpandedRight$} />,

src/plugins/data/public/plugin.ts

@@ -150,6 +150,7 @@ export class DataPublicPlugin
       storage: this.storage,
       sessionStorage: this.sessionStorage,
       defaultSearchInterceptor: searchService.getDefaultSearchInterceptor(),
+      applicaton: core.application,
     });
 
     uiActions.registerAction(
@@ -224,6 +225,7 @@ export class DataPublicPlugin
       savedObjectsClient: savedObjects.client,
       uiSettings,
       indexPatterns,
+      applicaton: core.application,
     });
     setQueryService(query);
 

src/plugins/data/public/query/query_service.ts

@@ -97,6 +97,7 @@ export class QueryService {
     storage,
     uiSettings,
     indexPatterns,
+    applicaton,
   }: QueryServiceStartDependencies): IQueryStart {
     this.queryStringManager.getDatasetService().init(indexPatterns);
     return {
@@ -106,7 +107,11 @@ export class QueryService {
       }),
       filterManager: this.filterManager,
       queryString: this.queryStringManager,
-      savedQueries: createSavedQueryService(savedObjectsClient),
+      savedQueries: createSavedQueryService(
+        savedObjectsClient,
+        this.queryStringManager,
+        applicaton
+      ),
       state$: this.state$,
       timefilter: this.timefilter,
       getOpenSearchQuery: (indexPattern: IndexPattern) => {

src/plugins/data/public/query/saved_query/saved_query_service.ts

@@ -29,8 +29,10 @@
  */
 
 import { isObject } from 'lodash';
-import { SavedObjectsClientContract, SavedObjectAttributes } from 'src/core/public';
+import { SavedObjectsClientContract, SavedObjectAttributes, CoreStart } from 'src/core/public';
+import { first } from 'rxjs/operators';
 import { SavedQueryAttributes, SavedQuery, SavedQueryService } from './types';
+import { QueryStringContract } from '../query_string';
 
 type SerializedSavedQueryAttributes = SavedObjectAttributes &
   SavedQueryAttributes & {
@@ -41,7 +43,9 @@ type SerializedSavedQueryAttributes = SavedObjectAttributes &
   };
 
 export const createSavedQueryService = (
-  savedObjectsClient: SavedObjectsClientContract
+  savedObjectsClient: SavedObjectsClientContract,
+  queryStringManager?: QueryStringContract,
+  application?: CoreStart['application']
 ): SavedQueryService => {
   const saveQuery = async (attributes: SavedQueryAttributes, { overwrite = false } = {}) => {
     if (!attributes.title.length) {
@@ -117,12 +121,29 @@ export const createSavedQueryService = (
       page: activePage,
     });
 
+    let queries = response.savedObjects.map(
+      (savedObject: { id: string; attributes: SerializedSavedQueryAttributes }) =>
+        parseSavedQueryObject(savedObject)
+    );
+
+    const currentAppId =
+      (await application?.currentAppId$?.pipe(first()).toPromise()) ?? Promise.resolve(undefined);
+    const languageService = queryStringManager?.getLanguageService();
+
+    // Filtering saved queries based on language supported by cirrent application
+    if (currentAppId && languageService) {
+      queries = queries.filter((query) => {
+        const languageId = query.attributes.query.language;
+        return (
+          languageService?.getLanguage(languageId)?.supportedAppNames?.includes(currentAppId) ??
+          true
+        );
+      });
+    }
+
     return {
       total: response.total,
-      queries: response.savedObjects.map(
-        (savedObject: { id: string; attributes: SerializedSavedQueryAttributes }) =>
-          parseSavedQueryObject(savedObject)
-      ),
+      queries,
     };
   };
 

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

@@ -3,7 +3,12 @@
  * SPDX-License-Identifier: Apache-2.0
  */
 
-import { IUiSettingsClient, SavedObjectsClientContract } from 'opensearch-dashboards/public';
+import {
+  ApplicationSetup,
+  ApplicationStart,
+  IUiSettingsClient,
+  SavedObjectsClientContract,
+} from 'opensearch-dashboards/public';
 import { Observable } from 'rxjs';
 import { DataStorage } from '../../common';
 import { IndexPattern, IndexPatternsService } from '../index_patterns';
@@ -38,6 +43,7 @@ export interface QueryServiceSetupDependencies {
   storage: DataStorage;
   sessionStorage: DataStorage;
   defaultSearchInterceptor: ISearchInterceptor;
+  applicaton: ApplicationSetup;
 }
 
 /** @internal */
@@ -46,4 +52,5 @@ export interface QueryServiceStartDependencies {
   storage: DataStorage;
   uiSettings: IUiSettingsClient;
   indexPatterns: IndexPatternsService;
+  applicaton: ApplicationStart;
 }

src/plugins/data/public/ui/query_editor/_query_editor.scss

@@ -106,7 +106,7 @@
 }
 
 // IE specific fix for the datepicker to not collapse
-@include euiBreakpoint("m", "l", "xl") {
+@include euiBreakpoint("m", "l", "xl", "xxl", "xxxl") {
   .osdQueryEditor__datePickerWrapper {
     max-width: 40vw;
     flex-grow: 0 !important;
@@ -152,6 +152,12 @@
   .osdQueryEditor__querycontrols {
     float: right;
     margin: $euiSizeS $euiSizeS;
+
+    .osdQueryEditor__extensionQueryControls {
+      display: flex;
+      padding: 0 $euiSizeS 0 $euiSizeXS;
+      border-right: $euiBorderThin;
+    }
   }
 
   .osdQueryEditor__dataSetPicker {
@@ -183,6 +189,7 @@
   padding: calc($euiSizeXS + 1px);
   background-color: $euiColorEmptyShade;
   overflow: initial !important; // needed for suggestion window, otherwise will be hidden in child
+  min-width: 0;
 
   .monaco-editor .view-overlays .current-line {
     border: none;

src/plugins/data/public/ui/query_editor/query_editor.tsx

@@ -106,6 +106,7 @@ export default class QueryEditorUI extends Component<Props, State> {
   private services = this.props.opensearchDashboards.services;
   private headerRef: RefObject<HTMLDivElement> = createRef();
   private bannerRef: RefObject<HTMLDivElement> = createRef();
+  private queryControlsContainer: RefObject<HTMLDivElement> = createRef();
   private extensionMap = this.languageManager.getQueryEditorExtensionMap();
 
   private getQueryString = () => {
@@ -121,6 +122,7 @@ export default class QueryEditorUI extends Component<Props, State> {
       !(
         this.headerRef.current &&
         this.bannerRef.current &&
+        this.queryControlsContainer.current &&
         this.props.query.language &&
         this.extensionMap &&
         Object.keys(this.extensionMap).length > 0
@@ -137,6 +139,7 @@ export default class QueryEditorUI extends Component<Props, State> {
         configMap={this.extensionMap}
         componentContainer={this.headerRef.current}
         bannerContainer={this.bannerRef.current}
+        queryControlsContainer={this.queryControlsContainer.current}
       />
     );
   }
@@ -336,25 +339,6 @@ export default class QueryEditorUI extends Component<Props, State> {
     return <QueryControls queryControls={queryControls} />;
   };
 
-  private renderExtensionSearchBarButton = () => {
-    if (!this.extensionMap || Object.keys(this.extensionMap).length === 0) return null;
-    const sortedConfigs = Object.values(this.extensionMap).sort((a, b) => a.order - b.order);
-    return (
-      <>
-        {sortedConfigs.map((config) => {
-          return config.getSearchBarButton
-            ? config.getSearchBarButton({
-                language: this.props.query.language,
-                onSelectLanguage: this.onSelectLanguage,
-                isCollapsed: this.state.isCollapsed,
-                setIsCollapsed: this.setIsCollapsed,
-              })
-            : null;
-        })}
-      </>
-    );
-  };
-
   public render() {
     const className = classNames(this.props.className);
 
@@ -471,9 +455,12 @@ export default class QueryEditorUI extends Component<Props, State> {
           {languageSelector}
           <div className="osdQueryEditor__querycontrols">
             <EuiFlexGroup responsive={false} gutterSize="s" alignItems="center">
+              <div
+                ref={this.queryControlsContainer}
+                className="osdQueryEditor__extensionQueryControls"
+              />
               {this.renderQueryControls(languageEditor.TopBar.Controls)}
               {!languageEditor.TopBar.Expanded && this.renderToggleIcon()}
-              {!languageEditor.TopBar.Expanded && this.renderExtensionSearchBarButton()}
               {this.props.savedQueryManagement}
             </EuiFlexGroup>
           </div>