feat(ui): refresh Vue Bootstrap dashboard and network diagrams

test_ui_insights.js

@@ -0,0 +1,19 @@
+const test=require('node:test'),assert=require('node:assert/strict');
+const model=()=>import('./frontend/src/composables/insights.mjs');
+test('home summary uses only supplied authorized records and handles empty values',async()=>{
+ const {summarizeHomes}=await model();
+ assert.deepEqual(summarizeHomes(),{total:0,devices:0,areas:0,kinds:[]});
+ const value=summarizeHomes([{kind:'home',deviceCount:4,sites:1},{kind:'office',deviceCount:2,sites:3},{kind:'home',deviceCount:-1}]);
+ assert.equal(value.devices,6);assert.equal(value.areas,4);assert.equal(value.total,3);
+ assert.equal(value.kinds.reduce((n,k)=>n+k.count,0),3);
+ assert.ok(Math.abs(value.kinds.reduce((n,k)=>n+k.share,0)-100)<0.001);
+ assert.equal(value.kinds[1].offset,value.kinds[0].share);
+});
+test('network diagram draws only known parent connections',async()=>{
+ const {layoutNetwork}=await model();
+ const rows=[{device:{id:'r'},depth:0},{device:{id:'c',uplinkId:'r'},depth:1},{device:{id:'x',uplinkId:'missing'},depth:0},{device:{id:'cycle',uplinkId:'cycle'},depth:0}];
+ const graph=layoutNetwork(rows);
+ assert.equal(graph.nodes.length,4);assert.deepEqual(graph.edges.map(e=>e.id),['c']);
+ assert.ok(graph.nodes.every(n=>n.x>=0&&n.y>=0&&n.x+244<=graph.width&&n.y+88<=graph.height));
+ assert.deepEqual(layoutNetwork().edges,[]);
+});