infer endpoint root in production mode

(cherry picked from commit 57367c8)

Author: rjwats

interface/.env.development

@@ -1,4 +1,4 @@
 # Change the IP address to that of your ESP device to enable local development of the UI.
 # Remember to also enable CORS in platformio.ini before uploading the code to the device.
-REACT_APP_ENDPOINT_ROOT=http://192.168.0.99/rest/
+REACT_APP_HTTP_ROOT=http://192.168.0.99
 REACT_APP_WEB_SOCKET_ROOT=ws://192.168.0.99

interface/.env.production

@@ -1,2 +1 @@
-REACT_APP_ENDPOINT_ROOT=/rest/
 GENERATE_SOURCEMAP=false

interface/src/api/Env.ts

@@ -1,20 +1,24 @@
 export const PROJECT_NAME = process.env.REACT_APP_PROJECT_NAME!;
 export const PROJECT_PATH = process.env.REACT_APP_PROJECT_PATH!;
-export const ENDPOINT_ROOT = process.env.REACT_APP_ENDPOINT_ROOT!;
 
-// TODO use same approach for rest endpoint?
-export const WEB_SOCKET_ROOT = calculateWebSocketPrefix("/ws");
+export const ENDPOINT_ROOT = calculateEndpointRoot("/rest/");
+export const WEB_SOCKET_ROOT = calculateWebSocketRoot("/ws/");
 
-function calculateWebSocketPrefix(webSocketPath: string) {
+function calculateEndpointRoot(endpointPath: string) {
+    const httpRoot = process.env.REACT_APP_HTTP_ROOT;
+    if (httpRoot) {
+        return httpRoot + endpointPath;
+    }
+    const location = window.location;
+    return location.protocol + "//" + location.host + endpointPath;
+}
+
+function calculateWebSocketRoot(webSocketPath: string) {
     const webSocketRoot = process.env.REACT_APP_WEB_SOCKET_ROOT;
-    if (!webSocketRoot || webSocketRoot.length === 0) {
-        var loc = window.location, webSocketURI;
-        if (loc.protocol === "https:") {
-            webSocketURI = "wss:";
-        } else {
-            webSocketURI = "ws:";
-        }
-        return webSocketURI + "//" + loc.host + webSocketPath;
+    if (webSocketRoot) {
+        return webSocketRoot + webSocketPath;
     }
-    return webSocketRoot + webSocketPath;
+    const location = window.location;
+    const webProtocol = location.protocol === "https:" ? "wss:" : "ws:";
+    return webProtocol + "//" + location.host + webSocketPath;
 }

interface/src/project/LightSettingsSocketController.tsx

@@ -8,7 +8,7 @@ import { SectionContent, BlockFormControlLabel } from '../components';
 
 import { LightSettings } from './types';
 
-export const LIGHT_SETTINGS_WEBSOCKET_URL = WEB_SOCKET_ROOT + "/lightSettings";
+export const LIGHT_SETTINGS_WEBSOCKET_URL = WEB_SOCKET_ROOT + "lightSettings";
 
 type LightSettingsSocketControllerProps = SocketControllerProps<LightSettings>;