Merge branch 'feature/wifi-ax-he-modes' into 'dev'

Add wifi 802.11ax HE modes

See merge request turris/reforis/foris-js!184

src/bootstrap/Select.js

@@ -1,5 +1,5 @@
 /*
- * Copyright (C) 2019-2021 CZ.NIC z.s.p.o. (http://www.nic.cz/)
+ * Copyright (C) 2019-2022 CZ.NIC z.s.p.o. (https://www.nic.cz/)
  *
  * This is free software, licensed under the GNU General Public License v3.
  * See /LICENSE for more information.
@@ -18,20 +18,14 @@ Select.propTypes = {
     value: PropTypes.oneOfType([PropTypes.string, PropTypes.number]).isRequired,
     /** Help text message. */
     helpText: PropTypes.string,
-    /** Turns on/off alphabetical ordering of the Select options. */
-    customOrder: PropTypes.bool,
 };
 
-export function Select({ label, choices, helpText, customOrder, ...props }) {
+export function Select({ label, choices, helpText, ...props }) {
     const uid = useUID();
 
-    const keys = Object.keys(choices);
-    if (!customOrder) {
-        keys.sort((a, b) => a - b || a.toString().localeCompare(b.toString()));
-    }
-    const options = keys.map((key) => (
-        <option key={key} value={key}>
-            {choices[key]}
+    const options = Object.keys(choices).map((choice) => (
+        <option key={choice} value={choice}>
+            {choices[choice]}
         </option>
     ));
 

src/common/WiFiSettings/WiFiForm.js

@@ -64,6 +64,7 @@ DeviceForm.propTypes = {
         channel: PropTypes.string.isRequired,
         guest_wifi: PropTypes.object.isRequired,
         encryption: PropTypes.string.isRequired,
+        available_bands: PropTypes.array.isRequired,
     }),
     formErrors: PropTypes.object.isRequired,
     setFormValue: PropTypes.func.isRequired,
@@ -87,6 +88,7 @@ function DeviceForm({
     ...props
 }) {
     const deviceID = formData.id;
+    const bnds = formData.available_bands;
     return (
         <>
             <Switch
@@ -159,18 +161,24 @@ function DeviceForm({
                         value={formData.hwmode}
                         helpText={HELP_TEXTS.hwmode}
                         inline
-                        onChange={setFormValue((value) => ({
-                            devices: {
-                                [deviceIndex]: {
-                                    hwmode: { $set: value },
-                                    channel: { $set: "0" },
-                                    htmode: {
-                                        $set:
-                                            value === "11a" ? "VHT80" : "HT20",
+                        onChange={setFormValue((value) => {
+                            // Get the last item in an array of available HT modes
+                            const [best2] = bnds[0].available_htmodes.slice(-1);
+                            const [best5] = bnds[1].available_htmodes.slice(-1);
+                            return {
+                                devices: {
+                                    [deviceIndex]: {
+                                        hwmode: { $set: value },
+                                        channel: { $set: "0" },
+                                        htmode: {
+                                            $set:
+                                                // Set HT mode depending on checked frequency
+                                                value === "11a" ? best5 : best2,
+                                        },
                                     },
                                 },
-                            },
-                        }))}
+                            };
+                        })}
                         {...props}
                     />
 
@@ -209,7 +217,6 @@ function DeviceForm({
                                 [deviceIndex]: { encryption: { $set: value } },
                             },
                         }))}
-                        customOrder
                         {...props}
                     />
 

src/common/WiFiSettings/__tests__/WiFiSettings.test.js

@@ -147,7 +147,7 @@ describe("<WiFiSettings/>", () => {
                     enabled: true,
                     guest_wifi: { enabled: false },
                     hidden: false,
-                    htmode: "HT20",
+                    htmode: "VHT80",
                     hwmode: "11g",
                     id: 0,
                     password: "TestPass",

src/common/WiFiSettings/__tests__/__snapshots__/WiFiSettings.test.js.snap

@@ -627,6 +627,11 @@ exports[`<WiFiSettings/> Snapshot one module enabled. 1`] = `
 +           id=\\"8\\"
 +         >
 +           <option
++             value=\\"NOHT\\"
++           >
++             Disabled
++           </option>
++           <option
 +             value=\\"HT20\\"
 +           >
 +             802.11n - 20 MHz wide channel
@@ -637,11 +642,6 @@ exports[`<WiFiSettings/> Snapshot one module enabled. 1`] = `
 +             802.11n - 40 MHz wide channel
 +           </option>
 +           <option
-+             value=\\"NOHT\\"
-+           >
-+             Disabled
-+           </option>
-+           <option
 +             value=\\"VHT20\\"
 +           >
 +             802.11ac - 20 MHz wide channel

src/common/WiFiSettings/constants.js

@@ -1,5 +1,5 @@
 /*
- * Copyright (C) 2019-2021 CZ.NIC z.s.p.o. (http://www.nic.cz/)
+ * Copyright (C) 2019-2022 CZ.NIC z.s.p.o. (https://www.nic.cz/)
  *
  * This is free software, licensed under the GNU General Public License v3.
  * See /LICENSE for more information.
@@ -13,6 +13,10 @@ export const HTMODES = {
     VHT40: _("802.11ac - 40 MHz wide channel"),
     VHT80: _("802.11ac - 80 MHz wide channel"),
     VHT160: _("802.11ac - 160 MHz wide channel"),
+    HE20: _("802.11ax - 20 MHz wide channel"),
+    HE40: _("802.11ax - 40 MHz wide channel"),
+    HE80: _("802.11ax - 80 MHz wide channel"),
+    HE160: _("802.11ax - 160 MHz wide channel"),
 };
 export const HWMODES = {
     "11g": "2.4",