From e0434726f38394bcb336baf57672f275d4feec15 Mon Sep 17 00:00:00 2001
From: Matteo Luppi <100372313+lups2000@users.noreply.github.com>
Date: Wed, 11 Dec 2024 16:57:19 +0100
Subject: [PATCH] Exposing 'localModeUnavailable' to the frontend (#7390)

* expose localModeUnavailable

* adapt frontend

* update gen file

* [autofix.ci] apply automated fixes

* add default description

* style

* use 'localModeUnavailable' to check

---------

Co-authored-by: autofix-ci[bot] <114827586+autofix-ci[bot]@users.noreply.github.com>
---
 mitmproxy/tools/web/app.py                   |  1 +
 web/gen/state_js.py                          |  1 +
 web/src/js/__tests__/ducks/_tbackendstate.ts |  1 +
 web/src/js/components/Modes.tsx              | 14 ++++++++------
 web/src/js/ducks/backendState.ts             |  2 ++
 5 files changed, 13 insertions(+), 6 deletions(-)

diff --git a/mitmproxy/tools/web/app.py b/mitmproxy/tools/web/app.py
index 5352f8a79..46e2c8d46 100644
--- a/mitmproxy/tools/web/app.py
+++ b/mitmproxy/tools/web/app.py
@@ -655,6 +655,7 @@ class State(RequestHandler):
                 s.mode.full_spec: s.to_json() for s in master.proxyserver.servers
             },
             "platform": sys.platform,
+            "localModeUnavailable": mitmproxy_rs.local.LocalRedirector.unavailable_reason(),
         }
 
     def get(self):
diff --git a/web/gen/state_js.py b/web/gen/state_js.py
index 0d3becf7c..c8d1672dc 100755
--- a/web/gen/state_js.py
+++ b/web/gen/state_js.py
@@ -50,6 +50,7 @@ async def make() -> str:
     data["contentViews"] = ["Auto", "Raw"]
     data["version"] = "1.2.3"
     data["platform"] = "darwin"
+    data["localModeUnavailable"] = None
 
     # language=TypeScript
     content = (
diff --git a/web/src/js/__tests__/ducks/_tbackendstate.ts b/web/src/js/__tests__/ducks/_tbackendstate.ts
index c87e049ba..942a63bd7 100644
--- a/web/src/js/__tests__/ducks/_tbackendstate.ts
+++ b/web/src/js/__tests__/ducks/_tbackendstate.ts
@@ -7,6 +7,7 @@ export function TBackendState(): Required<BackendState> {
             "Auto",
             "Raw"
         ],
+        "localModeUnavailable": null,
         "platform": "darwin",
         "servers": {
             "regular": {
diff --git a/web/src/js/components/Modes.tsx b/web/src/js/components/Modes.tsx
index 78c0cca93..ff1e1e88e 100644
--- a/web/src/js/components/Modes.tsx
+++ b/web/src/js/components/Modes.tsx
@@ -11,7 +11,10 @@ import Dns from "./Modes/Dns";
 import MissingMode from "./Modes/MissingMode";
 
 export default function Modes() {
-    const platform = useAppSelector((state) => state.backendState.platform);
+    const { platform, localModeUnavailable } = useAppSelector(
+        (state) => state.backendState,
+    );
+
     return (
         <div className="modes">
             <h2>Intercept Traffic</h2>
@@ -21,14 +24,13 @@ export default function Modes() {
                 <h3>Recommended</h3>
                 <div className="modes-container">
                     <Regular />
-                    {platform.startsWith("win32") ||
-                    platform.startsWith("darwin") ? (
-                        <Local />
-                    ) : (
+                    {localModeUnavailable !== null ? (
                         <MissingMode
                             title="Local Redirect Mode"
-                            description="This mode is only supported on Windows and MacOS."
+                            description={localModeUnavailable}
                         />
+                    ) : (
+                        <Local />
                     )}
                     <Wireguard />
                     <Reverse />
diff --git a/web/src/js/ducks/backendState.ts b/web/src/js/ducks/backendState.ts
index 4ffeff793..2120b8198 100644
--- a/web/src/js/ducks/backendState.ts
+++ b/web/src/js/ducks/backendState.ts
@@ -25,6 +25,7 @@ export interface BackendState {
     contentViews: string[];
     servers: { [key: string]: ServerInfo };
     platform: string;
+    localModeUnavailable: string | null;
 }
 
 export const defaultState: BackendState = {
@@ -33,6 +34,7 @@ export const defaultState: BackendState = {
     contentViews: [],
     servers: {},
     platform: "",
+    localModeUnavailable: null,
 };
 
 export function mockUpdate(newState: Partial<BackendState>) {