From 4b0de666de4c9e794b2df78d4dc49619ceb230ef Mon Sep 17 00:00:00 2001
From: Shahzad <shahzad31comp@gmail.com>
Date: Fri, 5 May 2023 18:07:07 +0200
Subject: [PATCH] [Synthetics] Prevent location id query param on form
 (#156661)

---
 .../monitor_add_edit/monitor_details_portal.tsx    | 14 ++++++++++----
 .../monitor_add_edit/monitor_edit_page.tsx         |  1 +
 .../hooks/use_selected_location.tsx                |  6 +++---
 3 files changed, 14 insertions(+), 7 deletions(-)

diff --git a/x-pack/plugins/synthetics/public/apps/synthetics/components/monitor_add_edit/monitor_details_portal.tsx b/x-pack/plugins/synthetics/public/apps/synthetics/components/monitor_add_edit/monitor_details_portal.tsx
index fc3a3bbf09f49..fbdd823b49682 100644
--- a/x-pack/plugins/synthetics/public/apps/synthetics/components/monitor_add_edit/monitor_details_portal.tsx
+++ b/x-pack/plugins/synthetics/public/apps/synthetics/components/monitor_add_edit/monitor_details_portal.tsx
@@ -16,18 +16,24 @@ interface Props {
   name: string;
   configId: string;
   locationId?: string;
+  updateUrl?: boolean;
 }
 
-export const MonitorDetailsLinkPortal = ({ name, configId, locationId }: Props) => {
+export const MonitorDetailsLinkPortal = ({ name, configId, locationId, updateUrl }: Props) => {
   return (
     <InPortal node={MonitorDetailsLinkPortalNode}>
-      <MonitorDetailsLink name={name} configId={configId} locationId={locationId} />
+      <MonitorDetailsLink
+        name={name}
+        configId={configId}
+        locationId={locationId}
+        updateUrl={updateUrl}
+      />
     </InPortal>
   );
 };
 
-export const MonitorDetailsLink = ({ name, configId, locationId }: Props) => {
-  const selectedLocation = useSelectedLocation();
+export const MonitorDetailsLink = ({ name, configId, locationId, updateUrl }: Props) => {
+  const selectedLocation = useSelectedLocation(updateUrl);
 
   let locId = locationId;
 
diff --git a/x-pack/plugins/synthetics/public/apps/synthetics/components/monitor_add_edit/monitor_edit_page.tsx b/x-pack/plugins/synthetics/public/apps/synthetics/components/monitor_add_edit/monitor_edit_page.tsx
index c99a3af2d933c..b77b799a49041 100644
--- a/x-pack/plugins/synthetics/public/apps/synthetics/components/monitor_add_edit/monitor_edit_page.tsx
+++ b/x-pack/plugins/synthetics/public/apps/synthetics/components/monitor_add_edit/monitor_edit_page.tsx
@@ -99,6 +99,7 @@ export const MonitorEditPage: React.FC = () => {
         <MonitorDetailsLinkPortal
           configId={data?.attributes[ConfigKey.CONFIG_ID]}
           name={data?.attributes.name}
+          updateUrl={false}
         />
       </MonitorForm>
     </>
diff --git a/x-pack/plugins/synthetics/public/apps/synthetics/components/monitor_details/hooks/use_selected_location.tsx b/x-pack/plugins/synthetics/public/apps/synthetics/components/monitor_details/hooks/use_selected_location.tsx
index 30a522147cf4e..caed741162f97 100644
--- a/x-pack/plugins/synthetics/public/apps/synthetics/components/monitor_details/hooks/use_selected_location.tsx
+++ b/x-pack/plugins/synthetics/public/apps/synthetics/components/monitor_details/hooks/use_selected_location.tsx
@@ -10,7 +10,7 @@ import { useDispatch, useSelector } from 'react-redux';
 import { selectSelectedLocationId, setMonitorDetailsLocationAction } from '../../../state';
 import { useUrlParams, useLocations } from '../../../hooks';
 
-export const useSelectedLocation = () => {
+export const useSelectedLocation = (updateUrl = true) => {
   const [getUrlParams, updateUrlParams] = useUrlParams();
   const { locations } = useLocations();
   const selectedLocationId = useSelector(selectSelectedLocationId);
@@ -21,7 +21,7 @@ export const useSelectedLocation = () => {
   useEffect(() => {
     if (!urlLocationId) {
       const firstLocationId = locations?.[0]?.id;
-      if (firstLocationId) {
+      if (firstLocationId && updateUrl) {
         updateUrlParams({ locationId: firstLocationId }, true);
       }
     }
@@ -29,7 +29,7 @@ export const useSelectedLocation = () => {
     if (urlLocationId && selectedLocationId !== urlLocationId) {
       dispatch(setMonitorDetailsLocationAction(urlLocationId));
     }
-  }, [dispatch, updateUrlParams, locations, urlLocationId, selectedLocationId]);
+  }, [dispatch, updateUrlParams, locations, urlLocationId, selectedLocationId, updateUrl]);
 
   return useMemo(
     () => locations.find((loc) => loc.id === urlLocationId) ?? null,