From 22210f925b16902e4c1bede57aba3558a635859c Mon Sep 17 00:00:00 2001
From: Tomas Chmelevskij <chmelevskij@users.noreply.github.com>
Date: Mon, 18 Sep 2023 23:35:02 +0300
Subject: [PATCH] fix: presets styling for web (#3585)

* fix: presets styling for web

* feat: add `isWeb` helper
---
 src/js/browserMain.js    | 8 +++-----
 src/js/msp.js            | 7 ++++---
 src/js/port_handler.js   | 3 ++-
 src/js/serial_backend.js | 7 ++++---
 src/js/utils/isWeb.js    | 3 +++
 5 files changed, 16 insertions(+), 12 deletions(-)
 create mode 100644 src/js/utils/isWeb.js

diff --git a/src/js/browserMain.js b/src/js/browserMain.js
index a03336f07f..2e7549a6dc 100644
--- a/src/js/browserMain.js
+++ b/src/js/browserMain.js
@@ -21,12 +21,10 @@ import "../css/tabs/led_strip.less";
 import "../css/tabs/sensors.less";
 import "../css/tabs/cli.less";
 import "../tabs/presets/presets.less";
-// TODO: for some reason can't resolve these less files
-// import "../tabs/presets/TitlePanel/PresetTitlePanel.less";
+import "../tabs/presets/TitlePanel/PresetTitlePanel.css";
 import "../tabs/presets/DetailedDialog/PresetsDetailedDialog.less";
-// TODO: for some reason can't resolve these less files
-// import "../tabs/presets/SourcesDialog/SourcesDialog.less";
-// import "../tabs/presets/SourcesDialog/SourcePanel.less";
+import "../tabs/presets/SourcesDialog/SourcesDialog.css";
+import "../tabs/presets/SourcesDialog/SourcePanel.css";
 import "../css/tabs/logging.less";
 import "../css/tabs/onboard_logging.less";
 import "../css/tabs/firmware_flasher.less";
diff --git a/src/js/msp.js b/src/js/msp.js
index e718014262..8956641d7e 100644
--- a/src/js/msp.js
+++ b/src/js/msp.js
@@ -2,8 +2,9 @@ import GUI from "./gui.js";
 import CONFIGURATOR from "./data_storage.js";
 import serialNWJS from "./serial.js";
 import serialWeb from "./webSerial.js";
+import { isWeb } from "./utils/isWeb.js";
 
-const serial = import.meta.env ? serialWeb : serialNWJS;
+const serial = isWeb() ? serialWeb : serialNWJS;
 
 const MSP = {
     symbols: {
@@ -307,7 +308,7 @@ const MSP = {
         return bufferOut;
     },
     send_message(code, data, callback_sent, callback_msp, doCallbackOnError) {
-        const connected = import.meta.env ? serial.connected : serial.connectionId;
+        const connected = isWeb ? serial.connected : serial.connectionId;
         if (code === undefined || !connected || CONFIGURATOR.virtualMode) {
             if (callback_msp) {
                 callback_msp();
@@ -324,7 +325,7 @@ const MSP = {
             }
         }
 
-        if (import.meta.env && (code === undefined || !serial.connectionInfo)) {
+        if (isWeb() && (code === undefined || !serial.connectionInfo)) {
           console.log('ERROR: code undefined or no connectionId');
           return false;
         }
diff --git a/src/js/port_handler.js b/src/js/port_handler.js
index a94a0314af..8ed57b7a8c 100644
--- a/src/js/port_handler.js
+++ b/src/js/port_handler.js
@@ -6,6 +6,7 @@ import { get as getConfig } from "./ConfigStorage";
 import serial from "./serial";
 import MdnsDiscovery from "./mdns_discovery";
 import $ from 'jquery';
+import { isWeb } from "./utils/isWeb";
 
 const TIMEOUT_CHECK = 500 ; // With 250 it seems that it produces a memory leak and slowdown in some versions, reason unknown
 
@@ -32,7 +33,7 @@ PortHandler.initialize = function () {
 
     // currently web build doesn't need port handler,
     // so just bail out.
-    if (import.meta.env) {
+    if (isWeb()) {
         return 'not implemented';
     }
 
diff --git a/src/js/serial_backend.js b/src/js/serial_backend.js
index 7267677ea8..eec08c34a7 100644
--- a/src/js/serial_backend.js
+++ b/src/js/serial_backend.js
@@ -26,8 +26,9 @@ import BuildApi from "./BuildApi";
 
 import serialNWJS from "./serial.js";
 import serialWeb from "./webSerial.js";
+import { isWeb } from "./utils/isWeb";
 
-const serial = import.meta.env ? serialWeb : serialNWJS;
+const serial = isWeb() ? serialWeb : serialNWJS;
 
 let mspHelper;
 let connectionTimestamp;
@@ -118,7 +119,7 @@ export function initializeSerialBackend() {
                         CONFIGURATOR.virtualApiVersion = $('#firmware-version-dropdown :selected').val();
 
                         serial.connect('virtual', {}, onOpenVirtual);
-                    } else if (import.meta.env) {
+                    } else if (isWeb()) {
                         // Explicitly disconnect the event listeners before attaching the new ones.
                         serial.removeEventListener('connect', connectHandler);
                         serial.addEventListener('connect', connectHandler);
@@ -327,7 +328,7 @@ function onOpen(openInfo) {
         result = getConfig('expertMode')?.expertMode ?? false;
         $('input[name="expertModeCheckbox"]').prop('checked', result).trigger('change');
 
-        if(import.meta.env) {
+        if(isWeb()) {
             serial.removeEventListener('receive', read_serial_adapter);
             serial.addEventListener('receive', read_serial_adapter);
         } else {
diff --git a/src/js/utils/isWeb.js b/src/js/utils/isWeb.js
new file mode 100644
index 0000000000..077d2d8e10
--- /dev/null
+++ b/src/js/utils/isWeb.js
@@ -0,0 +1,3 @@
+export function isWeb() {
+    return !!import.meta.env;
+}