From 98a1fb71c940cfd5698ec646e3b59d434ea6926e Mon Sep 17 00:00:00 2001 From: Maciej Lenartowicz Date: Mon, 27 Jan 2020 15:35:15 +0100 Subject: [PATCH 1/7] Use module ID to differentiate interfaces. --- README.md | 23 +++---- js/src/interfaces/Interface.js | 6 +- js/src/interfaces/Network.js | 25 ++++--- js/src/interfaces/SelectedInterface.js | 22 +++--- .../__snapshots__/Interfaces.test.js.snap | 68 ++++++++++++------- 5 files changed, 82 insertions(+), 62 deletions(-) diff --git a/README.md b/README.md index c1b66331..be7fb512 100644 --- a/README.md +++ b/README.md @@ -9,18 +9,11 @@ Re**Foris** is not production-ready yet. It's on tested stage and we believe it Installation of re**Foris** is possible only on Turris devices due to specific software and hardware usage. It's possible that some environment (Docker container) with Turris routers hardware emulation will be created in the future. -### 1. Install dependencies -**On a router!** -```bash -$ opkg update -$ opkg install make git-http -``` - -### 2. Transfer and synchronize reForis source code to the router +### 1. Transfer and synchronize reForis source code to the router Use your favorite tools to keep the code synchronized with your local machine. You can automatize all these processes and code transferring with you favorite tools (e.g., `rsync` or built-in IDE solution). -#### 2.1 SSHFS and SFTP +#### 1.1 SSHFS and SFTP One of the possible solutions is using SSHFS or SFTP. It's very comfortable to use it with some IDE, it may allow you to watch the changes and synchronize only changed parts. ##### PyCharm @@ -32,7 +25,7 @@ It's also possible to setup remote server and synchronization with VS Code and ##### `rsync` You can also use any other IDE or text editor and synchronize code with SSHFS or SFTP using rsync. -#### 2.2 Ignore unnecessary paths +#### 1.2 Ignore unnecessary paths It's better to not synchronize subsequent directories with a router: * `js` * `venv` @@ -43,19 +36,19 @@ So just exclude it. eMMC can only sustain 3–10K rewrite cycles before it starts to cause bit errors. In this regard, it’s better to send the code to the RAM (`/tmp` or `/var` directories are mapped to the RAM). -### 3. Check Python version +### 2. Check Python version Minimal required Python version is **3.6**. Please check if you have the same Python versions in Makefile (variable `$ROUTER_PYTHON`) and on the system installed. If not then correct the version in Makefile. -### 4. Install reForis application with production server (lighttpd) +### 3. Install reForis application with production server (lighttpd) **On the router!** ```bash $ make install-with-lighttpd ``` -### 5. Build JS +### 4. Build JS **You have build JS sources on some other machine with `node-npm` installed!** ```bash @@ -66,14 +59,14 @@ Then don't forget to transfer it to the `/tmp/reforis/reforis_static/reforis/js/ #### Note If you've made some changes in JS part of code then it has to be rebuilt and sent to the router. -### 6. Compile translations +### 5. Compile translations **On the local computer!** ```bash $ make compile-messages ``` Then transfer it to the router. -### 7. Restart the lighttpd server +### 6. Restart the lighttpd server **On the router!** ```bash /etc/init.d/lighttpd restart diff --git a/js/src/interfaces/Interface.js b/js/src/interfaces/Interface.js index 9033fc48..d51195dc 100644 --- a/js/src/interfaces/Interface.js +++ b/js/src/interfaces/Interface.js @@ -11,6 +11,7 @@ import { INTERFACE_STATES, INTERFACE_TYPES } from "./constants"; Interface.propTypes = { type: PropTypes.oneOf(Object.keys(INTERFACE_TYPES)).isRequired, + module_id: PropTypes.number.isRequired, slot: PropTypes.string.isRequired, state: PropTypes.oneOf(Object.keys(INTERFACE_STATES)).isRequired, configurable: PropTypes.bool.isRequired, @@ -19,12 +20,13 @@ Interface.propTypes = { }; export default function Interface({ - type, slot, state, configurable, isSelected, onClick, + type, module_id, slot, state, configurable, isSelected, onClick, }) { + const interfaceName = module_id > 0 ? `${module_id}.${slot}` : slot; return ( ); } diff --git a/js/src/interfaces/Network.js b/js/src/interfaces/Network.js index d69c21a9..04eb934f 100644 --- a/js/src/interfaces/Network.js +++ b/js/src/interfaces/Network.js @@ -17,19 +17,24 @@ Network.propTypes = { }; export default function Network({ interfaces, selected, setSelected }) { + let componentContent =

{_("There are no interfaces in this group.")}

; + if (interfaces.length > 0) { + componentContent = interfaces.map( + (networkInterface) => ( + setSelected(networkInterface.id)} + isSelected={selected === networkInterface.id} + {...networkInterface} + /> + ), + ); + } + return (
- {interfaces.map( - (i) => ( - setSelected(i.id)} - isSelected={selected === i.id} - {...i} - /> - ), - )} + {componentContent}
); diff --git a/js/src/interfaces/SelectedInterface.js b/js/src/interfaces/SelectedInterface.js index a8d7c5db..347a5295 100644 --- a/js/src/interfaces/SelectedInterface.js +++ b/js/src/interfaces/SelectedInterface.js @@ -51,7 +51,7 @@ export default function SelectedInterface({ return ( <> -

{slot}

+

{`Interface ${slot} (module ${module_id})`}

- Interface LAN1 (module 0) + Interface LAN1

- Interface LAN1 (module 0) + Interface LAN1

Date: Mon, 27 Jan 2020 18:17:21 +0100 Subject: [PATCH 4/7] Refactored components for displaying network interfaces. --- js/src/interfaces/Network.js | 145 +++++++++++++++---------- js/src/interfaces/SelectedInterface.js | 10 +- 2 files changed, 89 insertions(+), 66 deletions(-) diff --git a/js/src/interfaces/Network.js b/js/src/interfaces/Network.js index 663f561e..3dbb5cb4 100644 --- a/js/src/interfaces/Network.js +++ b/js/src/interfaces/Network.js @@ -10,26 +10,6 @@ import propType from "prop-types"; import Interface from "./Interface"; -function getModulesNumber(interfaces) { - const modulesFound = new Set(); - interfaces.some((iface) => { - modulesFound.add(iface.module_id); - return modulesFound.size > 1; - }); - return modulesFound.size; -} - -function sortByModules(interfaces) { - const sortedByModules = {}; - interfaces.forEach((iface) => { - if (sortedByModules[iface.module_id] === undefined) { - sortedByModules[iface.module_id] = []; - } - sortedByModules[iface.module_id].push(iface); - }); - return sortedByModules; -} - Network.propTypes = { interfaces: propType.arrayOf(propType.object).isRequired, selected: propType.string, @@ -37,47 +17,27 @@ Network.propTypes = { }; export default function Network({ interfaces, selected, setSelected }) { - let componentContent =

{_("There are no interfaces in this group.")}

; - - if (getModulesNumber(interfaces) > 1) { - const sortedByModules = sortByModules(interfaces); - const modules = Object.keys(sortedByModules); - componentContent = modules.map((mod) => { - const interfaceComponents = sortedByModules[mod].map((networkInterface) => ( - setSelected(networkInterface.id)} - isSelected={selected === networkInterface.id} - {...networkInterface} + let componentContent; + if (interfaces.length > 0) { + if (getModulesNumber(interfaces) > 1) { + componentContent = ( + - )); - - const moduleName = mod === "0" ? _("Base module") : `Module ${mod}`; - return ( -
-

{moduleName}

-
- {interfaceComponents} -
-
); - }); - } else if (interfaces.length > 0) { - const singleModuleComponents = interfaces.map( - (networkInterface) => ( - setSelected(networkInterface.id)} - isSelected={selected === networkInterface.id} - {...networkInterface} + } else { + componentContent = ( + - ), - ); - componentContent = ( -
- {singleModuleComponents} -
- ); + ); + } + } else { + componentContent =

{_("There are no interfaces in this group.")}

; } return ( @@ -86,3 +46,72 @@ export default function Network({ interfaces, selected, setSelected }) {
); } + +ModulesList.propTypes = { + interfaces: propType.arrayOf(propType.object).isRequired, + selected: propType.string, + setSelected: propType.func.isRequired, +}; + +function ModulesList({ interfaces, selected, setSelected }) { + const groupedByModules = groupByModules(interfaces); + const modules = Object.keys(groupedByModules); + + return modules.map((moduleID) => { + const moduleName = moduleID === "0" ? _("Base module") : babel.format("Module %s", moduleID); + return ( +
+

{moduleName}

+ +
+ ); + }); +} + +InterfaceList.propTypes = { + interfaces: propType.arrayOf(propType.object).isRequired, + selected: propType.string, + setSelected: propType.func.isRequired, +}; + +function InterfaceList({ interfaces, selected, setSelected }) { + const interfaceComponents = interfaces.map( + (networkInterface) => ( + setSelected(networkInterface.id)} + isSelected={selected === networkInterface.id} + {...networkInterface} + /> + ), + ); + return ( +
+ {interfaceComponents} +
+ ); +} + +function getModulesNumber(interfaces) { + const modulesFound = new Set(); + interfaces.some((networkInterface) => { + modulesFound.add(networkInterface.module_id); + return modulesFound.size > 1; + }); + return modulesFound.size; +} + +function groupByModules(interfaces) { + const groupedByModules = {}; + interfaces.forEach((networkInterface) => { + if (groupedByModules[networkInterface.module_id] === undefined) { + groupedByModules[networkInterface.module_id] = []; + } + groupedByModules[networkInterface.module_id].push(networkInterface); + }); + return groupedByModules; +} diff --git a/js/src/interfaces/SelectedInterface.js b/js/src/interfaces/SelectedInterface.js index b9881e97..adf4da4a 100644 --- a/js/src/interfaces/SelectedInterface.js +++ b/js/src/interfaces/SelectedInterface.js @@ -49,16 +49,10 @@ export default function SelectedInterface({ const networkChoices = { ...NETWORKS_CHOICES }; if (!WANIsEmpty) delete networkChoices.wan; - let interfaceName; - if (module_id === 0) { - interfaceName = `Interface ${slot}`; - } else { - interfaceName = `Interface ${slot} (module ${module_id})`; - } - + const moduleName = module_id !== 0 ? `(module ${module_id})` : ""; return ( <> -

{interfaceName}

+

{`Interface ${slot} ${moduleName}`.trim()}

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ State + + + + +
+ Module ID + + 1 +
+ Slot + + 1 +
+ Interface ID + + lan4 +
+ Type + + eth +
+ Bus + + eth +
+ Link speed + + N/A +
+
+ +
+ + + +`; + +exports[` with various modules Snapshot. 1`] = ` +
+

+ Network Interfaces +

+

+ +Here you can configure the settings of the network interfaces on your device. You can switch the physical +network interfaces among networks. If you are unsure what to set here use the default settings. + +

+

+ WAN +

+

+ +It acts as an external network connection. Firewall rules should be applied here. It can only contain a +single interface. + +

+

+ LAN +

+

+ +It acts as a local network connection. LAN should contain devices which are under your control and you +trust them. These devices can see each other and can access this web interface. It is recommended that the +LAN should contain at least one interface otherwise you might not be able to configure this device in an +easy way. + +

+

+ Guest Network +

+

+ +It acts as a local network connection. Unlike LAN the devices in the guest network can't access +the configuration interface of this device and are only able to access WAN (internet). This network should +be used for devices which you don't fully trust. Note that you can also limit download/upload speed of the +devices connected to the guest network. + +

+
+
+

+ WAN +

+
+
+ +
+
+

+ LAN +

+
+
+

+ Base module +

+
+ +
+
+
+

+ Module %s +

+
+ +
+
+
+

+ Guest Network +

+
+
+

+ Base module +

+
+ +
+
+
+

+ Module %s +

+
+ +
+
+
+

+ Unassigned +

+
+
+ + +
+
+
+
-- GitLab From ac0950ea886ce290a40d2bb9bbeb377d52304c9c Mon Sep 17 00:00:00 2001 From: Maciej Lenartowicz Date: Fri, 31 Jan 2020 16:12:59 +0100 Subject: [PATCH 6/7] Updated translations. --- js/src/interfaces/Network.js | 2 +- js/src/interfaces/SelectedInterface.js | 2 +- .../__snapshots__/Interfaces.test.js.snap | 6 +- .../translations/cs/LC_MESSAGES/messages.po | 61 +++++++++++----- .../translations/da/LC_MESSAGES/messages.po | 61 +++++++++++----- .../translations/de/LC_MESSAGES/messages.po | 61 +++++++++++----- .../translations/el/LC_MESSAGES/messages.po | 61 +++++++++++----- .../translations/en/LC_MESSAGES/messages.po | 61 +++++++++++----- .../translations/es/LC_MESSAGES/messages.po | 69 +++++++++++++------ .../translations/fi/LC_MESSAGES/messages.po | 61 +++++++++++----- .../translations/fo/LC_MESSAGES/messages.po | 61 +++++++++++----- .../translations/fr/LC_MESSAGES/messages.po | 61 +++++++++++----- .../translations/hr/LC_MESSAGES/messages.po | 61 +++++++++++----- .../translations/hu/LC_MESSAGES/messages.po | 61 +++++++++++----- .../translations/it/LC_MESSAGES/messages.po | 61 +++++++++++----- .../translations/ja/LC_MESSAGES/messages.po | 61 +++++++++++----- .../translations/ko/LC_MESSAGES/messages.po | 61 +++++++++++----- .../translations/lt/LC_MESSAGES/messages.po | 61 +++++++++++----- reforis/translations/messages.pot | 60 +++++++++++----- .../translations/nb/LC_MESSAGES/messages.po | 61 +++++++++++----- .../translations/nl/LC_MESSAGES/messages.po | 61 +++++++++++----- .../translations/pl/LC_MESSAGES/messages.po | 61 +++++++++++----- .../translations/ro/LC_MESSAGES/messages.po | 61 +++++++++++----- .../translations/ru/LC_MESSAGES/messages.po | 61 +++++++++++----- .../translations/sk/LC_MESSAGES/messages.po | 61 +++++++++++----- .../translations/sv/LC_MESSAGES/messages.po | 61 +++++++++++----- 26 files changed, 1020 insertions(+), 400 deletions(-) diff --git a/js/src/interfaces/Network.js b/js/src/interfaces/Network.js index 3dbb5cb4..a4911ed4 100644 --- a/js/src/interfaces/Network.js +++ b/js/src/interfaces/Network.js @@ -58,7 +58,7 @@ function ModulesList({ interfaces, selected, setSelected }) { const modules = Object.keys(groupedByModules); return modules.map((moduleID) => { - const moduleName = moduleID === "0" ? _("Base module") : babel.format("Module %s", moduleID); + const moduleName = moduleID === "0" ? _("Base module") : babel.format(_("Module %s"), moduleID); return (

{moduleName}

diff --git a/js/src/interfaces/SelectedInterface.js b/js/src/interfaces/SelectedInterface.js index cebb412e..6ca41765 100644 --- a/js/src/interfaces/SelectedInterface.js +++ b/js/src/interfaces/SelectedInterface.js @@ -59,7 +59,7 @@ export default function SelectedInterface({ const moduleName = module_id !== 0 ? `(module ${module_id})` : ""; return ( <> -

{`Interface ${slot} ${moduleName}`.trim()}

+

{babel.format(_("Interface %s %s"), slot, moduleName)}