diff --git a/i18n/generic.json b/i18n/generic.json index 8497de204..c194666e9 100644 --- a/i18n/generic.json +++ b/i18n/generic.json @@ -104,6 +104,8 @@ "network_nodes_4368eb67": "Network Nodes", "no_network_found_try_realigning_your_node_and_resc_176a9b3e": "No network found, try realigning your node and rescanning.", "node_configuration_7342e6f5": "Node Configuration", + "not_upgraded_howmany_5ed230c3": "Not Upgraded (%{howMany})", + "not_upgraded_nodes_9e67db38": "Not Upgraded Nodes", "notes_c42e0fd5": "Notes", "notes_of_a44a4158": "Notes of", "ok_ff1b646a": "Ok", @@ -170,8 +172,10 @@ "there_s_an_active_remote_support_session_4a40a8bb": "There's an active remote support session", "there_s_no_open_session_for_remote_support_click_a_efd0d415": "There's no open session for remote support. Click at Create Session to begin one", "these_are_the_nodes_associated_on_this_radio_3d302167": "These are the nodes associated on this radio", + "these_are_the_nodes_running_the_last_version_of_th_5165bdfe": "These are the nodes running the last version of the Firmware", "these_are_the_nodes_that_can_be_reached_from_your__4c524abe": "These are the nodes that can be reached from your node, i.e. there is a working path from your node to each of them.", "these_are_the_nodes_that_can_t_be_reached_from_you_dbbf9032": "These are the nodes that can't be reached from your node, it is possible that they are not turned on or a link to reach them is down.", + "these_are_the_nodes_that_need_to_be_upgraded_to_th_d09d104": "These are the nodes that need to be upgraded to the last version of the Firmware", "this_device_does_not_support_secure_rollback_to_pr_1c167a2c": "This device does not support secure rollback to previous version if something goes wrong", "this_device_supports_secure_rollback_to_previous_v_a60ddbcb": "This device supports secure rollback to previous version if something goes wrong", "this_information_is_synced_periodically_and_can_be_8b74cb8c": "This information is synced periodically and can be outdated by some minutes", @@ -188,6 +192,8 @@ "upgrade_now_f300d697": "Upgrade Now", "upgrade_to_lastest_firmware_version_9b159910": "Upgrade to lastest firmware version", "upgrade_to_versionname_621a0b6a": "Upgrade to %{versionName}", + "upgraded_howmany_e439d4b1": "Upgraded (%{howMany})", + "upgraded_nodes_dfc85207": "Upgraded Nodes", "upload_firmware_image_from_your_device_57327bee": "Upload firmware image from your device", "uptime_c1d2415d": "Uptime", "versionname_is_now_available_a6fbbb63": "%{versionName} is now available", diff --git a/i18n/translations/es.json b/i18n/translations/es.json index 0d2165325..e10552d32 100644 --- a/i18n/translations/es.json +++ b/i18n/translations/es.json @@ -210,6 +210,12 @@ "these_are_the_nodes_that_can_t_be_reached_from_you_dbbf9032": "Son los nodos con los que tienes conectividad, es decir que hay un camino funcionando entre tu nodo y cada uno de ellos.", "this_information_is_synced_periodically_and_can_be_8b74cb8c": "Esta información se sincroniza periódicamente, puede estar desactualizada algunos minutos.", "unreachable_howmany_e5c8f844": "No Alcanzables (%{howMany})", - "unreachable_nodes_e6785f10": "Nodos No Alcanzables" + "unreachable_nodes_e6785f10": "Nodos No Alcanzables", + "not_upgraded_howmany_5ed230c3": "No Actualizados (%{howMany})", + "not_upgraded_nodes_9e67db38": "Nodos No Actualizados", + "these_are_the_nodes_running_the_last_version_of_th_5165bdfe": "Estos son los nodos que están actualizados a la última versión del Firmware", + "these_are_the_nodes_that_need_to_be_upgraded_to_th_d09d104": "Estos son los nodos que necesitan actualizarse a la última versión del Firmware", + "upgraded_howmany_e439d4b1": "Actualizados (%{howMany})", + "upgraded_nodes_dfc85207": "Nodos Actualizados" } diff --git a/plugins/lime-plugin-upgradedNodes/index.js b/plugins/lime-plugin-upgraded-nodes/index.js similarity index 100% rename from plugins/lime-plugin-upgradedNodes/index.js rename to plugins/lime-plugin-upgraded-nodes/index.js diff --git a/plugins/lime-plugin-upgraded-nodes/src/style.less b/plugins/lime-plugin-upgraded-nodes/src/style.less new file mode 100644 index 000000000..0b786cbee --- /dev/null +++ b/plugins/lime-plugin-upgraded-nodes/src/style.less @@ -0,0 +1,8 @@ +.stickySubheader { + position: sticky; + top: 0; + background-color: #325850; + padding: 0.2rem; + text-align: center; + color:white; +} diff --git a/plugins/lime-plugin-upgradedNodes/src/upgradedNodesMenu.js b/plugins/lime-plugin-upgraded-nodes/src/upgradedNodesMenu.js similarity index 100% rename from plugins/lime-plugin-upgradedNodes/src/upgradedNodesMenu.js rename to plugins/lime-plugin-upgraded-nodes/src/upgradedNodesMenu.js diff --git a/plugins/lime-plugin-upgradedNodes/src/upgradedNodesPage.js b/plugins/lime-plugin-upgraded-nodes/src/upgradedNodesPage.js similarity index 57% rename from plugins/lime-plugin-upgradedNodes/src/upgradedNodesPage.js rename to plugins/lime-plugin-upgraded-nodes/src/upgradedNodesPage.js index ed3e95dab..0e1ba5a98 100644 --- a/plugins/lime-plugin-upgradedNodes/src/upgradedNodesPage.js +++ b/plugins/lime-plugin-upgraded-nodes/src/upgradedNodesPage.js @@ -1,4 +1,5 @@ -import { h } from "preact"; +import { h, Fragment } from "preact"; +import style from "./style.less"; import { useEffect, useState } from "preact/hooks"; import Tabs from "components/tabs"; import Loading from "components/loading"; @@ -9,6 +10,19 @@ import { useNewVersion } from "plugins/lime-plugin-firmware/src/firmwareQueries" import Help from "components/help"; import I18n from 'i18n-js'; +function groupBy(xs, key) { + return xs.reduce(function (rv, x) { + let v = key instanceof Function ? key(x) : x[key]; + let el = rv.find((r) => r && r.key === v); + if (el) { + el.values.push(x); + } else { + rv.push({ key: v, values: [x] }); + } + return rv; + }, []); +}; + const PageHelp = () => (

@@ -33,8 +47,8 @@ const PageTabs = ({ nodes, ...props }) => { } export const UpgradedNodesPage_ = ({ nodes }) => { - const [ selectedGroup, setselectedGroup ] = useState('upgraded'); - const [ unfoldedNode, setunfoldedNode ] = useState(null); + const [selectedGroup, setselectedGroup] = useState('upgraded'); + const [unfoldedNode, setunfoldedNode] = useState(null); function changeUnfolded(hostname) { if (unfoldedNode == hostname) { @@ -44,6 +58,13 @@ export const UpgradedNodesPage_ = ({ nodes }) => { setunfoldedNode(hostname); } + const groupNodes = nodes + .filter(n => n.status !== 'gone') + .filter(n => n.group === selectedGroup); + + const grouppedByVersion = groupBy(groupNodes, 'fw_version') + .sort((a, b) => a.key > b.key); + return (

@@ -53,16 +74,23 @@ export const UpgradedNodesPage_ = ({ nodes }) => {
- {nodes - .filter(n => n.status !== 'gone') - .filter(n => n.group === selectedGroup) - .sort((a, b) => a.hostname > b.hostname) - .map( - node => - changeUnfolded(node.hostname)}/> - )} + {grouppedByVersion + .map((versionGroup, index) => ( + + {selectedGroup === 'not_upgraded' && +
+ {versionGroup.key} +
+ } + {versionGroup.values + .map(node => + changeUnfolded(node.hostname)} /> + )} + + )) + }
) @@ -70,15 +98,16 @@ export const UpgradedNodesPage_ = ({ nodes }) => { const UpgradedNodesPage = () => { const { data: nodes, isLoading: isLoadingNodes } = useNetworkNodes(); - const { data: newVersion, isLoading: isLoadingVersion} = useNewVersion(); + const { data: newVersion, isLoading: isLoadingVersion } = useNewVersion(); const [taggedNodes, setTaggedNodes] = useState(undefined); useEffect(() => { - if (nodes && newVersion){ + if (nodes && newVersion) { const taggedNodes = [...nodes].map( - n => ({ ...n, - group: n.fw_version === newVersion.version ? 'upgraded' : 'not_upgraded' - })); + n => ({ + ...n, + group: n.fw_version === newVersion.version ? 'upgraded' : 'not_upgraded' + })); setTaggedNodes(taggedNodes); } }, [nodes, newVersion]) diff --git a/plugins/lime-plugin-upgradedNodes/upgradedNodes.spec.js b/plugins/lime-plugin-upgraded-nodes/upgradedNodes.spec.js similarity index 94% rename from plugins/lime-plugin-upgradedNodes/upgradedNodes.spec.js rename to plugins/lime-plugin-upgraded-nodes/upgradedNodes.spec.js index a4da44890..16d4c800d 100644 --- a/plugins/lime-plugin-upgradedNodes/upgradedNodes.spec.js +++ b/plugins/lime-plugin-upgraded-nodes/upgradedNodes.spec.js @@ -1,6 +1,3 @@ -// Here you define tests that closely resemble how your component is used -// Using the testing-library: https://testing-library.com - import { h } from 'preact'; import { fireEvent, screen, cleanup, act } from '@testing-library/preact'; import '@testing-library/jest-dom'; diff --git a/plugins/lime-plugin-upgraded-nodes/upgradedNodes.stories.js b/plugins/lime-plugin-upgraded-nodes/upgradedNodes.stories.js new file mode 100644 index 000000000..3f3dbe585 --- /dev/null +++ b/plugins/lime-plugin-upgraded-nodes/upgradedNodes.stories.js @@ -0,0 +1,55 @@ +import { UpgradedNodesPage_ } from './src/upgradedNodesPage'; + +export default { + title: 'Containers/Upgraded Nodes' +} + +const nodes = [ + { hostname: "ql-czuk", status: "recently_reachable", + ipv4:'10.5.0.3', ipv6: 'fd0d:fe46:8ce8::8bbf:7500', + board: 'LibreRouter v1', fw_version: 'LibreRouterOS 1.3', + group: 'not_upgraded' + }, + { hostname: "ql-czuk-bbone", status: "recently_reachable", + ipv4:'10.5.0.9', ipv6: 'fd0d:fe46:8ce8::8bbf:7500', + board: 'LibreRouter v1', fw_version: 'LibreRouterOS 1.3', + group: 'not_upgraded' + }, + { hostname: "si-soniam", status: "recently_reachable", + ipv4:'10.5.0.16', ipv6: 'fd0d:fe46:8ce8::8bbf:7500', + board: 'LibreRouter v1', fw_version: 'LibreRouterOS 1.4', + group: 'upgraded' + }, + { hostname: "ql-berta", status: "recently_reachable", + ipv4:'10.5.0.9', ipv6: 'fd0d:fe46:8ce8::8bbf:7500', + board: 'LibreRouter v1', fw_version: 'LibreRouterOS 1.4', + group: 'upgraded' + }, + { hostname: "ql-nelson", status: "recently_reachable", + ipv4:'10.5.0.9', ipv6: 'fd0d:fe46:8ce8::8bbf:7500', + board: 'LibreRouter v1', fw_version: 'LibreRouterOS 1.3', + group: 'not_upgraded' + }, + { hostname: "ql-irene", status: "recently_reachable", + ipv4:'10.5.0.9', ipv6: 'fd0d:fe46:8ce8::8bbf:7500', + board: 'LibreRouter v1', fw_version: 'LibreRouterOS 1.3', + group: 'not_upgraded' + }, + { hostname: "ql-guillermina", status: "recently_reachable", + ipv4:'10.5.0.9', ipv6: 'fd0d:fe46:8ce8::8bbf:7500', + board: 'LibreRouter v1', fw_version: 'LibreRouterOS 1.3', + group: 'not_upgraded' + }, + { hostname: "ql-silviak", status: "recently_reachable", + ipv4:'10.5.0.9', ipv6: 'fd0d:fe46:8ce8::8bbf:7500', + board: 'LibreRouter v1', fw_version: 'LibreRouterOS 1.3', + group: 'not_upgraded' + }, + { hostname: "ql-oncelotes", status: "recently_reachable", + ipv4:'10.5.0.9', ipv6: 'fd0d:fe46:8ce8::8bbf:7500', + board: 'LibreRouter v1', fw_version: 'LibreRouterOS 1.2', + group: 'not_upgraded' + }, +]; + +export const upgradedNodesPage = () => diff --git a/plugins/lime-plugin-upgradedNodes/upgradedNodes.stories.js b/plugins/lime-plugin-upgradedNodes/upgradedNodes.stories.js deleted file mode 100644 index 782012759..000000000 --- a/plugins/lime-plugin-upgradedNodes/upgradedNodes.stories.js +++ /dev/null @@ -1,9 +0,0 @@ -//Here you define the StoryBook stories for this plugin - -import UpgradedNodes from './src/upgradedNodesPage'; - -export default { - title: 'Containers/upgradedNodes' -} - -export const myStory = () =>