Merge branch 'main' into rele-notes

Signed-off-by: Riya <[email protected]>

public/components/MDSEnabledComponent/MDSEnabledComponent.tsx

@@ -1,6 +1,8 @@
-import React from "react";
+import React, { useContext, useEffect } from "react";
 import { DataSourceMenuContext, DataSourceMenuProperties } from "../../services/DataSourceMenuContext";
 import _ from 'lodash'
+import { useHistory } from "react-router-dom";
+import queryString from "query-string";
 
 export default class MDSEnabledComponent<
   Props extends DataSourceMenuProperties,
@@ -29,8 +31,25 @@ export function isDataSourceChanged(prevProps, currentProps) {
   return false;
 }
 
-export function isDataSourceError(error) {
+export function isDataSourceError(error: { body: { message: string | string[]; }; }) {
   return (error.body && error.body.message && error.body.message.includes("Data Source Error"));
 }
 
+export function useUpdateUrlWithDataSourceProperties() {
+  const dataSourceMenuProps = useContext(DataSourceMenuContext);
+  const { dataSourceId, multiDataSourceEnabled } = dataSourceMenuProps;
+  const history = useHistory();
+  const currentSearch = history?.location?.search;
+  const currentQuery = queryString.parse(currentSearch);
+  useEffect(() => {
+    if (multiDataSourceEnabled) {
+      history.replace({
+        search: queryString.stringify({
+          ...currentQuery,
+          dataSourceId,
+        }),
+      });
+    }
+  }, [dataSourceId, multiDataSourceEnabled]);
+}
 

public/components/PageHeader/PageHeader.tsx

@@ -10,6 +10,7 @@ import {
   TopNavControlLinkData,
 } from '../../../../../src/plugins/navigation/public';
 import { getApplication, getNavigationUI, getUseUpdatedUx } from '../../services/utils/constants';
+import { useUpdateUrlWithDataSourceProperties } from '../MDSEnabledComponent/MDSEnabledComponent';
 
 export interface PageHeaderProps {
   appRightControls?: TopNavControlData[];
@@ -27,6 +28,7 @@ const PageHeader: React.FC<PageHeaderProps> = ({
 }) => {
   const { HeaderControl } = getNavigationUI();
   const { setAppBadgeControls, setAppRightControls, setAppDescriptionControls, setAppLeftControls } = getApplication();
+  useUpdateUrlWithDataSourceProperties();
 
   return getUseUpdatedUx() ? (
     <>

public/pages/Channels/components/details/ChannelDetails.tsx

@@ -33,6 +33,7 @@ import { ChannelDetailItems } from './ChannelDetailItems';
 import { ChannelDetailsActions } from './ChannelDetailsActions';
 import { ChannelSettingsDetails } from './ChannelSettingsDetails';
 import PageHeader from "../../../../components/PageHeader/PageHeader";
+import { TopNavControlButtonData } from '../../../../../../../src/plugins/navigation/public';
 
 interface ChannelDetailsProps extends RouteComponentProps<{
   id: string
@@ -191,19 +192,12 @@ export function ChannelDetails(props: ChannelDetailsProps) {
       ),
     },
     {
-      renderComponent: (
-        <div style={{ display: 'flex', alignItems: 'center' }}>
-          <EuiSmallButton
-            data-test-subj="send-test-message-button"
-            onClick={sendTestMessage}
-            style={{ marginLeft: '10px' }}
-            disabled={!channel?.is_enabled}
-          >
-            Send test message
-          </EuiSmallButton>
-        </div>
-      ),
-    },
+      controlType: 'button',
+      testId: 'send-test-message-button',
+      isDisabled: !channel?.is_enabled,
+      run: sendTestMessage,
+      label: 'Send test message',
+    } as TopNavControlButtonData,
   ];
 
   const badgeComponent = <EuiFlexItem grow={false} style={{ paddingBottom: 5 }}>

public/pages/Emails/EmailSenders.tsx

@@ -13,6 +13,7 @@ import { SendersTable } from './components/tables/SendersTable';
 import { SESSendersTable } from './components/tables/SESSendersTable';
 import { NotificationService } from '../../services';
 import { getUseUpdatedUx } from '../../services/utils/constants';
+import { useUpdateUrlWithDataSourceProperties } from '../../components/MDSEnabledComponent/MDSEnabledComponent';
 
 interface EmailSendersProps extends RouteComponentProps {
   notificationService: NotificationService;
@@ -22,7 +23,9 @@ export function EmailSenders(props: EmailSendersProps) {
   const coreContext = useContext(CoreServicesContext)!;
   const mainStateContext = useContext(MainContext)!;
 
-
+  // Call the hook to manage URL updates
+  useUpdateUrlWithDataSourceProperties();
+
   useEffect(() => {
     setBreadcrumbs([
       BREADCRUMBS.NOTIFICATIONS,

public/pages/Main/Main.tsx

@@ -11,7 +11,7 @@ import { CoreServicesConsumer, CoreServicesContext } from '../../components/core
 import { ModalProvider, ModalRoot } from '../../components/Modal';
 import { BrowserServices } from '../../models/interfaces';
 import { ServicesConsumer, ServicesContext } from '../../services/services';
-import { ROUTES } from '../../utils/constants';
+import { ROUTES, dataSourceObservable } from '../../utils/constants';
 import { CHANNEL_TYPE } from '../../../common/constants';
 import { Channels } from '../Channels/Channels';
 import { ChannelDetails } from '../Channels/components/details/ChannelDetails';

public/plugin.ts

@@ -21,9 +21,8 @@ import {
   NotificationsDashboardsSetupDeps,
 } from './types';
 import { PLUGIN_NAME } from '../common';
-import { ROUTES } from './utils/constants';
+import { ROUTES, dataSourceObservable } from './utils/constants';
 import { setApplication, setBreadCrumbsSetter, setNavigationUI, setUISettings } from './services/utils/constants';
-import { dataSourceObservable } from "./pages/Main/Main";
 import { BehaviorSubject } from "rxjs";
 
 export class notificationsDashboardsPlugin
@@ -131,6 +130,12 @@ export class notificationsDashboardsPlugin
         },
       });
 
+      dataSourceObservable.subscribe((dataSourceOption) => {
+        if (dataSourceOption) {
+          this.appStateUpdater.next(this.updateDefaultRouteOfManagementApplications);
+        }
+      });
+
       const navlinks = [
         { id: 'channels', parent: PLUGIN_NAME },
         { id: 'email_senders', parent: PLUGIN_NAME },
@@ -147,7 +152,6 @@ export class notificationsDashboardsPlugin
         navLinks
       );
     }
-
     // Return methods that should be available to other plugins
     return {};
   }

public/utils/constants.ts

@@ -5,6 +5,9 @@
 
 import { ChromeBreadcrumb } from 'opensearch-dashboards/public';
 import { getBreadCrumbsSetter, getUseUpdatedUx } from '../services/utils/constants';
+import { DataSourceOption } from 'src/plugins/data_source_management/public';
+import { i18n } from "@osd/i18n";
+import { BehaviorSubject } from 'rxjs';
 
 export const DOCUMENTATION_LINK = '';
 export const ALERTING_DOCUMENTATION_LINK =
@@ -72,3 +75,12 @@ export const CUSTOM_WEBHOOK_ENDPOINT_TYPE = Object.freeze({
 export function setBreadcrumbs(crumbs: ChromeBreadcrumb[]) {
   getBreadCrumbsSetter()(getUseUpdatedUx() ? crumbs : [BREADCRUMBS.NOTIFICATIONS, ...crumbs]);
 }
+
+const LocalCluster: DataSourceOption = {
+  label: i18n.translate("dataSource.localCluster", {
+    defaultMessage: "Local cluster",
+  }),
+  id: "",
+};
+
+export const dataSourceObservable = new BehaviorSubject<DataSourceOption>(LocalCluster);