Network improvements #1365

teclator · 2024-06-21T09:06:54Z

Description

Network was one of the first components we added to Agama and since then it the components have evolve a lot being one of the most out of date ones. Therefore it was known it deserve some love... and we tried to start revamping it a little bit.

Changes done:

Modified the Network Page using routes instead of popup modals to configure the connections or to connecto a WiFi network.
Modified the wifi selection list and added a drawer for showing the selected network description and connection options.
Notify device state reason changes in order to detect an authentication error when connecting to a WiFi (reopen the form is still pending)
Fixed gateway4 set up.
Do not show externally configured connections (libvirt, vpns..)

Manually tested

Pending:

Try to improve the state management as network changes usually close de opened websocket opening the door to miss state changes notifications. Because of that, the read of the devices, connections and WiFi networks is done everytime insted of modifying the current state with just the changes.
Show the form of the failing authentication WiFi.
Fix the unit tests.
Remove unnecesary files, and fix types descriptions.

Old UI

New UI

coveralls · 2024-06-21T09:16:53Z

coverage: 70.879% (-0.02%) from 70.896%
when pulling 72abba0 on network_improvements
into be7223d on master.

coveralls · 2024-06-25T12:02:34Z

coverage: 70.928% (-0.02%) from 70.945%
when pulling f7334f1 on network_improvements
into 7f641e4 on master.

coveralls · 2024-06-25T22:14:34Z

coverage: 70.99%. remained the same
when pulling ca826a8 on network_improvements
into ce30ede on master.

Co-authored-by: Knut Anderssen <[email protected]>

This commit includes two major changes: - To avoid an infinite loop when fetching network data by making use of React.useCallback. - To persist the selected WiFi network to localStorage to mitigate an UI glitch due to the fact that the whole component gets unmounted on websocket reconnection.

No matter if user accepts or cancel the edition, the router should navigate back to the previous route instead to the parent route.

coveralls · 2024-06-26T09:41:12Z

coverage: 71.01%. remained the same
when pulling 6fed0a0 on network_improvements
into 3428c4e on master.

web/src/components/network/NetworkPage.jsx

coveralls · 2024-06-26T10:39:08Z

coverage: 71.015%. remained the same
when pulling cba892a on network_improvements
into b8e9ab2 on master.

coveralls · 2024-06-26T10:40:44Z

coverage: 70.945% (-0.07%) from 71.015%
when pulling cba892a on network_improvements
into b8e9ab2 on master.

Co-authored-by: David Díaz <[email protected]>

imobachgs · 2024-06-26T10:23:24Z

web/src/components/network/NetworkPage.jsx

-  const [devices, setDevices] = useState(undefined);
-  const [selectedConnection, setSelectedConnection] = useState(null);
+  const [devices, setDevices] = useState(initialDevices);
+  const [updateState, setUpdateState] = useState(false);


Is updateState used? Perhaps a better name could help to know the intention.

it was updateNetworks, as the method was get from WifiSelector and updateDevicesConnections was like too much.. was not very inspired at the moment of writing it :P

As discussed offline, it is wrong because we are not checking the updateState value.

imobachgs · 2024-06-26T10:26:42Z

web/src/components/network/NetworkPage.jsx

+        <CardField>
+          <CardField.Content>
+            <EmptyState title={_("No WiFi support")} icon="wifi_off" color="warning-color-200">
+              {_("The system does not support WiFi connections, probably because of missing or disabled hardware.")}


Put in the shoes of an inexperienced user... I do not know if "missing hardware" is good enough.

web/src/components/network/NetworkPage.jsx

web/src/components/network/WifiNetworkListItemPage.jsx

web/src/components/network/WifiNetworksListPage.jsx

web/src/components/network/WifiSelectorPage.jsx

coveralls · 2024-06-26T10:52:49Z

coverage: 70.945% (-0.07%) from 71.015%
when pulling 654e86c on network_improvements
into b8e9ab2 on master.

coveralls · 2024-06-26T10:53:45Z

coverage: 70.945% (-0.07%) from 71.015%
when pulling 654e86c on network_improvements
into b8e9ab2 on master.

coveralls · 2024-06-26T11:04:43Z

coverage: 70.945% (-0.07%) from 71.015%
when pulling d7b1a11 on network_improvements
into b8e9ab2 on master.

coveralls · 2024-06-26T11:35:34Z

coverage: 70.945% (-0.07%) from 71.015%
when pulling c2340b7 on network_improvements
into b8e9ab2 on master.

coveralls · 2024-06-26T11:37:04Z

coverage: 70.945% (-0.07%) from 71.015%
when pulling c2340b7 on network_improvements
into b8e9ab2 on master.

Prepare for releasing Agama 9. It includes the following pull requests: - #1101 - #1202 - #1228 - #1231 - #1236 - #1238 - #1239 - #1240 - #1242 - #1243 - #1244 - #1245 - #1246 - #1247 - #1248 - #1249 - #1250 - #1251 - #1252 - #1253 - #1254 - #1255 - #1256 - #1257 - #1258 - #1259 - #1260 - #1261 - #1264 - #1265 - #1267 - #1268 - #1269 - #1270 - #1271 - #1272 - #1273 - #1274 - #1279 - #1280 - #1284 - #1285 - #1286 - #1287 - #1288 - #1289 - #1290 - #1291 - #1292 - #1293 - #1294 - #1295 - #1296 - #1298 - #1299 - #1300 - #1301 - #1302 - #1303 - #1304 - #1305 - #1306 - #1307 - #1308 - #1309 - #1310 - #1311 - #1312 - #1313 - #1314 - #1315 - #1316 - #1317 - #1318 - #1319 - #1320 - #1321 - #1322 - #1323 - #1324 - #1325 - #1326 - #1328 - #1329 - #1331 - #1332 - #1334 - #1338 - #1340 - #1341 - #1342 - #1343 - #1344 - #1345 - #1348 - #1349 - #1351 - #1352 - #1353 - #1354 - #1355 - #1356 - #1357 - #1358 - #1359 - #1360 - #1361 - #1362 - #1363 - #1365 - #1366 - #1367 - #1368 - #1371 - #1372 - #1374 - #1375 - #1376 - #1379 - #1380 - #1381 - #1383 - #1384 - #1385 - #1386 - #1387 - #1388 - #1389 - #1391 - #1392 - #1394 - #1395 - #1397 - #1398 - #1399 - #1400 - #1403

imobachgs added this to the Agama 9 milestone Jun 25, 2024

teclator force-pushed the network_improvements branch from 72abba0 to f7334f1 Compare June 25, 2024 11:52

teclator force-pushed the network_improvements branch from ad385d0 to ca826a8 Compare June 25, 2024 22:09

teclator force-pushed the network_improvements branch from 1c0dbb7 to 143be2f Compare June 26, 2024 09:24

teclator and others added 14 commits June 26, 2024 10:24

Notify DeviceStateReason changes and added brige device type

54c18ff

fix(web): Redo the WiFi summary at NetworkPage

89a3a1a

Co-authored-by: Knut Anderssen <[email protected]>

fix(web): drop leftovers

adebdeb

Co-authored-by: Knut Anderssen <[email protected]>

First set of UI changes for wireless configuration

e49a5f6

Moved the loadNetworks function to the network client

edae23a

Make the WifiSelector stable enough

e41c9dd

[WIP] connecting to hidden form

1ec7de6

Fix form for connecting to a hidden WiFi

5edc1d4

Small network UI fixes

7ff00e1

Allow to edit a WiFi connection

ae5081b

fix(web): goes back when after editing a connection

6656e38

No matter if user accepts or cancel the edition, the router should navigate back to the previous route instead to the parent route.

Use same approach than with WifiSelector for the NetworkPage.

b92f5e1

Fixes for the NetworkPage wifi card

a406d77

teclator changed the title ~~[WIP] Network improvements~~ Network improvements Jun 26, 2024

teclator marked this pull request as ready for review June 26, 2024 09:25

Fix gateway4 field name

6fed0a0

teclator force-pushed the network_improvements branch from 143be2f to 6fed0a0 Compare June 26, 2024 09:36

teclator added 2 commits June 26, 2024 11:01

Removed files added by error

f3062f4

Merge branch 'master' into network_improvements

cba892a

dgdavid reviewed Jun 26, 2024

View reviewed changes

web/src/components/network/NetworkPage.jsx Outdated Show resolved Hide resolved

teclator and others added 2 commits June 26, 2024 11:42

Removed unnecesary files

1f80cd8

Update web/src/components/network/NetworkPage.jsx

654e86c

Co-authored-by: David Díaz <[email protected]>

imobachgs reviewed Jun 26, 2024

View reviewed changes

Added changes based on code review.

d7b1a11

Refresh the devices, connections and networks only when needed

c2340b7

teclator force-pushed the network_improvements branch from 47c2039 to c2340b7 Compare June 26, 2024 11:27

imobachgs approved these changes Jun 26, 2024

View reviewed changes

imobachgs merged commit f003fb4 into master Jun 26, 2024
3 checks passed

imobachgs deleted the network_improvements branch June 26, 2024 11:34

This was referenced Jun 26, 2024

doc: update changes files #1382

Closed

Update to release 9 #1404

Merged

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Network improvements #1365

Network improvements #1365

teclator commented Jun 21, 2024 •

edited

Loading

coveralls commented Jun 21, 2024

coveralls commented Jun 25, 2024

coveralls commented Jun 25, 2024

coveralls commented Jun 26, 2024

coveralls commented Jun 26, 2024

coveralls commented Jun 26, 2024

imobachgs Jun 26, 2024

teclator Jun 26, 2024

imobachgs Jun 26, 2024

imobachgs Jun 26, 2024

coveralls commented Jun 26, 2024

coveralls commented Jun 26, 2024

coveralls commented Jun 26, 2024

coveralls commented Jun 26, 2024

coveralls commented Jun 26, 2024

Network improvements #1365

Network improvements #1365

Conversation

teclator commented Jun 21, 2024 • edited Loading

Description

Old UI

New UI

coveralls commented Jun 21, 2024

coveralls commented Jun 25, 2024

coveralls commented Jun 25, 2024

coveralls commented Jun 26, 2024

coveralls commented Jun 26, 2024

coveralls commented Jun 26, 2024

imobachgs Jun 26, 2024

Choose a reason for hiding this comment

teclator Jun 26, 2024

Choose a reason for hiding this comment

imobachgs Jun 26, 2024

Choose a reason for hiding this comment

imobachgs Jun 26, 2024

Choose a reason for hiding this comment

coveralls commented Jun 26, 2024

coveralls commented Jun 26, 2024

coveralls commented Jun 26, 2024

coveralls commented Jun 26, 2024

coveralls commented Jun 26, 2024

teclator commented Jun 21, 2024 •

edited

Loading