Replace "smart routing" with "direct only" in gui code

4 files changed, 36 insertions, 58 deletions

diff --git a/gui/src/renderer/components/DaitaSettings.tsx b/gui/src/renderer/components/DaitaSettings.tsx
index b4ee10c94d..6a9d7fad3f 100644
--- a/gui/src/renderer/components/DaitaSettings.tsx
+++ b/gui/src/renderer/components/DaitaSettings.tsx
@@ -95,9 +95,18 @@ export default function DaitaSettings() {
                         )}
                       </StyledHeaderSubTitle>
                       <StyledHeaderSubTitle>
+                        {sprintf(
+                          messages.pgettext(
+                            'wireguard-settings-view',
+                            'Not all our servers are %(daita)s-enabled. We use multihop automatically to use %(daita)s with any server.',
+                          ),
+                          { daita: strings.daita, daitaFull: strings.daitaFull },
+                        )}
+                      </StyledHeaderSubTitle>
+                      <StyledHeaderSubTitle>
                         {messages.pgettext(
                           'wireguard-settings-view',
-                          'Can only be used with WireGuard. Since this increases your total network traffic, be cautious if you have a limited data plan. It can also negatively impact your network speed.',
+                          'Attention: Be cautious if you have a limited data plan as this feature will increase your network traffic. This feature can only be used with WireGuard.',
                         )}
                       </StyledHeaderSubTitle>
                     </React.Fragment>,
@@ -119,11 +128,11 @@ export default function DaitaSettings() {
 }
 
 function DaitaToggle() {
-  const { setEnableDaita, setDaitaSmartRouting } = useAppContext();
+  const { setEnableDaita, setDaitaDirectOnly } = useAppContext();
   const relaySettings = useSelector((state) => state.settings.relaySettings);
   const daita = useSelector((state) => state.settings.wireguard.daita?.enabled ?? false);
-  const smartRouting = useSelector(
-    (state) => state.settings.wireguard.daita?.smartRouting ?? false,
+  const directOnly = useSelector(
+    (state) => state.settings.wireguard.daita?.directOnly ?? false,
   );
 
   const [confirmationDialogVisible, showConfirmationDialog, hideConfirmationDialog] = useBoolean();
@@ -135,16 +144,16 @@ function DaitaToggle() {
     void setEnableDaita(value);
   }, []);
 
-  const setSmartRouting = useCallback((value: boolean) => {
+  const setDirectOnly = useCallback((value: boolean) => {
     if (value) {
-      void setDaitaSmartRouting(value);
-    } else {
       showConfirmationDialog();
+    } else {
+      void setDaitaDirectOnly(value);
     }
   }, []);
 
-  const confirmDisableSmartRouting = useCallback(() => {
-    void setDaitaSmartRouting(false);
+  const confirmEnableDirectOnly = useCallback(() => {
+    void setDaitaDirectOnly(true);
     hideConfirmationDialog();
   }, []);
 
@@ -170,13 +179,13 @@ function DaitaToggle() {
       <AriaInputGroup>
         <Cell.Container disabled={!daita || unavailable}>
           <AriaLabel>
-            <Cell.InputLabel>{messages.gettext('Smart routing')}</Cell.InputLabel>
+            <Cell.InputLabel>{messages.gettext('Direct only')}</Cell.InputLabel>
           </AriaLabel>
           <InfoButton>
-            <SmartRoutingModalMessage />
+            <DirectOnlyModalMessage />
           </InfoButton>
           <AriaInput>
-            <Cell.Switch isOn={smartRouting && !unavailable} onChange={setSmartRouting} />
+            <Cell.Switch isOn={directOnly && !unavailable} onChange={setDirectOnly} />
           </AriaInput>
         </Cell.Container>
         <Cell.CellFooter>
@@ -185,7 +194,7 @@ function DaitaToggle() {
               {sprintf(
                 messages.pgettext(
                   'vpn-settings-view',
-                  'Makes it possible to use %(daita)s with any server and is automatically enabled.',
+                  'Manually choose which %(daita)s-enabled server to use.',
                 ),
                 { daita: strings.daita },
               )}
@@ -199,12 +208,12 @@ function DaitaToggle() {
         gridButtons={[
           <SmallButton
             key="confirm"
-            onClick={confirmDisableSmartRouting}
+            onClick={confirmEnableDirectOnly}
             color={SmallButtonColor.blue}>
-            {messages.gettext('Disable anyway')}
+            {messages.gettext('Enable "Direct only"')}
           </SmallButton>,
           <SmallButton key="cancel" onClick={hideConfirmationDialog} color={SmallButtonColor.blue}>
-            {messages.pgettext('wireguard-settings-view', 'Use Smart routing')}
+            {messages.pgettext('wireguard-settings-view', 'Cancel')}
           </SmallButton>,
         ]}
         close={hideConfirmationDialog}>
@@ -213,7 +222,7 @@ function DaitaToggle() {
             // TRANSLATORS: Warning text in a dialog that is displayed after a setting is toggled.
             messages.pgettext(
               'wireguard-settings-view',
-              'Not all our servers are %(daita)s-enabled. In order to use the internet, you might have to select a new location after disabling, or you can continue using %(daita)s with Smart routing.',
+              'Not all our servers are %(daita)s-enabled. In order to use the internet, you might have to select a new location after enabling.',
             ),
             { daita: strings.daita },
           )}
@@ -223,13 +232,13 @@ function DaitaToggle() {
   );
 }
 
-export function SmartRoutingModalMessage() {
+function DirectOnlyModalMessage() {
   return (
     <ModalMessage>
       {sprintf(
         messages.pgettext(
           'wireguard-settings-view',
-          'Not all our servers are %(daita)s-enabled. Smart routing allows %(daita)s to be used at any location. It does this by using multihop in the background to route your traffic via the closest %(daita)s-enabled server first.',
+          'By enabling “Direct only” you will have to manually select a server that is %(daita)s-enabled. This can cause you to end up in a blocked state until you have selected a compatible server in the “Select location” view.',
         ),
         {
           daita: strings.daita,
diff --git a/gui/src/renderer/components/main-view/FeatureIndicators.tsx b/gui/src/renderer/components/main-view/FeatureIndicators.tsx
index a4bf8659c6..2d7914fd87 100644
--- a/gui/src/renderer/components/main-view/FeatureIndicators.tsx
+++ b/gui/src/renderer/components/main-view/FeatureIndicators.tsx
@@ -5,13 +5,10 @@ import styled from 'styled-components';
 import { colors, strings } from '../../../config.json';
 import { FeatureIndicator } from '../../../shared/daemon-rpc-types';
 import { messages } from '../../../shared/gettext';
-import { useBoolean, useStyledRef } from '../../lib/utilityHooks';
+import { useStyledRef } from '../../lib/utilityHooks';
 import { useSelector } from '../../redux/store';
 import { tinyText } from '../common-styles';
-import { SmartRoutingModalMessage } from '../DaitaSettings';
 import { InfoIcon } from '../InfoButton';
-import { ModalAlert, ModalAlertType } from '../Modal';
-import { SmallButton, SmallButtonColor } from '../SmallButton';
 import { ConnectionPanelAccordion } from './styles';
 
 const LINE_HEIGHT = 22;
@@ -102,11 +99,6 @@ interface FeatureIndicatorsProps {
 // we can count those and add another ellipsis element which is visible and place it after the last
 // visible indicator.
 export default function FeatureIndicators(props: FeatureIndicatorsProps) {
-  const [
-    daitaSmartRoutingDialogueVisible,
-    showDaitaSmartRoutingDialogue,
-    hideDaitaSmartRoutingDialogue,
-  ] = useBoolean();
   const tunnelState = useSelector((state) => state.connection.status);
   const ellipsisRef = useStyledRef<HTMLSpanElement>();
   const ellipsisSpacerRef = useStyledRef<HTMLSpanElement>();
@@ -127,9 +119,8 @@ export default function FeatureIndicators(props: FeatureIndicatorsProps) {
 
   // Returns an optional callback for clickable feature indicators, or undefined.
   const getFeatureIndicatorOnClick = (indicator: FeatureIndicator) => {
+    // NOTE: With the "smart routing" feature indicator removed, this function now does nothing, should it be removed?
     switch (indicator) {
-      case FeatureIndicator.daitaSmartRouting:
-        return showDaitaSmartRoutingDialogue;
       default:
         return undefined;
     }
@@ -231,21 +222,6 @@ export default function FeatureIndicators(props: FeatureIndicatorsProps) {
           />
         </StyledFeatureIndicators>
       </StyledFeatureIndicatorsContainer>
-
-      <ModalAlert
-        isOpen={daitaSmartRoutingDialogueVisible}
-        type={ModalAlertType.info}
-        gridButtons={[
-          <SmallButton
-            key="dismiss"
-            onClick={hideDaitaSmartRoutingDialogue}
-            color={SmallButtonColor.blue}>
-            {messages.gettext('Got it!')}
-          </SmallButton>,
-        ]}
-        close={hideDaitaSmartRoutingDialogue}>
-        <SmartRoutingModalMessage />
-      </ModalAlert>
     </StyledAccordion>
   );
 }
@@ -276,13 +252,6 @@ function getFeatureIndicatorLabel(indicator: FeatureIndicator) {
   switch (indicator) {
     case FeatureIndicator.daita:
       return strings.daita;
-    case FeatureIndicator.daitaSmartRouting:
-      return sprintf(
-        // TRANSLATORS: This refers to the Smart Routing setting in the VPN settings view.
-        // TRANSLATORS: This is displayed when both Smart Routing and DAITA features are on.
-        messages.gettext('%(daita)s: Smart routing'),
-        { daita: strings.daita },
-      );
     case FeatureIndicator.udp2tcp:
     case FeatureIndicator.shadowsocks:
       return messages.pgettext('wireguard-settings-view', 'Obfuscation');
diff --git a/gui/src/renderer/components/select-location/RelayListContext.tsx b/gui/src/renderer/components/select-location/RelayListContext.tsx
index 241d11fbdc..ab568a088d 100644
--- a/gui/src/renderer/components/select-location/RelayListContext.tsx
+++ b/gui/src/renderer/components/select-location/RelayListContext.tsx
@@ -62,8 +62,8 @@ interface RelayListContextProviderProps {
 export function RelayListContextProvider(props: RelayListContextProviderProps) {
   const { locationType, searchTerm } = useSelectLocationContext();
   const daita = useSelector((state) => state.settings.wireguard.daita?.enabled ?? false);
-  const smartRouting = useSelector(
-    (state) => state.settings.wireguard.daita?.smartRouting ?? false,
+  const directOnly = useSelector(
+    (state) => state.settings.wireguard.daita?.directOnly ?? false,
   );
 
   const fullRelayList = useSelector((state) => state.settings.relayLocations);
@@ -81,7 +81,7 @@ export function RelayListContextProvider(props: RelayListContextProviderProps) {
     return filterLocationsByDaita(
       relayListForEndpointType,
       daita,
-      smartRouting,
+      directOnly,
       locationType,
       relaySettings?.tunnelProtocol ?? 'any',
       relaySettings?.wireguard.useMultihop ?? false,
diff --git a/gui/src/renderer/components/select-location/SelectLocation.tsx b/gui/src/renderer/components/select-location/SelectLocation.tsx
index 9cd66f98f4..f61f5144e1 100644
--- a/gui/src/renderer/components/select-location/SelectLocation.tsx
+++ b/gui/src/renderer/components/select-location/SelectLocation.tsx
@@ -68,12 +68,12 @@ export default function SelectLocation() {
   const providers = relaySettings?.providers ?? [];
   const filteredProviders = useFilteredProviders(providers, ownership);
   const daita = useSelector((state) => state.settings.wireguard.daita?.enabled ?? false);
-  const smartRouting = useSelector(
-    (state) => state.settings.wireguard.daita?.smartRouting ?? false,
+  const directOnly = useSelector(
+    (state) => state.settings.wireguard.daita?.directOnly ?? false,
   );
   const showDaitaFilter = daitaFilterActive(
     daita,
-    smartRouting,
+    directOnly,
     locationType,
     relaySettings?.tunnelProtocol ?? 'any',
     relaySettings?.wireguard.useMultihop ?? false,