[Synthetics] Prevent location id query param on form (elastic#156661)

kibanamachine · May 5, 2023 · 4b0de66 · 4b0de66
1 parent 082c0f6
commit 4b0de66
Show file tree

Hide file tree

Showing 3 changed files with 14 additions and 7 deletions.
diff --git a/.../synthetics/public/apps/synthetics/components/monitor_add_edit/monitor_details_portal.tsx b/.../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/...ugins/synthetics/public/apps/synthetics/components/monitor_add_edit/monitor_edit_page.tsx b/...ugins/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/...thetics/public/apps/synthetics/components/monitor_details/hooks/use_selected_location.tsx b/...thetics/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,15 +21,15 @@ export const useSelectedLocation = () => {
   useEffect(() => {
     if (!urlLocationId) {
       const firstLocationId = locations?.[0]?.id;
-      if (firstLocationId) {
+      if (firstLocationId && updateUrl) {
         updateUrlParams({ locationId: firstLocationId }, true);
       }
     }
 
     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,