GGLinnk/foris-js
1
0
Fork 0
mirror of https://gitlab.nic.cz/turris/reforis/foris-js.git synced 2024-12-25 00:11:36 +01:00
Code Issues Releases Activity

Merge branch 'feature/wifi-API-update' into 'master'

Browse Source 
WiFi API update

See merge request turris/reforis/foris-js!252
This commit is contained in:
Štěpán Henek 2024-12-11 10:24:28 +01:00
commit eafbc01c73
5 changed files with 54 additions and 53 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

42
src/common/WiFiSettings/WiFiForm.js
View File

@ -9,7 +9,7 @@ import React from "react";
import PropTypes from "prop-types"; import PropTypes from "prop-types";
import { HELP_TEXTS, HTMODES, HWMODES, ENCRYPTIONMODES } from "./constants"; import { HELP_TEXTS, HTMODES, BANDS, ENCRYPTIONMODES } from "./constants";
import WifiGuestForm from "./WiFiGuestForm"; import WifiGuestForm from "./WiFiGuestForm";
import WiFiQRCode from "./WiFiQRCode"; import WiFiQRCode from "./WiFiQRCode";
import PasswordInput from "../../bootstrap/PasswordInput"; import PasswordInput from "../../bootstrap/PasswordInput";
@ -60,7 +60,7 @@ DeviceForm.propTypes = {
SSID: PropTypes.string.isRequired, SSID: PropTypes.string.isRequired,
password: PropTypes.string.isRequired, password: PropTypes.string.isRequired,
hidden: PropTypes.bool.isRequired, hidden: PropTypes.bool.isRequired,
hwmode: PropTypes.string.isRequired, band: PropTypes.string.isRequired,
htmode: PropTypes.string.isRequired, htmode: PropTypes.string.isRequired,
channel: PropTypes.string.isRequired, channel: PropTypes.string.isRequired,
guest_wifi: PropTypes.object.isRequired, guest_wifi: PropTypes.object.isRequired,
@ -155,26 +155,26 @@ function DeviceForm({
/> />
<RadioSet <RadioSet
name={`hwmode-${deviceID}`} name={`band-${deviceID}`}
label="GHz" label={_("Band")}
choices={getHwmodeChoices(formData)} choices={getBandChoices(formData)}
value={formData.hwmode} value={formData.band}
helpText={HELP_TEXTS.hwmode} helpText={HELP_TEXTS.band}
inline inline
onChange={setFormValue((value) => { onChange={setFormValue((value) => {
// Get the last item in an array of available HT modes // Find the selected band
const [best2] = bnds[0].available_htmodes.slice(-1); const selectedBand = bnds.find(
const [best5] = bnds[1].available_htmodes.slice(-1); (band) => band.band === value
);
// Get the last item in the available HT modes for the selected band
const bestHtmode =
selectedBand.available_htmodes.slice(-1)[0];
return { return {
devices: { devices: {
[deviceIndex]: { [deviceIndex]: {
hwmode: { $set: value }, band: { $set: value },
channel: { $set: "0" }, channel: { $set: "0" },
htmode: { htmode: { $set: bestHtmode },
$set:
// Set HT mode depending on checked frequency
value === "11a" ? best5 : best2,
},
}, },
}, },
}; };
@ -263,7 +263,7 @@ function getChannelChoices(device) {
}; };
device.available_bands.forEach((availableBand) => { device.available_bands.forEach((availableBand) => {
if (availableBand.hwmode !== device.hwmode) return; if (availableBand.band !== device.band) return;
availableBand.available_channels.forEach((availableChannel) => { availableBand.available_channels.forEach((availableChannel) => {
channelChoices[availableChannel.number.toString()] = ` channelChoices[availableChannel.number.toString()] = `
@ -282,7 +282,7 @@ function getHtmodeChoices(device) {
const htmodeChoices = {}; const htmodeChoices = {};
device.available_bands.forEach((availableBand) => { device.available_bands.forEach((availableBand) => {
if (availableBand.hwmode !== device.hwmode) return; if (availableBand.band !== device.band) return;
availableBand.available_htmodes.forEach((availableHtmod) => { availableBand.available_htmodes.forEach((availableHtmod) => {
htmodeChoices[availableHtmod] = HTMODES[availableHtmod]; htmodeChoices[availableHtmod] = HTMODES[availableHtmod];
@ -291,10 +291,10 @@ function getHtmodeChoices(device) {
return htmodeChoices; return htmodeChoices;
} }
function getHwmodeChoices(device) { function getBandChoices(device) {
return device.available_bands.map((availableBand) => ({ return device.available_bands.map((availableBand) => ({
label: HWMODES[availableBand.hwmode], label: `${BANDS[availableBand.band]} GHz`,
value: availableBand.hwmode, value: availableBand.band,
})); }));
} }

10
src/common/WiFiSettings/__tests__/WiFiSettings.test.js
View File

@ -77,7 +77,7 @@ describe("<WiFiSettings/>", () => {
it("Snapshot 2.4 GHz", () => { it("Snapshot 2.4 GHz", () => {
fireEvent.click(getByText("Wi-Fi 1")); fireEvent.click(getByText("Wi-Fi 1"));
const enabledRender = asFragment(); const enabledRender = asFragment();
fireEvent.click(getAllByText("2.4")[0]); fireEvent.click(getAllByText(/2.4/)[0]);
expect(diffSnapshot(enabledRender, asFragment())).toMatchSnapshot(); expect(diffSnapshot(enabledRender, asFragment())).toMatchSnapshot();
}); });
@ -118,7 +118,7 @@ describe("<WiFiSettings/>", () => {
guest_wifi: { enabled: false }, guest_wifi: { enabled: false },
hidden: false, hidden: false,
htmode: "HT80", htmode: "HT80",
hwmode: "11a", band: "5g",
id: 0, id: 0,
password: "TestPass", password: "TestPass",
encryption: "WPA3", encryption: "WPA3",
@ -135,7 +135,7 @@ describe("<WiFiSettings/>", () => {
it("Post form: 2.4 GHz", () => { it("Post form: 2.4 GHz", () => {
fireEvent.click(getByText("Wi-Fi 1")); fireEvent.click(getByText("Wi-Fi 1"));
fireEvent.click(getAllByText("2.4")[0]); fireEvent.click(getAllByText(/2.4/)[0]);
fireEvent.click(getByText("Save")); fireEvent.click(getByText("Save"));
expect(mockAxios.post).toBeCalled(); expect(mockAxios.post).toBeCalled();
@ -148,7 +148,7 @@ describe("<WiFiSettings/>", () => {
guest_wifi: { enabled: false }, guest_wifi: { enabled: false },
hidden: false, hidden: false,
htmode: "VHT80", htmode: "VHT80",
hwmode: "11g", band: "2g",
id: 0, id: 0,
password: "TestPass", password: "TestPass",
encryption: "WPA3", encryption: "WPA3",
@ -185,7 +185,7 @@ describe("<WiFiSettings/>", () => {
}, },
hidden: false, hidden: false,
htmode: "HT80", htmode: "HT80",
hwmode: "11a", band: "5g",
id: 0, id: 0,
password: "TestPass", password: "TestPass",
encryption: "WPA3", encryption: "WPA3",

22
src/common/WiFiSettings/__tests__/__fixtures__/wifiSettings.js
View File

@ -77,7 +77,7 @@ export function wifiSettingsFixture() {
"VHT40", "VHT40",
"VHT80", "VHT80",
], ],
hwmode: "11g", band: "2g",
}, },
{ {
available_channels: [ available_channels: [
@ -215,7 +215,7 @@ export function wifiSettingsFixture() {
"VHT40", "VHT40",
"VHT80", "VHT80",
], ],
hwmode: "11a", band: "5g",
}, },
], ],
channel: 60, channel: 60,
@ -227,7 +227,7 @@ export function wifiSettingsFixture() {
}, },
hidden: false, hidden: false,
htmode: "HT80", htmode: "HT80",
hwmode: "11a", band: "5g",
id: 0, id: 0,
password: "TestPass", password: "TestPass",
encryption: "WPA3", encryption: "WPA3",
@ -294,7 +294,7 @@ export function wifiSettingsFixture() {
}, },
], ],
available_htmodes: ["NOHT", "HT20", "HT40"], available_htmodes: ["NOHT", "HT20", "HT40"],
hwmode: "11g", band: "2g",
}, },
], ],
channel: 11, channel: 11,
@ -306,7 +306,7 @@ export function wifiSettingsFixture() {
}, },
hidden: false, hidden: false,
htmode: "HT40", htmode: "HT40",
hwmode: "11g", band: "2g",
id: 1, id: 1,
password: "TestPass", password: "TestPass",
encryption: "WPA3", encryption: "WPA3",
@ -323,7 +323,7 @@ const oneDevice = {
guest_wifi: { enabled: false }, guest_wifi: { enabled: false },
hidden: false, hidden: false,
htmode: "HT40", htmode: "HT40",
hwmode: "11a", band: "5g",
id: 0, id: 0,
password: "TestPass", password: "TestPass",
encryption: "WPA3", encryption: "WPA3",
@ -340,7 +340,7 @@ const twoDevices = {
guest_wifi: { enabled: false }, guest_wifi: { enabled: false },
hidden: false, hidden: false,
htmode: "HT40", htmode: "HT40",
hwmode: "11a", band: "5g",
id: 0, id: 0,
password: "TestPass", password: "TestPass",
encryption: "WPA3", encryption: "WPA3",
@ -352,7 +352,7 @@ const twoDevices = {
guest_wifi: { enabled: false }, guest_wifi: { enabled: false },
hidden: false, hidden: false,
htmode: "HT40", htmode: "HT40",
hwmode: "11a", band: "5g",
id: 1, id: 1,
password: "TestPass", password: "TestPass",
encryption: "WPA3", encryption: "WPA3",
@ -369,7 +369,7 @@ const threeDevices = {
guest_wifi: { enabled: false }, guest_wifi: { enabled: false },
hidden: false, hidden: false,
htmode: "HT40", htmode: "HT40",
hwmode: "11a", band: "5g",
id: 0, id: 0,
password: "TestPass", password: "TestPass",
encryption: "WPA3", encryption: "WPA3",
@ -381,7 +381,7 @@ const threeDevices = {
guest_wifi: { enabled: false }, guest_wifi: { enabled: false },
hidden: false, hidden: false,
htmode: "HT40", htmode: "HT40",
hwmode: "11a", band: "5g",
id: 1, id: 1,
password: "TestPass", password: "TestPass",
encryption: "WPA3", encryption: "WPA3",
@ -393,7 +393,7 @@ const threeDevices = {
guest_wifi: { enabled: false }, guest_wifi: { enabled: false },
hidden: false, hidden: false,
htmode: "HT40", htmode: "HT40",
hwmode: "11a", band: "5g",
id: 2, id: 2,
password: "", password: "",
encryption: "WPA3", encryption: "WPA3",

22
src/common/WiFiSettings/__tests__/__snapshots__/WiFiSettings.test.js.snap
View File

@ -555,23 +555,23 @@ exports[`<WiFiSettings/> Snapshot one module enabled. 1`] = `
+ class="d-block" + class="d-block"
+ for="6" + for="6"
+ > + >
+ GHz + Band
+ </label> + </label>
+ <div + <div
+ class="mb-3 form-check form-check-inline" + class="mb-3 form-check form-check-inline"
+ > + >
+ <input + <input
+ class="form-check-input me-2" + class="form-check-input me-2"
+ id="hwmode-0-0" + id="band-0-0"
+ name="hwmode-0" + name="band-0"
+ type="radio" + type="radio"
+ value="11g" + value="2g"
+ /> + />
+ <label + <label
+ class="form-check-label" + class="form-check-label"
+ for="hwmode-0-0" + for="band-0-0"
+ > + >
+ 2.4 + 2.4 GHz
+ </label> + </label>
+ </div> + </div>
+ <div + <div
@ -580,16 +580,16 @@ exports[`<WiFiSettings/> Snapshot one module enabled. 1`] = `
+ <input + <input
+ checked="" + checked=""
+ class="form-check-input me-2" + class="form-check-input me-2"
+ id="hwmode-0-1" + id="band-0-1"
+ name="hwmode-0" + name="band-0"
+ type="radio" + type="radio"
+ value="11a" + value="5g"
+ /> + />
+ <label + <label
+ class="form-check-label" + class="form-check-label"
+ for="hwmode-0-1" + for="band-0-1"
+ > + >
+ 5 + 5 GHz
+ </label> + </label>
+ </div> + </div>
+ <div + <div

11
src/common/WiFiSettings/constants.js
View File

@ -1,5 +1,5 @@
/* /*
* Copyright (C) 2019-2022 CZ.NIC z.s.p.o. (https://www.nic.cz/) * Copyright (C) 2019-2024 CZ.NIC z.s.p.o. (https://www.nic.cz/)
* *
* This is free software, licensed under the GNU General Public License v3. * This is free software, licensed under the GNU General Public License v3.
* See /LICENSE for more information. * See /LICENSE for more information.
@ -18,9 +18,10 @@ export const HTMODES = {
HE80: _("802.11ax - 80 MHz wide channel"), HE80: _("802.11ax - 80 MHz wide channel"),
HE160: _("802.11ax - 160 MHz wide channel"), HE160: _("802.11ax - 160 MHz wide channel"),
}; };
export const HWMODES = { export const BANDS = {
"11g": "2.4", "2g": "2.4",
"11a": "5", "5g": "5",
"6g": "6",
}; };
export const ENCRYPTIONMODES = { export const ENCRYPTIONMODES = {
WPA3: _("WPA3 only"), WPA3: _("WPA3 only"),
@ -37,7 +38,7 @@ export const HELP_TEXTS = {
hidden: _( hidden: _(
"If set, network is not visible when scanning for available networks." "If set, network is not visible when scanning for available networks."
), ),
hwmode: _( band: _(
"The 2.4 GHz band is more widely supported by clients, but tends to have more interference. The 5 GHz band is a newer standard and may not be supported by all your devices. It usually has less interference, but the signal does not carry so well indoors." "The 2.4 GHz band is more widely supported by clients, but tends to have more interference. The 5 GHz band is a newer standard and may not be supported by all your devices. It usually has less interference, but the signal does not carry so well indoors."
), ),
htmode: _( htmode: _(