Move Apple Services Bypass toggle to settings

mullvad · Sep 24, 2024 · b10d9f1 · b10d9f1
1 parent 288f4b8
commit b10d9f1
Show file tree

Hide file tree

Showing 2 changed files with 51 additions and 41 deletions.
diff --git a/gui/src/renderer/components/Settings.tsx b/gui/src/renderer/components/Settings.tsx
@@ -7,10 +7,20 @@ import { useAppContext } from '../context';
 import { useHistory } from '../lib/history';
 import { RoutePath } from '../lib/routes';
 import { useSelector } from '../redux/store';
-import { AriaDescribed, AriaDescription, AriaDescriptionGroup } from './AriaGroup';
+import {
+  AriaDescribed,
+  AriaDescription,
+  AriaDescriptionGroup,
+  AriaDetails,
+  AriaInput,
+  AriaInputGroup,
+  AriaLabel,
+} from './AriaGroup';
 import * as Cell from './cell';
+import InfoButton from './InfoButton';
 import { BackAction } from './KeyboardNavigation';
 import { Layout, SettingsContainer } from './Layout';
+import { ModalMessage } from './Modal';
 import { NavigationBar, NavigationContainer, NavigationItems, TitleBarItem } from './NavigationBar';
 import SettingsHeader, { HeaderTitle } from './SettingsHeader';
 import {
@@ -28,6 +38,8 @@ export default function Support() {
   const connectedToDaemon = useSelector((state) => state.userInterface.connectedToDaemon);
   const isMacOs13OrNewer = useSelector((state) => state.userInterface.isMacOs13OrNewer);
 
+  const isMacOs14p6OrNewer = useSelector((state) => state.userInterface.isMacOs14p6OrNewer);
+
   const showSubSettings = loginState.type === 'ok' && connectedToDaemon;
   const showSplitTunneling = window.env.platform !== 'darwin' || isMacOs13OrNewer;
 
@@ -82,6 +94,8 @@ export default function Support() {
                     <AppVersionButton />
                   </Cell.Group>
 
+                  <Cell.Group>{isMacOs14p6OrNewer ? <AppleServicesBypass /> : null}</Cell.Group>
+
                   {window.env.development && (
                     <Cell.Group>
                       <DebugButton />
@@ -227,6 +241,42 @@ function SupportButton() {
   );
 }
 
+function AppleServicesBypass() {
+  const { setAppleServicesBypass } = useAppContext();
+  const appleServicesBypass = useSelector((state) => state.settings.appleServicesBypass);
+
+  return (
+    <AriaInputGroup>
+      <Cell.Container>
+        <AriaLabel>
+          <Cell.InputLabel>
+            {messages.pgettext('settings-view', 'Apple Services Bypass')}
+          </Cell.InputLabel>
+        </AriaLabel>
+        <AriaDetails>
+          <InfoButton>
+            <ModalMessage>
+              {messages.pgettext(
+                'settings-view',
+                'Some Apple services such as iMessage have an issue where the network settings set by Mullvad get ignored, this in turn blocks those apps. Enabling this setting allows traffic to specific Apple-owned networks to go outside of the VPN tunnel, allowing services like iMessage and FaceTime to work whilst using Mullvad.',
+              )}
+            </ModalMessage>
+            <ModalMessage>
+              {messages.pgettext(
+                'settings-view',
+                'Attention: This traffic will go outside of the VPN tunnel. Any application that tries to can bypass the VPN tunnel and send traffic to these Apple networks. This a temporary fix and we are currently working on a long-term solution.',
+              )}
+            </ModalMessage>
+          </InfoButton>
+        </AriaDetails>
+        <AriaInput>
+          <Cell.Switch isOn={appleServicesBypass} onChange={setAppleServicesBypass} />
+        </AriaInput>
+      </Cell.Container>
+    </AriaInputGroup>
+  );
+}
+
 function DebugButton() {
   const history = useHistory();
   const navigate = useCallback(() => history.push(RoutePath.debug), [history]);

diff --git a/gui/src/renderer/components/VpnSettings.tsx b/gui/src/renderer/components/VpnSettings.tsx
@@ -67,8 +67,6 @@ const IndentedValueLabel = styled(Cell.ValueLabel)({
 export default function VpnSettings() {
   const { pop } = useHistory();
 
-  const isMacOs14p6OrNewer = useSelector((state) => state.userInterface.isMacOs14p6OrNewer);
-
   return (
     <BackAction action={pop}>
       <Layout>
@@ -129,8 +127,6 @@ export default function VpnSettings() {
                 <Cell.Group>
                   <IpOverrideButton />
                 </Cell.Group>
-
-                <Cell.Group>{isMacOs14p6OrNewer ? <AppleServicesBypass /> : null}</Cell.Group>
               </StyledContent>
             </NavigationScrollbars>
           </NavigationContainer>
@@ -797,39 +793,3 @@ function IpOverrideButton() {
     </Cell.CellNavigationButton>
   );
 }
-
-function AppleServicesBypass() {
-  const { setAppleServicesBypass } = useAppContext();
-  const appleServicesBypass = useSelector((state) => state.settings.appleServicesBypass);
-
-  return (
-    <AriaInputGroup>
-      <Cell.Container>
-        <AriaLabel>
-          <Cell.InputLabel>
-            {messages.pgettext('vpn-settings-view', 'Apple Services Bypass')}
-          </Cell.InputLabel>
-        </AriaLabel>
-        <AriaDetails>
-          <InfoButton>
-            <ModalMessage>
-              {messages.pgettext(
-                'vpn-settings-view',
-                'Some Apple services such as iMessage have an issue where the network settings set by Mullvad get ignored, this in turn blocks those apps. Enabling this setting allows traffic to specific Apple-owned networks to go outside of the VPN tunnel, allowing services like iMessage and FaceTime to work whilst using Mullvad.',
-              )}
-            </ModalMessage>
-            <ModalMessage>
-              {messages.pgettext(
-                'vpn-settings-view',
-                'Attention: This traffic will go outside of the VPN tunnel. Any application that tries to can bypass the VPN tunnel and send traffic to these Apple networks. This a temporary fix and we are currently working on a long-term solution.',
-              )}
-            </ModalMessage>
-          </InfoButton>
-        </AriaDetails>
-        <AriaInput>
-          <Cell.Switch isOn={appleServicesBypass} onChange={setAppleServicesBypass} />
-        </AriaInput>
-      </Cell.Container>
-    </AriaInputGroup>
-  );
-}