[SecuritySolution] Fix edit dashboard url (#156160)

## Summary

It lands on the wrong page after clicking on `Edit Dashboard` button.

- Steps to reproduce:

1. Create a dashboard, save it and add a Security Solution tag.
2. Back to SecuritySolution > Dashboards, select the dashboard you
added.
3. Click the `Edit` button at the top right corner.
4. Observe that it lands at Kibana dashboard listing page.

Expect:
It should navigate to Kibana dashboard's edit mode.

### Checklist

Delete any items that are not applicable to this PR.


- [x] [Unit or functional
tests](https://www.elastic.co/guide/en/kibana/master/development-tests.html)
were updated or added to match the most common scenarios

x-pack/plugins/security_solution/public/dashboards/components/edit_dashboard_button.test.tsx

@@ -5,12 +5,16 @@
  * 2.0.
  */
 
-import { render } from '@testing-library/react';
+import type { RenderResult } from '@testing-library/react';
+import { fireEvent, render } from '@testing-library/react';
 import React from 'react';
+import type { Query } from '@kbn/es-query';
+
 import { useKibana } from '../../common/lib/kibana';
-import { createStartServicesMock } from '../../common/lib/kibana/kibana_react.mock';
 import { TestProviders } from '../../common/mock/test_providers';
+import type { EditDashboardButtonComponentProps } from './edit_dashboard_button';
 import { EditDashboardButton } from './edit_dashboard_button';
+import { ViewMode } from '@kbn/embeddable-plugin/public';
 
 jest.mock('../../common/lib/kibana/kibana_react', () => {
   return {
@@ -24,18 +28,54 @@ describe('EditDashboardButton', () => {
     to: '2023-03-24T23:59:59.999Z',
   };
 
-  beforeAll(() => {
+  const props = {
+    filters: [],
+    query: { query: '', language: '' } as Query,
+    savedObjectId: 'mockSavedObjectId',
+    timeRange,
+  };
+  const servicesMock = {
+    dashboard: { locator: { getRedirectUrl: jest.fn() } },
+    application: {
+      navigateToApp: jest.fn(),
+      navigateToUrl: jest.fn(),
+    },
+  };
+
+  const renderButton = (testProps: EditDashboardButtonComponentProps) => {
+    return render(
+      <TestProviders>
+        <EditDashboardButton {...testProps} />
+      </TestProviders>
+    );
+  };
+
+  let renderResult: RenderResult;
+  beforeEach(() => {
     (useKibana as jest.Mock).mockReturnValue({
-      services: createStartServicesMock(),
+      services: servicesMock,
     });
+    renderResult = renderButton(props);
+  });
+
+  beforeEach(() => {
+    jest.clearAllMocks();
   });
 
   it('should render', () => {
-    const { queryByTestId } = render(
-      <TestProviders>
-        <EditDashboardButton savedObjectId="mockSavedObjectId" timeRange={timeRange} />
-      </TestProviders>
+    expect(renderResult.queryByTestId('dashboardEditButton')).toBeInTheDocument();
+  });
+
+  it('should render dashboard edit url', () => {
+    fireEvent.click(renderResult.getByTestId('dashboardEditButton'));
+    expect(servicesMock.dashboard?.locator?.getRedirectUrl).toHaveBeenCalledWith(
+      expect.objectContaining({
+        query: props.query,
+        filters: props.filters,
+        timeRange: props.timeRange,
+        dashboardId: props.savedObjectId,
+        viewMode: ViewMode.EDIT,
+      })
     );
-    expect(queryByTestId('dashboardEditButton')).toBeInTheDocument();
   });
 });

x-pack/plugins/security_solution/public/dashboards/components/edit_dashboard_button.tsx

@@ -5,12 +5,12 @@
  * 2.0.
  */
 
-import React from 'react';
+import React, { useCallback } from 'react';
 import type { Query, Filter } from '@kbn/es-query';
 import { EuiButton } from '@elastic/eui';
-import { useDashboardAppLink } from '../hooks/use_dashboard_app_link';
+import { ViewMode } from '@kbn/embeddable-plugin/public';
 import { EDIT_DASHBOARD_BUTTON_TITLE } from '../pages/details/translations';
-import { useKibana } from '../../common/lib/kibana';
+import { useKibana, useNavigation } from '../../common/lib/kibana';
 
 export interface EditDashboardButtonComponentProps {
   filters?: Filter[];
@@ -31,24 +31,33 @@ const EditDashboardButtonComponent: React.FC<EditDashboardButtonComponentProps>
   timeRange,
 }) => {
   const {
-    services: { uiSettings },
+    services: { dashboard },
   } = useKibana();
+  const { navigateTo } = useNavigation();
 
-  const { onClick } = useDashboardAppLink({
-    query,
-    filters,
-    timeRange,
-    uiSettings,
-    savedObjectId,
-  });
-
+  const onClick = useCallback(
+    (e) => {
+      e.preventDefault();
+      const url = dashboard?.locator?.getRedirectUrl({
+        query,
+        filters,
+        timeRange,
+        dashboardId: savedObjectId,
+        viewMode: ViewMode.EDIT,
+      });
+      if (url) {
+        navigateTo({ url });
+      }
+    },
+    [dashboard?.locator, query, filters, timeRange, savedObjectId, navigateTo]
+  );
   return (
     <EuiButton
       color="primary"
+      data-test-subj="dashboardEditButton"
       fill
       iconType="pencil"
       onClick={onClick}
-      data-test-subj="dashboardEditButton"
     >
       {EDIT_DASHBOARD_BUTTON_TITLE}
     </EuiButton>