Make locations expand correctly on filter change

5 files changed, 38 insertions, 15 deletions

diff --git a/gui/src/renderer/components/select-location/LocationList.tsx b/gui/src/renderer/components/select-location/LocationList.tsx
index 288a9e799a..9db10ff519 100644
--- a/gui/src/renderer/components/select-location/LocationList.tsx
+++ b/gui/src/renderer/components/select-location/LocationList.tsx
@@ -17,7 +17,11 @@ interface LocationListProps<T> {
   onSelect: (value: LocationSelection<T>) => void;
   onExpand: (location: RelayLocation) => void;
   onCollapse: (location: RelayLocation) => void;
-  onWillExpand: (locationRect: DOMRect, expandedContentHeight: number, invokedByUser: boolean) => void;
+  onWillExpand: (
+    locationRect: DOMRect,
+    expandedContentHeight: number,
+    invokedByUser: boolean,
+  ) => void;
   onTransitionEnd: () => void;
 }
 
diff --git a/gui/src/renderer/components/select-location/LocationRow.tsx b/gui/src/renderer/components/select-location/LocationRow.tsx
index 074f8675a2..eb36efc7d3 100644
--- a/gui/src/renderer/components/select-location/LocationRow.tsx
+++ b/gui/src/renderer/components/select-location/LocationRow.tsx
@@ -107,7 +107,11 @@ interface IProps<C extends LocationSpecification> {
   onSelect: (value: LocationSelection<never>) => void;
   onExpand: (location: RelayLocation) => void;
   onCollapse: (location: RelayLocation) => void;
-  onWillExpand: (locationRect: DOMRect, expandedContentHeight: number, invokedByUser: boolean) => void;
+  onWillExpand: (
+    locationRect: DOMRect,
+    expandedContentHeight: number,
+    invokedByUser: boolean,
+  ) => void;
   onTransitionEnd: () => void;
   children?: C extends RelaySpecification
     ? never
diff --git a/gui/src/renderer/components/select-location/RelayListContext.tsx b/gui/src/renderer/components/select-location/RelayListContext.tsx
index b6aab2970d..b599c0e2ed 100644
--- a/gui/src/renderer/components/select-location/RelayListContext.tsx
+++ b/gui/src/renderer/components/select-location/RelayListContext.tsx
@@ -34,7 +34,11 @@ interface RelayListContext {
   relayList: LocationList<never>;
   expandLocation: (location: RelayLocation) => void;
   collapseLocation: (location: RelayLocation) => void;
-  onBeforeExpand: (locationRect: DOMRect, expandedContentHeight: number, invokedByUser: boolean) => void;
+  onBeforeExpand: (
+    locationRect: DOMRect,
+    expandedContentHeight: number,
+    invokedByUser: boolean,
+  ) => void;
 }
 
 type ExpandedLocations = Partial<Record<LocationType, Array<RelayLocation>>>;
@@ -103,17 +107,21 @@ export function RelayListContextProvider(props: RelayListContextProviderProps) {
     [relayList, expandLocation, collapseLocation, onBeforeExpand],
   );
 
-  // Restore the expanded locations on locationType change or change of other parameters
+  // Calculate expanded locations when location change
   useEffect(() => {
     if (searchTerm === '') {
       setExpandedLocations(defaultExpandedLocations(relaySettings, bridgeSettings));
-    } else {
+    }
+  }, [searchTerm]);
+
+  useEffect(() => {
+    if (searchTerm !== '') {
       setExpandedLocations((expandedLocations) => ({
         ...expandedLocations,
         [locationType]: getLocationsExpandedBySearch(relayListForFilters, searchTerm),
       }));
     }
-  }, [relayListForFilters, searchTerm, relaySettings?.ownership, relaySettings?.providers]);
+  }, [relayListForFilters, searchTerm]);
 
   return <relayListContext.Provider value={value}>{props.children}</relayListContext.Provider>;
 }
@@ -221,13 +229,16 @@ function useExpandedLocations(
     [locationType],
   );
 
-  const onBeforeExpand = useCallback((locationRect: DOMRect, expandedContentHeight: number, invokedByUser: boolean) => {
-    if (invokedByUser) {
-      locationRect.height += expandedContentHeight;
-      spacePreAllocationViewRef.current?.allocate(expandedContentHeight);
-      scrollViewRef.current?.scrollIntoView(locationRect);
-    }
-  }, []);
+  const onBeforeExpand = useCallback(
+    (locationRect: DOMRect, expandedContentHeight: number, invokedByUser: boolean) => {
+      if (invokedByUser) {
+        locationRect.height += expandedContentHeight;
+        spacePreAllocationViewRef.current?.allocate(expandedContentHeight);
+        scrollViewRef.current?.scrollIntoView(locationRect);
+      }
+    },
+    [],
+  );
 
   return {
     expandedLocations: expandedLocationsMap[locationType],
diff --git a/gui/src/renderer/components/select-location/RelayLocationList.tsx b/gui/src/renderer/components/select-location/RelayLocationList.tsx
index 0ae5905a61..f22695d775 100644
--- a/gui/src/renderer/components/select-location/RelayLocationList.tsx
+++ b/gui/src/renderer/components/select-location/RelayLocationList.tsx
@@ -15,7 +15,11 @@ interface CommonProps {
   onSelect: (value: LocationSelection<never>) => void;
   onExpand: (location: RelayLocation) => void;
   onCollapse: (location: RelayLocation) => void;
-  onWillExpand: (locationRect: DOMRect, expandedContentHeight: number, invokedByUser: boolean) => void;
+  onWillExpand: (
+    locationRect: DOMRect,
+    expandedContentHeight: number,
+    invokedByUser: boolean,
+  ) => void;
   onTransitionEnd: () => void;
 }
 
diff --git a/gui/src/renderer/components/select-location/ScrollPositionContext.tsx b/gui/src/renderer/components/select-location/ScrollPositionContext.tsx
index c6c5b5de8c..cdb7aba044 100644
--- a/gui/src/renderer/components/select-location/ScrollPositionContext.tsx
+++ b/gui/src/renderer/components/select-location/ScrollPositionContext.tsx
@@ -67,7 +67,7 @@ export function ScrollPositionContextProvider(props: ScrollPositionContextProps)
       saveScrollPosition,
       resetScrollPositions,
     }),
-    [],
+    [saveScrollPosition, resetScrollPositions],
   );
 
   // Restore the scroll position when parameters change