diff options
6 files changed, 52 insertions, 76 deletions
diff --git a/gui/src/renderer/components/SplitTunnelingSettings.tsx b/gui/src/renderer/components/SplitTunnelingSettings.tsx index ecbdada23d..bf3b7f58b8 100644 --- a/gui/src/renderer/components/SplitTunnelingSettings.tsx +++ b/gui/src/renderer/components/SplitTunnelingSettings.tsx @@ -457,15 +457,10 @@ export function WindowsSplitTunnelingSettings(props: IPlatformSplitTunnelingSett <StyledNoResult> <StyledNoResultText> {formatHtml( - sprintf( - messages.gettext('No result for <b>%(searchTerm)s</b>.'), - { searchTerm }, - ), + sprintf(messages.gettext('No result for <b>%(searchTerm)s</b>.'), { searchTerm }), )} </StyledNoResultText> - <StyledNoResultText> - {messages.gettext('Try a different search.')} - </StyledNoResultText> + <StyledNoResultText>{messages.gettext('Try a different search.')}</StyledNoResultText> </StyledNoResult> )} diff --git a/gui/src/renderer/components/select-location/LocationRow.tsx b/gui/src/renderer/components/select-location/LocationRow.tsx index eb36efc7d3..eafae9c509 100644 --- a/gui/src/renderer/components/select-location/LocationRow.tsx +++ b/gui/src/renderer/components/select-location/LocationRow.tsx @@ -150,7 +150,7 @@ function LocationRow<C extends LocationSpecification>(props: IProps<C>) { userInvokedExpand.current = false; } }, - [props.onWillExpand], + [props.onWillExpand, expanded], ); // The selectedRef should only be used if the element is selected diff --git a/gui/src/renderer/components/select-location/SelectLocation.tsx b/gui/src/renderer/components/select-location/SelectLocation.tsx index 8684ae3d69..67080f5c21 100644 --- a/gui/src/renderer/components/select-location/SelectLocation.tsx +++ b/gui/src/renderer/components/select-location/SelectLocation.tsx @@ -6,7 +6,7 @@ import { Ownership } from '../../../shared/daemon-rpc-types'; import { messages } from '../../../shared/gettext'; import { useAppContext } from '../../context'; import { useHistory } from '../../lib/history'; -import {formatHtml} from '../../lib/html-formatter'; +import { formatHtml } from '../../lib/html-formatter'; import { RoutePath } from '../../lib/routes'; import { useNormalBridgeSettings, useNormalRelaySettings } from '../../lib/utilityHooks'; import { useSelector } from '../../redux/store'; @@ -76,12 +76,12 @@ export default function SelectLocation() { const onClearProviders = useCallback(async () => { resetScrollPositions(); await updateRelaySettings({ normal: { providers: [] } }); - }, []); + }, [resetScrollPositions]); const onClearOwnership = useCallback(async () => { resetScrollPositions(); await updateRelaySettings({ normal: { ownership: Ownership.any } }); - }, []); + }, [resetScrollPositions]); const changeLocationType = useCallback( (locationType: LocationType) => { @@ -97,7 +97,7 @@ export default function SelectLocation() { expandSearchResults(value); setSearchTerm(value); }, - [resetScrollPositions], + [resetScrollPositions, expandSearchResults], ); const showOwnershipFilter = ownership !== Ownership.any; @@ -247,19 +247,14 @@ function SelectLocationContent() { if (searchTerm !== '' && relayList.length === 0) { return ( - <StyledNoResult> - <StyledNoResultText> - {formatHtml( - sprintf( - messages.gettext('No result for <b>%(searchTerm)s</b>.'), - { searchTerm }, - ), - )} - </StyledNoResultText> - <StyledNoResultText> - {messages.gettext('Try a different search.')} - </StyledNoResultText> - </StyledNoResult> + <StyledNoResult> + <StyledNoResultText> + {formatHtml( + sprintf(messages.gettext('No result for <b>%(searchTerm)s</b>.'), { searchTerm }), + )} + </StyledNoResultText> + <StyledNoResultText>{messages.gettext('Try a different search.')}</StyledNoResultText> + </StyledNoResult> ); } else if (locationType === LocationType.exit) { return ( diff --git a/gui/src/renderer/components/select-location/SelectLocationContainer.tsx b/gui/src/renderer/components/select-location/SelectLocationContainer.tsx index 7f07931b7a..5843d5e6f4 100644 --- a/gui/src/renderer/components/select-location/SelectLocationContainer.tsx +++ b/gui/src/renderer/components/select-location/SelectLocationContainer.tsx @@ -1,6 +1,5 @@ import React, { useContext, useMemo, useState } from 'react'; -import { useNormalRelaySettings } from '../../lib/utilityHooks'; import { RelayListContextProvider } from './RelayListContext'; import { ScrollPositionContextProvider } from './ScrollPositionContext'; import { LocationType } from './select-location-types'; @@ -21,15 +20,11 @@ export function useSelectLocationContext() { } export default function SelectLocationContainer() { - const relaySettings = useNormalRelaySettings(); const [locationType, setLocationType] = useState(LocationType.exit); - const [searchTerm, setSearchTerm] = useState(''); const value = useMemo(() => ({ locationType, setLocationType, searchTerm, setSearchTerm }), [ locationType, - relaySettings?.ownership, - relaySettings?.providers, searchTerm, ]); diff --git a/gui/src/renderer/components/select-location/SpecialLocationList.tsx b/gui/src/renderer/components/select-location/SpecialLocationList.tsx index 6667f14fa9..98179a0c78 100644 --- a/gui/src/renderer/components/select-location/SpecialLocationList.tsx +++ b/gui/src/renderer/components/select-location/SpecialLocationList.tsx @@ -59,7 +59,7 @@ function SpecialLocationRow<T>(props: SpecialLocationRowProps<T>) { value: props.source.value, }); } - }, []); + }, [props.source.selected, props.onSelect, props.source.value]); const selectedRef = props.source.selected ? props.selectedElementRef : undefined; return ( diff --git a/gui/src/renderer/components/select-location/select-location-hooks.ts b/gui/src/renderer/components/select-location/select-location-hooks.ts index a29681ba25..a0f407b790 100644 --- a/gui/src/renderer/components/select-location/select-location-hooks.ts +++ b/gui/src/renderer/components/select-location/select-location-hooks.ts @@ -22,17 +22,14 @@ export function useOnSelectLocation() { const { locationType, setLocationType } = useSelectLocationContext(); const baseRelaySettings = useSelector((state) => state.settings.relaySettings); - const onSelectLocation = useCallback( - async (relayUpdate: RelaySettingsUpdate) => { - try { - await updateRelaySettings(relayUpdate); - } catch (e) { - const error = e as Error; - log.error(`Failed to select the exit location: ${error.message}`); - } - }, - [history], - ); + const onSelectLocation = useCallback(async (relayUpdate: RelaySettingsUpdate) => { + try { + await updateRelaySettings(relayUpdate); + } catch (e) { + const error = e as Error; + log.error(`Failed to select the exit location: ${error.message}`); + } + }, []); const onSelectExitLocation = useCallback( async (relayLocation: LocationSelection<never>) => { @@ -43,49 +40,43 @@ export function useOnSelectLocation() { await onSelectLocation(relayUpdate); await connectTunnel(); }, - [onSelectLocation, history], - ); - const onSelectEntryLocation = useCallback( - async (entryLocation: LocationSelection<never>) => { - setLocationType(LocationType.exit); - const relayUpdate = createWireguardRelayUpdater(baseRelaySettings) - .tunnel.wireguard((wireguard) => wireguard.entryLocation.exact(entryLocation.value)) - .build(); - await onSelectLocation(relayUpdate); - }, - [onSelectLocation], + [history], ); + const onSelectEntryLocation = useCallback(async (entryLocation: LocationSelection<never>) => { + setLocationType(LocationType.exit); + const relayUpdate = createWireguardRelayUpdater(baseRelaySettings) + .tunnel.wireguard((wireguard) => wireguard.entryLocation.exact(entryLocation.value)) + .build(); + await onSelectLocation(relayUpdate); + }, []); + return locationType === LocationType.exit ? onSelectExitLocation : onSelectEntryLocation; } export function useOnSelectBridgeLocation() { - const history = useHistory(); const { updateBridgeSettings } = useAppContext(); const { setLocationType } = useSelectLocationContext(); - return useCallback( - async (location: LocationSelection<SpecialBridgeLocationType>) => { - let bridgeUpdate; - if (location.type === LocationSelectionType.relay) { - bridgeUpdate = new BridgeSettingsBuilder().location.fromRaw(location.value).build(); - } else if ( - location.type === LocationSelectionType.special && - location.value === SpecialBridgeLocationType.closestToExit - ) { - bridgeUpdate = new BridgeSettingsBuilder().location.any().build(); - } + return useCallback(async (location: LocationSelection<SpecialBridgeLocationType>) => { + let bridgeUpdate; + if (location.type === LocationSelectionType.relay) { + bridgeUpdate = new BridgeSettingsBuilder().location.fromRaw(location.value).build(); + } else if ( + location.type === LocationSelectionType.special && + location.value === SpecialBridgeLocationType.closestToExit + ) { + bridgeUpdate = new BridgeSettingsBuilder().location.any().build(); + } - if (bridgeUpdate) { - setLocationType(LocationType.exit); - try { - await updateBridgeSettings(bridgeUpdate); - } catch (e) { - const error = e as Error; - log.error(`Failed to select the bridge location: ${error.message}`); - } + if (bridgeUpdate) { + setLocationType(LocationType.exit); + try { + await updateBridgeSettings(bridgeUpdate); + } catch (e) { + const error = e as Error; + log.error(`Failed to select the bridge location: ${error.message}`); } - }, - [history, updateBridgeSettings], - ); + } + }, []); } |