- 
+ 
\n
{ something }
+ );
+}
+
+export default ${componentName};
+`;
+};
+
+const queriesContent = (name) =>
+ `// Here you define queries and mutations which connects the api with your components
+import { useQuery, useMutation } from '@tanstack/react-query';
+import { getSomething } from './${name}Api';
+
+export const useSomething = () => useQuery(['package', 'command'], getSomething);
+`;
+
+const apiContent = () =>
+ `// Here you define the api calls to the ubus uhttpd enpoints your plugin needs
+import api from 'utils/uhttpd.service';
+
+export const getSomething = () => api.call('package', 'command', {});
+`;
+
+const apiSpecContent = (name) =>
+ `// Here you define unit tests for the api endpoints of this plugin
+import { getSomething } from './${name}Api'
+import api from 'utils/uhttpd.service';
+import { of } from 'rxjs';
+jest.mock('utils/uhttpd.service')
+
+beforeEach(() => {
+ api.call.mockImplementation(() => of({status: 'ok'}))
+})
+
+describe('getSomething', () => {
+ it('test some behaviour', async () => {
+ expect(true).toBeTrue();
+ });
+ it('test some other behaviour', async () => {
+ expect(true).toBeTrue();
+ });
+});
+`;
+
+const specContent = (name) => {
+ const componentName = name.charAt(0).toUpperCase() + name.slice(1);
+ return `// Here you define tests that closely resemble how your component is used
+// Using the testing-library: https://testing-library.com
+
+import { screen, cleanup, act } from '@testing-library/preact';
+import '@testing-library/jest-dom';
+import { render } from 'utils/test_utils';
+import queryCache from 'utils/queryCache';
+
+import ${componentName} from './src/${name}Page';
+import { getSomething } from './src/${name}Api';
+
+jest.mock('./src/${name}Api');
+
+describe('${name}', () => {
+ beforeEach(() => {
+ getSomething.mockImplementation(async () => "something");
+ });
+
+ afterEach(() => {
+ cleanup();
+ act(() => queryCache.clear());
+ });
+
+ it('test that something is shown', async() => {
+ render(<${componentName} />);
+ expect(await screen.findByText('something')).toBeInTheDocument();
+ })
+});
+`;
+};
+
+const storiesContent = (name, menuName) => {
+ const componentName = name.charAt(0).toUpperCase() + name.slice(1);
+ return `//Here you define the StoryBook stories for this plugin
+
+import ${componentName} from './src/${name}Page';
+
+export default {
+ title: 'Containers/${menuName || name}'
+}
+
+export const myStory = () => <${componentName} />
+`;
+};
+
+const styleContent = () => "// Here you define the css for this plugin";
+
+yargs(hideBin(process.argv))
+ .command(
+ "$0 create 
+
+
+ {!session &&
+
+ );
+
+ export default RemoteSupportPage;
+```
+
+#### Style and Visualization
+
+##### Storybook
+
+Once our component passes the tests, we can add styling with CSS classes to achieve the UI we are looking for.
+
+In order to visualize our component while we add style to it we use [StoryBook](https://storybook.js.org/). Storybook allows you to define the different states of your screen as different user `Stories` and render your component isolated in that context. This is very helpfull as it speeds up the visual feedback while developing components. Also, once the stories are written, it is easy to go back to them to monitor changes in the UI.
+This is how it looks like:
+Ask for remote support
+ {!session &&
+
+
+ }
+ {openStatus.isError &&
+
+ Cannot connect to the remote support server
+Please verify your internet connection
+
+ }
+ {session &&
+ +
+
+
+ }
+ {openStatus.isLoading || closeStatus.isLoading &&
+ {session.rw_ssh}
+
+
+ Close Session
+ 
+
+
+Let's define the stories for our component.
+
+```javascript
+// File path: plugins/lime-plugin-remotesupport/remotesupport.stories.js
+import { RemoteSupportPage } from './src/remoteSupportPage';
+
+// In the default export we define a title for this group of stories.
+export default {
+ title: 'Containers/RemoteSupport'
+};
+
+// each additional export is a Story that represents a different scenario
+
+export const noSession = () =>
-
- );
- }
- }
-
- constructor(props) {
- super(props);
- this.state = {
- hostname: this.props.selectedHost,
- ip: this.props.nodeData.ips.filter(ip => ip.version === '4')[0].address
- };
- this.changeConfig = this.changeConfig.bind(this);
- this.handleHostname = this.handleHostname.bind(this);
- this.handleIp = this.handleIp.bind(this);
- this.handlePassword = this.handlePassword.bind(this);
- this.adminLogin = this.adminLogin.bind(this);
- }
-
- render() {
- return (
-
- {this.showLoading(this.props.loading)}
-
-
-
- );
- }
-}
-
-
-export const mapStateToProps = (state) => ({
- selectedHost: getSelectedHost(state),
- nodeData: getNodeData(state),
- authStatus: authStatus(state),
- loading: loading(state)
-});
-
-export const mapDispatchToProps = (dispatch) => ({
- changeConfig: bindActionCreators(changeConfig, dispatch),
- adminLogin: bindActionCreators(adminLogin, dispatch)
-});
-
-export default connect(mapStateToProps, mapDispatchToProps)(Admin);
-
diff --git a/plugins/lime-plugin-admin/src/adminReducer.js b/plugins/lime-plugin-admin/src/adminReducer.js
deleted file mode 100644
index 86cdfd99..00000000
--- a/plugins/lime-plugin-admin/src/adminReducer.js
+++ /dev/null
@@ -1,28 +0,0 @@
-import {
- RELOAD_CONFIG,
- AUTH_LOGIN_SUCCESS,
- SET_CONFIG,
- SET_CONFIG_ERROR
-} from './adminConstants';
-
-export const initialState = {
- sid: '00000000000000000000000000000000',
- auth: false,
- hostname: '',
- loading: false
-};
-
-export const reducer = (state = initialState, { type, payload }) => {
- switch (type) {
- case RELOAD_CONFIG:
- return Object.assign({}, initialState);
- case AUTH_LOGIN_SUCCESS:
- return Object.assign({}, state, { sid: payload, auth: true });
- case SET_CONFIG:
- return Object.assign({}, state, { hostname: payload.hostname, loading: true });
- case SET_CONFIG_ERROR:
- return Object.assign({}, state, { loading: false });
- default:
- return state;
- }
-};
diff --git a/plugins/lime-plugin-admin/src/adminSelectors.js b/plugins/lime-plugin-admin/src/adminSelectors.js
deleted file mode 100755
index dbbfda65..00000000
--- a/plugins/lime-plugin-admin/src/adminSelectors.js
+++ /dev/null
@@ -1,3 +0,0 @@
-export const getSid = (state) => state.admin.sid;
-export const authStatus = (state) => state.admin.auth;
-export const loading = (state) => state.admin.loading;
\ No newline at end of file
diff --git a/plugins/lime-plugin-admin/src/style.less b/plugins/lime-plugin-admin/src/style.less
deleted file mode 100755
index a77051d0..00000000
--- a/plugins/lime-plugin-admin/src/style.less
+++ /dev/null
@@ -1,4 +0,0 @@
-.green {
- background-color: #87d914 !important;
- color: #fff !important;
-}
\ No newline at end of file
diff --git a/plugins/lime-plugin-align/align.spec.js b/plugins/lime-plugin-align/align.spec.js
new file mode 100644
index 00000000..7dc32e31
--- /dev/null
+++ b/plugins/lime-plugin-align/align.spec.js
@@ -0,0 +1,190 @@
+import "@testing-library/jest-dom";
+import { act, fireEvent, screen } from "@testing-library/preact";
+
+import {
+ getBatHost,
+ getChangesNeedReboot,
+ getCommunitySettings,
+ getSession,
+} from "utils/api";
+import { DEFAULT_COMMUNITY_SETTINGS } from "utils/constants";
+import queryCache from "utils/queryCache";
+import { flushPromises, render } from "utils/test_utils";
+
+import { getAssocList, getMeshIfaces } from "./src/alignApi";
+import AlignPage from "./src/alignPage";
+
+jest.mock("./src/alignApi");
+jest.mock("utils/api");
+
+jest.mock("./src/speech.js", () => ({
+ speech: jest.fn(),
+}));
+
+async function mockAssocList(iface) {
+ if (iface === "wlan1-mesh") {
+ return Promise.resolve([
+ { mac: "52:00:00:ab:cd:a0", signal: -75, inactive: 20 },
+ { mac: "52:00:00:ab:cd:a1", signal: -73, inactive: 30 },
+ ]);
+ }
+ if (iface === "wlan2-mesh") {
+ return Promise.resolve([
+ { mac: "52:00:00:ab:cd:a2", signal: -63, inactive: 10 },
+ { mac: "52:00:00:ab:cd:a3", signal: -65, inactive: 20 },
+ ]);
+ }
+}
+
+async function mockBatHost(mac) {
+ const mac2bathost = {
+ "52:00:00:ab:cd:a0": { hostname: "mc-rocio", iface: "wlan1-mesh" },
+ "52:00:00:ab:cd:a1": { hostname: "mc-martinez", iface: "wlan1-mesh" },
+ "52:00:00:ab:cd:a2": { hostname: "mc-mile", iface: "wlan1-mesh" },
+ "52:00:00:ab:cd:a3": { hostname: "mc-tanque", iface: "wlan1-mesh" },
+ };
+ return mac2bathost[mac];
+}
+
+async function findNeighbors() {
+ let neighs = await screen.findAllByText(/mc-.*/);
+ return neighs.map((n) => n.textContent);
+}
+
+describe("align page", () => {
+ beforeAll(() => {
+ jest.useFakeTimers();
+ });
+
+ afterAll(() => {
+ jest.useRealTimers();
+ });
+
+ beforeEach(() => {
+ getMeshIfaces.mockImplementation(async () => [
+ "wlan1-mesh",
+ "wlan2-mesh",
+ ]);
+ getAssocList.mockClear().mockImplementation(mockAssocList);
+ getBatHost.mockImplementation(mockBatHost);
+ getCommunitySettings.mockImplementation(
+ async () => DEFAULT_COMMUNITY_SETTINGS
+ );
+ getChangesNeedReboot.mockImplementation(async () => true);
+ getSession.mockImplementation(async () => ({
+ username: "root",
+ }));
+ });
+
+ afterEach(() => {
+ act(() => queryCache.clear());
+ });
+
+ it("shows one tab for each mesh iface with its radio name", async () => {
+ render(
+ {isLoading || isError ? (
+
+ {station.inactive >= 3000 ? (
+
+ Fetching name
+
+ ) : (
+
+ {bathost.hostname}
+
+ )}
+ {bathost && bathost.iface && (
+
+ On its radio {radioNumber}
+
+ )}
+ {station.inactive >= 3000 && (
+
+
+ )}
+
+ Signal lost
+
+
+ Last packet :{" "}
+
+
+ X
+
+ ) : (
+
+
+ )}
+
+
+ {station.signal}
+ dBm
+
+
+ );
+ }
+
+ if (isError || !assoclist) {
+ return (
+
+ Error retrieving associated list
+
+ );
+ }
+
+ return (
+ -
+ {assoclist.length > 0 && (
+
+ These are the nodes associated on this radio
+
+ )}
+ {assoclist.map((station) => (
+
+ This radio is not associated with other nodes
+
+ )}
+
+
+ );
+ }
+
+ if (!ifaces || ifaces.length === 0) {
+ return (
+
+ The are not mesh interfaces available
+
+ );
+ }
+
+ return (
+
+
+ );
};
-class Align extends Component {
-
- changeInterface(e) {
- this.props.changeInterface(e.target.value);
- }
-
- changeStation(e) {
- this.props.changeStation(e.target.value);
- }
-
- startSpeech() {
- this.speechSubscription = this.alignValue
- .debounce(() => Observable.timer(1000))
- .subscribe((value) => {
- if ( (Math.floor(this.lastSpeech/10) !== Math.floor(value/10)) || Number(value.toString()[value.toString().length -1 ]) === 0 || this.resumedTimes === 5 ) {
- speech(value || 0, 'es-ES', voices, synth);
- this.resumedTimes = 0;
- }
- else {
- speech(value.toString()[value.toString().length - 1] || 0, 'es-ES', voices, synth);
- this.resumedTimes++;
- }
- this.lastSpeech = value;
- });
- }
-
- stopSpeech() {
- this.speechSubscription.unsubscribe();
- }
-
- colorBar(signal) {
- return Object.assign({}, style.bar,{ backgroundColor: colorScale.getColor(signal) });
- }
-
- constructor() {
- super();
- this.alignValue = new BehaviorSubject();
- this.speechSubscription = null;
- this.lastSpeech = 0;
- this.resumedTimes = 0;
- this.changeInterface = this.changeInterface.bind(this);
- this.changeStation = this.changeStation.bind(this);
- }
-
- componentWillMount() {
- this.props.startAlign();
- this.startSpeech();
- colorScale.setConfig({
- outputStart: 1,
- outputEnd: Number(this.props.settings.bad_signal)* -1,
- inputStart: Number(this.props.settings.good_signal)* -1,
- inputEnd: Number(this.props.settings.bad_signal)* -1 + 10
- });
- }
-
- componentWillUnmount() {
- this.props.stopAlign();
- this.stopSpeech();
- }
-
- render(state) {
- this.alignValue.next(state.alignData.currentReading.signal * -1);
- return (
-
-
- );
- }
-}
-
-
-const mapStateToProps = (state) => ({
- alignData: getAll(state),
- selectedHost: getSelectedHost(state),
- settings: getSettings(state)
-});
-
-const mapDispatchToProps = (dispatch) => ({
- changeInterface: bindActionCreators(changeInterface, dispatch),
- changeStation: bindActionCreators(changeStation, dispatch),
- startAlign: bindActionCreators(startAlign, dispatch),
- stopAlign: bindActionCreators(stopTimer,dispatch)
-});
-
-
-export default connect(mapStateToProps, mapDispatchToProps)(Align);
\ No newline at end of file
+export default Align;
diff --git a/plugins/lime-plugin-align/src/alignQueries.js b/plugins/lime-plugin-align/src/alignQueries.js
new file mode 100644
index 00000000..45d664e6
--- /dev/null
+++ b/plugins/lime-plugin-align/src/alignQueries.js
@@ -0,0 +1,27 @@
+import { useQuery } from "@tanstack/react-query";
+
+import { getAssocList, getMeshIfaces } from "./alignApi";
+import { markAssociated, sortBySignal } from "./utils";
+
+export function useMeshIfaces(queryConfig) {
+ return useQuery(
+ ["lime-utils", "get_mesh_ifaces"],
+ getMeshIfaces,
+ queryConfig
+ );
+}
+
+async function _getAssocList(iface) {
+ let assoclist = await getAssocList(iface);
+ assoclist = sortBySignal(assoclist);
+ assoclist = markAssociated(assoclist);
+ return assoclist;
+}
+
+export function useAssocList(iface, queryConfig) {
+ return useQuery(
+ ["iwinfo", "assoclist", iface],
+ async () => await _getAssocList(iface),
+ queryConfig
+ );
+}
diff --git a/plugins/lime-plugin-align/src/alignReducer.js b/plugins/lime-plugin-align/src/alignReducer.js
deleted file mode 100644
index 5833faff..00000000
--- a/plugins/lime-plugin-align/src/alignReducer.js
+++ /dev/null
@@ -1,46 +0,0 @@
-import {
- IFACES_LOAD_SUCCESS,
- STATIONS_LOAD_SUCCESS,
- STATION_SET,
- IFACE_SET,
- SIGNAL_GET_SUCCESS
-} from './alignConstants';
-
-export const initialState = {
- ifaces: [],
- stations: [],
- currentReading: {}
-};
-
-export const reducer = (state = initialState, { type, payload, meta }) => {
- switch (type) {
-
- case IFACES_LOAD_SUCCESS:
- return Object.assign({}, state, { ifaces: payload.filter(x => x.name) });
-
- case STATIONS_LOAD_SUCCESS:
- return Object.assign({}, state, { stations: payload });
-
- case STATION_SET:
- return Object.assign({}, state, { currentReading: payload });
-
- case IFACE_SET:
- return Object.assign({}, state, { stations: state.stations.filter(x => x.iface === payload) });
-
- case SIGNAL_GET_SUCCESS:
- if (state.currentReading.mac === payload.station) {
- let newCurrentReading = Object.assign({}, state.currentReading, { signal: payload.signal });
- let newStations = state.stations.map(station => {
- if (station.mac === payload.station) {
- station.signal = payload.signal;
- }
- return station;
- });
- return Object.assign({}, state, { currentReading: newCurrentReading, stations: newStations });
- }
- return state;
-
- default:
- return state;
- }
-};
diff --git a/plugins/lime-plugin-align/src/alignSelectors.js b/plugins/lime-plugin-align/src/alignSelectors.js
deleted file mode 100755
index cb52dba5..00000000
--- a/plugins/lime-plugin-align/src/alignSelectors.js
+++ /dev/null
@@ -1,3 +0,0 @@
-export const getAll = (state) => state.align;
-export const getSelectedHost = (state) => state.meta.selectedHost;
-export const getSettings = (state) => state.meta.settings;
\ No newline at end of file
diff --git a/plugins/lime-plugin-align/src/components/secondsAgo.js b/plugins/lime-plugin-align/src/components/secondsAgo.js
new file mode 100644
index 00000000..1e89b530
--- /dev/null
+++ b/plugins/lime-plugin-align/src/components/secondsAgo.js
@@ -0,0 +1,24 @@
+import { Trans } from "@lingui/macro";
+import { useEffect, useState } from "preact/hooks";
+import { useInterval } from "react-use";
+
+export const SecondsAgo = ({ initialMs, isStatic = false }) => {
+ const [count, setCount] = useState(0);
+
+ useEffect(() => {
+ setCount(0);
+ }, [initialMs]);
+
+ useInterval(
+ () => {
+ setCount((prev) => prev + 1);
+ },
+ isStatic ? null : 1000
+ );
+
+ const secondsAmount = Math.round(initialMs / 1000) + count;
+ if (secondsAmount > 60) {
+ return
-
-
-
- {this.props.selectedHost || ''}
-
-
- - {state.alignData.currentReading.signal || 0} - -
- - {state.alignData.currentReading.hostname || ''} - -
-
-
-
-
-
-
+ {!muted && 🔊}
+ {muted && 🔇}
+
+ );
+};
diff --git a/plugins/lime-plugin-align/src/containers/alignSingle/index.js b/plugins/lime-plugin-align/src/containers/alignSingle/index.js
new file mode 100644
index 00000000..7fb3bd4b
--- /dev/null
+++ b/plugins/lime-plugin-align/src/containers/alignSingle/index.js
@@ -0,0 +1,143 @@
+import { Trans } from "@lingui/macro";
+import { route } from "preact-router";
+import { useEffect, useState } from "preact/hooks";
+
+import Loading from "components/loading";
+import { SignalBar } from "components/signalbar";
+import signalStyle from "components/signalbar/style.less";
+
+import { useBatHost } from "utils/queries";
+
+import { useAssocList } from "../../alignQueries";
+import { SecondsAgo } from "../../components/secondsAgo";
+import { SignalSpeech } from "../../components/signalSpeech";
+import { ifaceToRadioNumber } from "../../utils";
+import style from "./style.less";
+
+function getStation(assoclist, mac) {
+ const station = assoclist.filter((sta) => sta.mac === mac);
+ if (station.length > 0) {
+ return station[0];
+ }
+ return null;
+}
+
+export const BestSignal = ({ signal }) => {
+ const [bestSignal, setBestSignal] = useState(null);
+ const [bestSignalTimestamp, setBestSignalTimestamp] = useState(null);
+
+ useEffect(() => {
+ if (!bestSignal || signal >= bestSignal) {
+ setBestSignal(signal);
+ setBestSignalTimestamp(Date.now());
+ }
+ }, [signal, bestSignal]);
+
+ if (!bestSignal) return;
+
+ return (
+
+
+ Best signal :
+
+
+ {bestSignal}
+ dBm
+
+
+ );
+};
+
+const SignalBox = ({ signal }) => (
+
+
+);
+
+const AlignSingle = ({ iface, mac }) => {
+ const { data: bathost } = useBatHost(mac, iface);
+ const {
+ data: assocList,
+ isLoading,
+ isError,
+ } = useAssocList(iface, {
+ refetchInterval: 2000,
+ });
+
+ if (isLoading) {
+ return (
+
+
+
+ {signal && (
+
+
+ {signal}
+ dBm
+
+ )}
+ {!signal && (
+
+ Signal lost
+
+ )}
+ {signal && (
+
+
+ );
+ }
+
+ if (isError || !assocList) {
+ return (
+
+ Error retrieving associated list
+
+ );
+ }
+
+ const station = assocList && getStation(assocList, mac);
+ const fromRadio = ifaceToRadioNumber(iface);
+ const toRadio = bathost.iface && ifaceToRadioNumber(bathost.iface);
+
+ return (
+
+
+ );
+};
+
+export default AlignSingle;
diff --git a/plugins/lime-plugin-align/src/containers/alignSingle/style.less b/plugins/lime-plugin-align/src/containers/alignSingle/style.less
new file mode 100644
index 00000000..e2eb8c35
--- /dev/null
+++ b/plugins/lime-plugin-align/src/containers/alignSingle/style.less
@@ -0,0 +1,48 @@
+.bar {
+ height: 1rem;
+}
+
+.speech {
+ font-size: 2rem;
+ margin-top: auto;
+ cursor: pointer;
+}
+
+.signal {
+ font-size: 9rem;
+ line-height: 9rem;
+ display: flex;
+ flex: auto;
+ align-items:baseline;
+}
+
+.notAssociated {
+ font-size: 3rem;
+ line-height: 3rem;
+ margin-top: 3rem;
+ margin-bottom: 3rem;
+}
+
+.section {
+ margin-top: 2rem;
+ text-align: center;
+}
+
+.hostname {
+ font-size: 3rem;
+}
+
+.bestSignal {
+ font-size: 3rem;
+ margin: 1rem;
+}
+
+.backArrow {
+ font-size: 2em;
+}
+
+.unit {
+ font-size: 0.3em;
+ line-height: 0.3em;
+ margin-left: 0.1em;
+}
diff --git a/plugins/lime-plugin-align/src/speech.js b/plugins/lime-plugin-align/src/speech.js
new file mode 100644
index 00000000..af75fd4c
--- /dev/null
+++ b/plugins/lime-plugin-align/src/speech.js
@@ -0,0 +1,13 @@
+const synth = window.speechSynthesis;
+
+export const speech = (text, lang) => {
+ if (synth !== undefined) {
+ let voices = synth.getVoices();
+ let utterThis = new SpeechSynthesisUtterance(text);
+ utterThis.pitch = 0.9;
+ utterThis.rate = 1.2;
+ utterThis.voice = voices.filter((x) => x.lang === lang)[0];
+ synth.cancel();
+ synth.speak(utterThis);
+ }
+};
diff --git a/plugins/lime-plugin-align/src/style.less b/plugins/lime-plugin-align/src/style.less
new file mode 100644
index 00000000..9373fac9
--- /dev/null
+++ b/plugins/lime-plugin-align/src/style.less
@@ -0,0 +1,18 @@
+.stationHostname {
+ font-size: 3rem;
+}
+
+.fetchingName {
+ font-size: 2rem;
+}
+
+.unit {
+ font-size: 0.3em;
+ margin-left: 0.1em;
+}
+
+.assoclistHeader {
+ padding-top: 0.5rem;
+ color: #666;
+ text-align: center;
+}
diff --git a/plugins/lime-plugin-align/src/utils.js b/plugins/lime-plugin-align/src/utils.js
new file mode 100644
index 00000000..bf598ea0
--- /dev/null
+++ b/plugins/lime-plugin-align/src/utils.js
@@ -0,0 +1,45 @@
+export function sortBySignal(assoclist, threshold = 3) {
+ /** Sort assoclist by signal but alphabetically when signal differs
+ * for less than threshold to avoid jumpy ordering when refetching.
+ * */
+ if (assoclist.length === 0) {
+ return assoclist;
+ }
+ const bySignal = [...assoclist];
+ bySignal.sort((a, b) => (a.signal > b.signal ? -1 : 1));
+ let lastSignal = bySignal[0].signal;
+ let currentIndex = 0;
+ for (let i = 0; i < bySignal.length; i++) {
+ const station = bySignal[i];
+ if (lastSignal - station.signal > threshold) {
+ currentIndex += 1;
+ lastSignal = station.signal;
+ }
+ station.sortIndex = currentIndex;
+ }
+ return bySignal.sort((a, b) =>
+ a.sortIndex < b.sortIndex ||
+ (a.sortIndex === b.sortIndex && a.mac < b.mac)
+ ? -1
+ : 1
+ );
+}
+
+export function markAssociated(assoclist) {
+ const result = [...assoclist];
+ result.forEach((sta) => {
+ sta.associated = sta.inactive < 2000;
+ });
+ return [
+ ...result.filter((sta) => sta.associated),
+ ...result.filter((sta) => !sta.associated),
+ ];
+}
+
+export function ifaceToRadioNumber(iface) {
+ const match = iface.match(/\D*(\d+)\D*/);
+ if (match?.length === 2) {
+ return match[1];
+ }
+ return iface;
+}
diff --git a/plugins/lime-plugin-align/test/actions.spec.js b/plugins/lime-plugin-align/test/actions.spec.js
deleted file mode 100644
index 8b137891..00000000
--- a/plugins/lime-plugin-align/test/actions.spec.js
+++ /dev/null
@@ -1 +0,0 @@
-
diff --git a/plugins/lime-plugin-align/test/menu.spec.js b/plugins/lime-plugin-align/test/menu.spec.js
deleted file mode 100644
index e69de29b..00000000
diff --git a/plugins/lime-plugin-align/test/mocha.opts b/plugins/lime-plugin-align/test/mocha.opts
deleted file mode 100644
index 7f8115cc..00000000
--- a/plugins/lime-plugin-align/test/mocha.opts
+++ /dev/null
@@ -1,3 +0,0 @@
---compilers js:babel-core/register
---require jsdom-global/register
-test/*.spec.js
\ No newline at end of file
diff --git a/plugins/lime-plugin-align/test/page.spec.js b/plugins/lime-plugin-align/test/page.spec.js
deleted file mode 100644
index e69de29b..00000000
diff --git a/plugins/lime-plugin-align/test/reducer.spec.js b/plugins/lime-plugin-align/test/reducer.spec.js
deleted file mode 100644
index e69de29b..00000000
diff --git a/plugins/lime-plugin-align/test/selectors.spec.js b/plugins/lime-plugin-align/test/selectors.spec.js
deleted file mode 100644
index e69de29b..00000000
diff --git a/plugins/lime-plugin-changeNode/changeNode.stories.js b/plugins/lime-plugin-changeNode/changeNode.stories.js
new file mode 100644
index 00000000..595363c3
--- /dev/null
+++ b/plugins/lime-plugin-changeNode/changeNode.stories.js
@@ -0,0 +1,17 @@
+import { action } from "@storybook/addon-actions";
+
+import { ChangeNode } from "./src/changeNodePage";
+
+const actions = {
+ loadStations: action("loadStations"),
+};
+
+export default {
+ title: "Containers/ChangeNode",
+ component: ChangeNode,
+};
+
+export const changeNodeScreen = (args) =>
+
+
+
+
+
+ With radio {fromRadio} alignin with
+
+ {bathost.hostname}
+ {toRadio && (
+
+ On its radio {toRadio}
+
+ )}
+
+
+ Last packet :{" "}
+
+ )}
+
+
+
+
+ );
+};
+
+const mapStateToProps = (state) => ({
+ stations: getStations(state),
+});
+
+const mapDispatchToProps = (dispatch) => ({
+ loadStations: bindActionCreators(loadStations, dispatch),
+});
+
+const changeNodeConnected = connect(
+ mapStateToProps,
+ mapDispatchToProps
+)(ChangeNode);
+export default changeNodeConnected;
diff --git a/plugins/lime-plugin-changeNode/src/changeNodeReducer.js b/plugins/lime-plugin-changeNode/src/changeNodeReducer.js
new file mode 100644
index 00000000..81a3e5ab
--- /dev/null
+++ b/plugins/lime-plugin-changeNode/src/changeNodeReducer.js
@@ -0,0 +1,14 @@
+import { LOAD_NEIGHBORS_SUCCESS } from "./changeNodeConstants";
+
+export const initialState = {
+ stations: [],
+};
+
+export const reducer = (state = initialState, { type, payload }) => {
+ switch (type) {
+ case LOAD_NEIGHBORS_SUCCESS:
+ return Object.assign({}, state, { stations: payload });
+ default:
+ return state;
+ }
+};
diff --git a/plugins/lime-plugin-changeNode/src/changeNodeSelectors.js b/plugins/lime-plugin-changeNode/src/changeNodeSelectors.js
new file mode 100755
index 00000000..32d9e420
--- /dev/null
+++ b/plugins/lime-plugin-changeNode/src/changeNodeSelectors.js
@@ -0,0 +1 @@
+export const getStations = (state) => state.changeNode.stations;
diff --git a/plugins/lime-plugin-core/index.js b/plugins/lime-plugin-core/index.js
deleted file mode 100755
index d68f0481..00000000
--- a/plugins/lime-plugin-core/index.js
+++ /dev/null
@@ -1,19 +0,0 @@
-import epics from './src/metaEpics';
-import { reducer } from './src/metaReducer';
-import * as selector from './src/metaSelectors';
-import * as constants from './src/metaConstants';
-import Meta from './src/metaPage';
-import { MetaMenu } from './src/metaMenu';
-
-export default {
- name: 'Config',
- page: Meta,
- menu: MetaMenu,
- store: {
- name: 'meta',
- epics,
- reducer,
- selector,
- constants
- }
-};
diff --git a/plugins/lime-plugin-core/src/metaActions.js b/plugins/lime-plugin-core/src/metaActions.js
deleted file mode 100755
index 5758d3bb..00000000
--- a/plugins/lime-plugin-core/src/metaActions.js
+++ /dev/null
@@ -1,15 +0,0 @@
-import {
- CONECTION_CHANGE_URL,
- CONECTION_CHANGE_CURRENT_BASE
-} from './metaConstants';
-
-export const changeBase = ( hostname ) => (dispatch, getState) => {
- dispatch({
- type: CONECTION_CHANGE_URL,
- payload: 'http://'+ hostname +'/ubus'
- });
- dispatch({
- type: CONECTION_CHANGE_CURRENT_BASE,
- payload: hostname
- });
-};
\ No newline at end of file
diff --git a/plugins/lime-plugin-core/src/metaApi.js b/plugins/lime-plugin-core/src/metaApi.js
deleted file mode 100644
index 2ebadacb..00000000
--- a/plugins/lime-plugin-core/src/metaApi.js
+++ /dev/null
@@ -1,16 +0,0 @@
-import 'rxjs/add/operator/map';
-import 'rxjs/add/operator/switchMap';
-
-export const login = (sid, api, auth) =>
- api.call(sid, 'session', 'login', Object.assign({}, auth, { timeout: 5000 })).map(result => result.ubus_rpc_session);
-
-export const changeUrl = (api, url) =>
- api.connect(url);
-
-export const getCloudNodes = (api, sid) => api.call(sid, 'lime-utils', 'get_cloud_nodes', {})
- .map(x => x.nodes)
- .map(data => Object.keys(data).map((key) => data[key]).reduce((x,y) => x.concat(y), []));
-
-export const getHostname = (api, sid) => api.call(sid, 'system', 'board', { });
-
-export const getCommunitySettings = (api, sid) => api.call(sid, 'lime-utils', 'get_community_settings', { });
\ No newline at end of file
diff --git a/plugins/lime-plugin-core/src/metaConstants.js b/plugins/lime-plugin-core/src/metaConstants.js
deleted file mode 100644
index 5ec3016c..00000000
--- a/plugins/lime-plugin-core/src/metaConstants.js
+++ /dev/null
@@ -1,17 +0,0 @@
-export const LOCATION_USER_SET = 'meta/LOCATION_USER_SET';
-export const CONECTION_START = 'meta/CONECTION_START';
-export const CONECTION_ERROR = 'meta/CONECTION_ERROR';
-export const CONECTION_SUCCESS = 'meta/CONECTION_SUCCESS';
-export const CONECTION_CHANGE_URL = 'meta/CONECTION_CHANGE_URL';
-export const CONECTION_LOAD_NEIGHBORS = 'meta/CONECTION_LOAD_NEIGHBORS';
-export const CONECTION_LOAD_NEIGHBORS_SUCCESS = 'meta/CONECTION_LOAD_NEIGHBORS_SUCCESS';
-export const CONECTION_LOAD_HOSTNAME = 'meta/CONECTION_LOAD_HOSTNAME';
-export const CONECTION_LOAD_HOSTNAME_SUCCESS = 'meta/CONECTION_LOAD_HOSTNAME_SUCCESS';
-export const CONECTION_CHANGE_CURRENT_BASE = 'meta/CONECTION_CHANGE_CURRENT_BASE';
-
-export const CONECTION_SETTINGS = 'meta/CONECTION_SETTINGS';
-
-export const COMMUNITY_SETTINGS_LOAD_SUCCESS = 'meta/COMMUNITY_SETTINGS_LOAD_SUCCESS';
-
-export const AUTH_LOGIN = 'meta/AUTH_LOGIN';
-export const AUTH_LOGIN_SUCCESS = 'meta/AUTH_LOGIN_SUCCESS';
diff --git a/plugins/lime-plugin-core/src/metaEpics.js b/plugins/lime-plugin-core/src/metaEpics.js
deleted file mode 100644
index a18ee79f..00000000
--- a/plugins/lime-plugin-core/src/metaEpics.js
+++ /dev/null
@@ -1,108 +0,0 @@
-import {
- CONECTION_START,
- CONECTION_SUCCESS,
- CONECTION_ERROR,
- CONECTION_CHANGE_URL,
- CONECTION_SETTINGS,
- CONECTION_LOAD_NEIGHBORS,
- CONECTION_LOAD_NEIGHBORS_SUCCESS,
- CONECTION_LOAD_HOSTNAME,
- CONECTION_LOAD_HOSTNAME_SUCCESS,
- AUTH_LOGIN,
- AUTH_LOGIN_SUCCESS,
- COMMUNITY_SETTINGS_LOAD_SUCCESS
-} from './metaConstants';
-
-import {
- changeUrl,
- getHostname,
- getCloudNodes,
- login,
- getCommunitySettings
-} from './metaApi';
-
-import { Observable } from 'rxjs/Observable';
-import 'rxjs/add/operator/mapTo';
-import 'rxjs/add/operator/map';
-import 'rxjs/add/operator/mergeMap';
-import 'rxjs/add/operator/catch';
-import 'rxjs/add/operator/delay';
-
-
-import { push } from 'preact-router-redux';
-
-const conectionOff = ( action$ ) =>
- action$.ofType(CONECTION_START)
- .map((action) => ({ type: CONECTION_SETTINGS, payload: { conection: false, ws: action.payload } }));
-
-const conectionAction = ( action$, store, { wsAPI } ) =>
- action$.ofType(CONECTION_START)
- .mergeMap( url => wsAPI.connect(url.payload)
- .mapTo({ type: CONECTION_SUCCESS, payload: { conection: true } })
- .catch(error => ([{
- type: 'NOTIFICATION',
- payload: { msg: 'Not UBUS api in remote device', error }
- },{
- type: CONECTION_ERROR,
- payload: 'http://thisnode.info/ubus'
- }]))
- );
-
-const changeUrlAction = ( action$, store, { wsAPI } ) =>
- action$.ofType(CONECTION_CHANGE_URL)
- .mergeMap( url => changeUrl(wsAPI, url.payload)
- .mapTo({ type: CONECTION_SUCCESS, payload: { conection: true } })
- .catch(error => ([{
- type: 'NOTIFICATION',
- payload: { msg: 'Not UBUS api in remote device', error }
- },{
- type: CONECTION_START,
- payload: 'http://thisnode.info/ubus'
- }]))
- );
-
-
-const loadHostname = ( action$, store, { wsAPI }) =>
- action$.ofType(...[CONECTION_LOAD_HOSTNAME,AUTH_LOGIN_SUCCESS])
- .mergeMap(() => getHostname(wsAPI, store.getState().meta.sid))
- .map(payload => ({ type: CONECTION_LOAD_HOSTNAME_SUCCESS, payload }));
-
-const loadNetwork = ( action$, store, { wsAPI }) =>
- action$.ofType(...[CONECTION_LOAD_NEIGHBORS, CONECTION_LOAD_HOSTNAME_SUCCESS])
- .mergeMap(() => getCloudNodes(wsAPI,store.getState().meta.sid))
- .map(payload => ({ type: CONECTION_LOAD_NEIGHBORS_SUCCESS, payload }));
-
-const defaultLoginAction = ( action$ ) =>
- action$.ofType(CONECTION_SUCCESS)
- .mapTo({ type: AUTH_LOGIN, payload: { username: 'lime-app', password: 'generic' } });
-
-const loginAction = ( action$, store, { wsAPI } ) =>
- action$.ofType(AUTH_LOGIN)
- .mergeMap( action => login(store.getState().meta.sid, wsAPI,action.payload))
- .map((sid) => ({ type: AUTH_LOGIN_SUCCESS, payload: sid }));
-
-const redirectOnConnection = ( action$, store ) =>
- action$.ofType(AUTH_LOGIN_SUCCESS)
- .mapTo(push(store.getState().meta.home));
-
-const communitySettings = (action$, store, { wsAPI } ) =>
- action$.ofType(AUTH_LOGIN_SUCCESS)
- .mergeMap( action => getCommunitySettings(wsAPI, store.getState().meta.sid))
- .map((settings) => ({ type: COMMUNITY_SETTINGS_LOAD_SUCCESS, payload: settings }));
-
-const closeNotificatins = (action$, store, { wsAPI } ) =>
- action$.ofType('NOTIFICATION')
- .mergeMap(() => Observable.of({ type: 'NOTIFICATION_HIDE' }).delay(2000));
-
-export default {
- conectionOff,
- conectionAction,
- changeUrlAction,
- loadNetwork,
- loadHostname,
- defaultLoginAction,
- loginAction,
- redirectOnConnection,
- communitySettings,
- closeNotificatins
-};
diff --git a/plugins/lime-plugin-core/src/metaMenu.js b/plugins/lime-plugin-core/src/metaMenu.js
deleted file mode 100755
index a9c1148d..00000000
--- a/plugins/lime-plugin-core/src/metaMenu.js
+++ /dev/null
@@ -1,7 +0,0 @@
-import { h } from 'preact';
-
-import I18n from 'i18n-js';
-
-export const MetaMenu = () => (
- {I18n.t('Config')}
-);
\ No newline at end of file
diff --git a/plugins/lime-plugin-core/src/metaPage.js b/plugins/lime-plugin-core/src/metaPage.js
deleted file mode 100644
index 9e5bc11a..00000000
--- a/plugins/lime-plugin-core/src/metaPage.js
+++ /dev/null
@@ -1,79 +0,0 @@
-import { h, Component } from 'preact';
-
-import { bindActionCreators } from 'redux';
-import { connect } from 'preact-redux';
-
-import { changeBase } from './metaActions';
-import { getBase, getStations, getSelectedHost } from './metaSelectors';
-
-import I18n from 'i18n-js';
-
-export class Meta extends Component {
-
- handleChange(e) {
- this.setState({ station: e.target.value });
- return this.state.station;
- }
-
- nextStation(e) {
- e.preventDefault();
- if (typeof this.state.station !== 'undefined') {
- return this.props.changeBase(this.state.station);
- }
- }
-
- isSelected(target) {
- return target === this.props.selectedHost;
- }
-
- constructor(props) {
- super(props);
- this.state = {
- station: this.props.selectedHost
- };
- this.nextStation = this.nextStation.bind(this);
- this.handleChange = this.handleChange.bind(this);
- this.isSelected = this.isSelected.bind(this);
- }
-
- render() {
- return (
-
+ Visit a neighboring node
+
+
+
-
-
- );
- }
-}
-
-
-export const mapStateToProps = (state) => ({
- stations: getStations(state),
- base: getBase(state),
- selectedHost: getSelectedHost(state)
-});
-
-export const mapDispatchToProps = (dispatch) => ({
- changeBase: bindActionCreators(changeBase,dispatch)
-});
-
-export default connect(mapStateToProps, mapDispatchToProps)(Meta);
diff --git a/plugins/lime-plugin-core/src/metaReducer.js b/plugins/lime-plugin-core/src/metaReducer.js
deleted file mode 100644
index c70e3011..00000000
--- a/plugins/lime-plugin-core/src/metaReducer.js
+++ /dev/null
@@ -1,67 +0,0 @@
-import {
- CONECTION_SUCCESS,
- CONECTION_ERROR,
- CONECTION_START,
- CONECTION_CHANGE_URL,
- CONECTION_LOAD_NEIGHBORS_SUCCESS,
- CONECTION_LOAD_HOSTNAME_SUCCESS,
- CONECTION_CHANGE_CURRENT_BASE,
- AUTH_LOGIN_SUCCESS,
- COMMUNITY_SETTINGS_LOAD_SUCCESS
-} from './metaConstants';
-
-const defaultSettings = {
- bad_signal: '-82',
- acceptable_loss: '20',
- bad_bandwidth: '1',
- good_signal: '-65',
- good_bandwidth: '5'
-};
-
-export const initialState = {
- title: 'LimeApp',
- sid: '00000000000000000000000000000000',
- status: 'start',
- alert: undefined,
- url: '/',
- conection: false,
- ws: '',
- interval: 1500,
- stations: [],
- base: '',
- home: '/rx',
- selectedHost: '',
- settings: defaultSettings
-};
-
-export const reducer = (state = initialState, { type, payload }) => {
- switch (type) {
- case CONECTION_START:
- return Object.assign({}, state, { conection: false, ws: payload, sid: '00000000000000000000000000000000' });
- case CONECTION_CHANGE_URL:
- return Object.assign({}, state, { conection: false, ws: payload, sid: '00000000000000000000000000000000' });
- case CONECTION_SUCCESS:
- return Object.assign({}, state, payload, { error: undefined });
- case CONECTION_ERROR:
- return Object.assign({}, state, { conection: false, error: 'ubusapi-not-found' });
- case AUTH_LOGIN_SUCCESS:
- return Object.assign({}, state, { sid: payload });
- case CONECTION_LOAD_HOSTNAME_SUCCESS:
- if (state.base === ''){
- return Object.assign({}, state, { base: payload.hostname, selectedHost: payload.hostname });
- }
- return Object.assign({}, state, { selectedHost: payload.hostname });
- case CONECTION_CHANGE_CURRENT_BASE:
- return Object.assign({}, state, { selectedHost: '' });
- case CONECTION_LOAD_NEIGHBORS_SUCCESS:
- return Object.assign({}, state, { stations: payload.concat([state.selectedHost]).sort(),status: 'ready' });
- case COMMUNITY_SETTINGS_LOAD_SUCCESS:
- return Object.assign({}, state, { settings: Object.assign({},defaultSettings, payload) });
- case 'NOTIFICATION':
- return Object.assign({}, state, { alert: payload.msg });
- case 'NOTIFICATION_HIDE':
- return Object.assign({}, state, { alert: undefined });
- default:
- return state;
- }
-};
diff --git a/plugins/lime-plugin-core/src/metaSelectors.js b/plugins/lime-plugin-core/src/metaSelectors.js
deleted file mode 100755
index 8ce48867..00000000
--- a/plugins/lime-plugin-core/src/metaSelectors.js
+++ /dev/null
@@ -1,5 +0,0 @@
-export const getSid = (state) => state.meta.sid;
-export const getUrl = (state) => state.meta.url;
-export const getStations = (state) => state.meta.stations;
-export const getBase = (state) => state.meta.base;
-export const getSelectedHost = (state) => state.meta.selectedHost;
\ No newline at end of file
diff --git a/plugins/lime-plugin-core/src/style.less b/plugins/lime-plugin-core/src/style.less
deleted file mode 100755
index a77051d0..00000000
--- a/plugins/lime-plugin-core/src/style.less
+++ /dev/null
@@ -1,4 +0,0 @@
-.green {
- background-color: #87d914 !important;
- color: #fff !important;
-}
\ No newline at end of file
diff --git a/plugins/lime-plugin-core/test/actions.spec.js b/plugins/lime-plugin-core/test/actions.spec.js
deleted file mode 100644
index 0659fa2c..00000000
--- a/plugins/lime-plugin-core/test/actions.spec.js
+++ /dev/null
@@ -1,17 +0,0 @@
-import limeCorePlugin from '../src/index';
-import { changeBase } from '../src/metaActions';
-import { expect } from 'chai';
-
-describe('Dispatch action', () => {
- it('On change url', () => {
- let change = changeBase('test');
- let dispatched = [];
- change((action) => dispatched.push(action),'');
- expect(JSON.stringify(dispatched)).to.be.equal(JSON.stringify([
- { type: limeCorePlugin.store.constants.CONECTION_CHANGE_URL,
- payload: 'ws://test/websocket/' },
- { type: limeCorePlugin.store.constants.CONECTION_CHANGE_CURRENT_BASE,
- payload: 'test' }
- ]));
- });
-});
diff --git a/plugins/lime-plugin-core/test/epics.spec.js b/plugins/lime-plugin-core/test/epics.spec.js
deleted file mode 100644
index 45f33421..00000000
--- a/plugins/lime-plugin-core/test/epics.spec.js
+++ /dev/null
@@ -1,263 +0,0 @@
-
-import limeCorePlugin from '../src/index';
-import { assert } from 'chai';
-
-import { ActionsObservable } from 'redux-observable';
-import { Observable } from 'rxjs/Observable';
-
-import 'rxjs/add/operator/toArray';
-import 'rxjs/add/observable/of';
-
-const c = limeCorePlugin.store.constants;
-const epics = limeCorePlugin.store.epics;
-
-//Epic test util
-const epicAssert = (epic,options,compare,done) => epic(ActionsObservable.of(options.action),options.store, options.api)
- .toArray()
- .subscribe(actualOutputActions => {
- compare(actualOutputActions, options.result);
- done();
- });
-
-
-//TESTS
-
-describe('Connections epics', () => {
- it('On connection start send Settings', (done) => {
- let onAction = {
- type: c.CONECTION_START,
- payload: 'fakeHostname'
- };
- let expectedOutput = {
- type: c.CONECTION_SETTINGS,
- payload: {
- conection: false,
- ws: 'fakeHostname'
- }
- };
- let options = {
- action: onAction,
- result: [expectedOutput],
- store: null,
- api: {}
- };
-
- epicAssert(
- epics.conectionOff,
- options,
- assert.deepEqual,
- done
- );
- });
-
-
- it('On connection start try connect websocket', (done) => {
- let onAction = {
- type: c.CONECTION_START,
- payload: 'fakeHostname'
- };
- let expectedOutput = {
- type: c.CONECTION_SUCCESS,
- payload: {
- conection: true
- }
- };
- let wsAPI = {
- conect: () => Observable.of({})
- };
- let options = {
- action: onAction,
- result: [expectedOutput],
- store: null,
- api: { wsAPI }
- };
-
- epicAssert(
- epics.conectionAction,
- options,
- assert.deepEqual,
- done
- );
- });
-
-
- it('Change url', (done) => {
- let onAction = {
- type: c.CONECTION_CHANGE_URL,
- payload: 'newFakeHostname'
- };
- let expectedOutput = {
- type: c.CONECTION_SUCCESS,
- payload: {
- conection: true
- }
- };
- let wsAPI = {
- _wss: {
- url: 'fackeHostname'
- },
- call: () => Observable.of({})
- };
- let options = {
- action: onAction,
- result: [expectedOutput],
- store: null,
- api: { wsAPI }
- };
-
- epicAssert(
- epics.changeUrlAction,
- options,
- assert.deepEqual,
- done
- );
- });
-
- it('Load host name', (done) => {
- let hostname = 'fakeHostname';
- let action = {
- type: c.AUTH_LOGIN_SUCCESS
- };
- let result = [{
- type: c.CONECTION_LOAD_HOSTNAME_SUCCESS,
- payload: {
- hostname
- }
- }];
- let api = {
- wsAPI: {
- call: (sid,patch,opt) => Observable.of({ hostname })
- }
- };
- let store = {
- getState: () => ({
- meta: { sid: '123' }
- })
- };
-
- epicAssert(
- epics.loadHostname,
- {
- action,
- result,
- store,
- api
- },
- assert.deepEqual,
- done
- );
- });
-
- it('Load network', (done) => {
- let action = {
- type: c.CONECTION_LOAD_HOSTNAME_SUCCESS
- };
- let result = [{
- type: c.CONECTION_LOAD_NEIGHBORS_SUCCESS,
- payload: ['test1','test2','test3']
- }];
- let api = {
- wsAPI: {
- call: () => Observable.of({ nodes: { 0: 'test1',1: 'test2',2: 'test3' } })
- }
- };
- let store = {
- getState: () => ({
- meta: { sid: '123' }
- })
- };
-
- epicAssert(
- epics.loadNetwork,
- {
- action,
- result,
- store,
- api
- },
- assert.deepEqual,
- done
- );
- });
-
- it('Login on connection', (done) => {
- let action = {
- type: c.CONECTION_SUCCESS
- };
- let result = [{
- type: c.AUTH_LOGIN,
- payload: { user: 'admin', password: 'admin' }
- }];
-
- epicAssert(
- epics.defaultLoginAction,
- {
- action,
- result,
- store: null,
- api: null
- },
- assert.deepEqual,
- done
- );
- });
-
- it('Perform login', (done) => {
- let action = {
- type: c.AUTH_LOGIN,
- payload: { user: 'admin', password: 'admin' }
- };
- let result = [{
- type: c.AUTH_LOGIN_SUCCESS,
- payload: 123
- }];
- let api = {
- wsAPI: {
- call: () => Observable.of({ token: 321,success: 123 })
- }
- };
- epicAssert(
- epics.loginAction,
- {
- action,
- result,
- store: null,
- api
- },
- assert.deepEqual,
- done
- );
- });
-
- it('Reconnect on connection', (done) => {
- let customPage = 'customHomeRoute';
- let action = {
- type: c.CONECTION_SUCCESS
- };
- let result = [{
- type: '@@router/CALL_HISTORY_METHOD',
- payload: {
- args: [ customPage ],
- method: 'push'
- }
- }];
- let store = {
- getState: () => ({
- meta: { sid: '123', home: customPage }
- })
- };
-
- epicAssert(
- epics.redirectOnConnection,
- {
- action,
- result,
- store,
- api: null
- },
- assert.deepEqual,
- done
- );
- });
-
-});
\ No newline at end of file
diff --git a/plugins/lime-plugin-core/test/menu.spec.js b/plugins/lime-plugin-core/test/menu.spec.js
deleted file mode 100644
index 60e82768..00000000
--- a/plugins/lime-plugin-core/test/menu.spec.js
+++ /dev/null
@@ -1,14 +0,0 @@
-import { h } from 'preact'; /** @jsx h */
-import chai, { expect } from 'chai';
-import assertJsx from 'preact-jsx-chai';
-
-chai.use(assertJsx);
-
-import { MetaMenu } from '../src/metaMenu';
-
-describe('Menu item', () => {
- it.skip('Render html', () => {
- expect(
-
- Connected Host: host-01
- Base Host: host-base
-
+
+
+
+
+
+
+
+
+ );
+};
diff --git a/build/assets/.gitkeep b/plugins/lime-plugin-fbw/src/containers/SelectAction.js
similarity index 100%
rename from build/assets/.gitkeep
rename to plugins/lime-plugin-fbw/src/containers/SelectAction.js
diff --git a/plugins/lime-plugin-fbw/src/containers/Setting.js b/plugins/lime-plugin-fbw/src/containers/Setting.js
new file mode 100644
index 00000000..00778a78
--- /dev/null
+++ b/plugins/lime-plugin-fbw/src/containers/Setting.js
@@ -0,0 +1,146 @@
+import { Trans } from "@lingui/macro";
+import { useState } from "preact/hooks";
+import { useInterval } from "react-use";
+
+import Loading from "components/loading";
+import ProgressBar from "components/progressbar";
+
+import "../style.less";
+
+export const Setting = ({ expectedHost, expectedNetwork, delay = 1000 }) => {
+ const [progress, setProgress] = useState(0);
+ const [time, setTime] = useState(120);
+
+ const [state, setState] = useState({
+ hostname: null,
+ action: "setting",
+ notOnNetwork: false,
+ });
+
+ const wifiSsid = `${expectedNetwork}/${expectedHost}`;
+ function fetchHost() {
+ if (state.action === "finish") return;
+ if (state.action === "setting") {
+ setState({
+ ...state,
+ action: "checking",
+ });
+ }
+
+ fetch("http://thisnode.info/cgi-bin/hostname")
+ .then((res) => res.text())
+ .then((res) => {
+ res = res.split("\n")[0];
+ if (res === expectedHost) {
+ setState({
+ ...state,
+ action: "finish",
+ hostname: res,
+ notOnNetwork: false,
+ });
+ } else if (state.notOnNetwork === false) {
+ setState({
+ ...state,
+ notOnNetwork: true,
+ });
+ }
+ })
+ .catch(() => {
+ if (state.notOnNetwork === true) {
+ setState({
+ ...state,
+ notOnNetwork: false,
+ });
+ }
+ });
+ }
+
+ function runProgress(totalTime, cb) {
+ if (time > 0) setTime((time) => time - 1);
+ if (progress < 100)
+ setProgress((progress) => progress + 100 / totalTime);
+ if (time <= 1) cb();
+ }
+
+ function reload() {
+ window.location.href = "http://thisnode.info/app";
+ }
+
+ useInterval(() => {
+ runProgress(120, fetchHost);
+ }, delay);
+
+ return (
+
+
+ Configure your new community network
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ {state.action !== "finish" ? (
+
+ );
+};
diff --git a/plugins/lime-plugin-fbw/src/containers/scanPage/ScanList.js b/plugins/lime-plugin-fbw/src/containers/scanPage/ScanList.js
new file mode 100644
index 00000000..23aea023
--- /dev/null
+++ b/plugins/lime-plugin-fbw/src/containers/scanPage/ScanList.js
@@ -0,0 +1,165 @@
+import { Trans } from "@lingui/macro";
+import { useEffect, useState } from "preact/hooks";
+
+import { List } from "components/list";
+import { Loading } from "components/loading";
+import Toast from "components/toast";
+
+import { useFbwStatus, useScanRestart, useScanStart } from "../../FbwQueries";
+import style from "../../style.less";
+import { CancelButton, RescanButton } from "./components/buttons";
+import { NetworkTile } from "./components/networkTile";
+
+export const ScanList = ({
+ selectedNetwork,
+ setSelectedNetwork,
+ cancelSelectedNetwork,
+ cancel,
+}) => {
+ const [expandedAps, setExpandedAps] = useState([]); // Expand scanned lists
+ const [pollingInterval, setPollingInterval] = useState(null);
+
+ const {
+ mutate: scanStart,
+ isLoading: isStarting,
+ isError: startError,
+ } = useScanStart({ onSuccess: () => setPollingInterval(1000) });
+
+ const {
+ mutate: scanRestart,
+ isLoading: isRestarting,
+ isError: restartError,
+ } = useScanRestart({
+ onSuccess: () => {
+ setPollingInterval(1000);
+ refetchScanResults();
+ },
+ });
+
+ const {
+ data: scanResults,
+ isError: scanStatusError,
+ remove: removeScanStatus,
+ isLoading: isLoadingScans,
+ refetch: refetchScanResults,
+ } = useFbwStatus({
+ enabled: pollingInterval !== null && !startError && !restartError,
+ refetchInterval: pollingInterval,
+ onSuccess: (data) => {
+ if (data.status === "scanned") setPollingInterval(null);
+ },
+ });
+
+ const status = scanResults?.status || null; // Scan status
+ const networks = scanResults?.networks || []; // Configuration files downloaded
+ const scanned = scanResults?.scanned || []; // Scanned AP's
+ const isLoading = isStarting || isRestarting || isLoadingScans;
+
+ useEffect(() => {
+ if (scanResults === undefined) scanStart();
+ }, []);
+
+ function _rescan() {
+ cancelSelectedNetwork();
+ scanRestart();
+ }
+
+ async function _cancel() {
+ if (await cancel()) {
+ removeScanStatus();
+ }
+ }
+
+ function selectNetwork(netIdx) {
+ const { config, file } = networks[netIdx];
+ setSelectedNetwork({
+ ...selectedNetwork,
+ file,
+ apname: config.wifi.apname_ssid.split("/%H")[0],
+ community: config.wifi.ap_ssid,
+ });
+ }
+
+ const getNetworkFromBssid = (bssid) => {
+ for (let i = 0; i < networks.length; i++) {
+ if (networks[i].bssid === bssid)
+ return { ...networks[i], index: i };
+ }
+ return "";
+ };
+
+ const NetworksList = () => {
+ return (
+
+ {state.action === "setting" ? (
+
+ ) : (
+
+
+
+
+ ) : (
+ false
+ )}
+ {state.action === "checking" ? (
+
+ Setting network
+
+
+
+ Please wait {time} seconds
+
+
+
+
+
+
+ ) : (
+ false
+ )}
+
+ Checking connection
+
+
+
+
+
+
+
+ )}
+
+ Congratulations
+
+
+
+
+
+
-
+ {scanned.length > 0 && (
+
+ Choose a mesh node to join it's network:
+
+ )}
+ {scanned.length > 0 &&
+ scanned.map((station) => (
+
+ Error scanning networks} />
+ ))}
+ {scanStatusError && (
+ Error getting scan results} />
+ )}
+ {(status === "scanning" || isLoading) && (
+ Scanning for existing networks} />
+ )}
+
+ );
+};
diff --git a/plugins/lime-plugin-fbw/src/containers/scanPage/ScanPage.tsx b/plugins/lime-plugin-fbw/src/containers/scanPage/ScanPage.tsx
new file mode 100644
index 00000000..122dd218
--- /dev/null
+++ b/plugins/lime-plugin-fbw/src/containers/scanPage/ScanPage.tsx
@@ -0,0 +1,88 @@
+import { Trans } from "@lingui/macro";
+import { Fragment } from "preact";
+import { useState } from "preact/hooks";
+
+import Toast from "components/toast";
+
+import { useBoardData } from "utils/queries";
+
+import { useScanStop } from "../../FbwQueries";
+import { ScanList } from "./ScanList";
+import { SelectForm } from "./SelectForm";
+
+interface SelectedNetwork {
+ hostname: string;
+ file?: any;
+ apname?: string;
+ community?: string;
+}
+
+export const ScanPage = ({
+ toggleForm,
+ setExpectedHost,
+ setExpectedNetwork,
+}) => {
+ const { data: boardData } = useBoardData();
+
+ const [selectedNetwork, setSelectedNetwork] = useState
+
+ {startError ||
+ (restartError && (
+
+ {(status === "scanning" && !selectedNetwork?.apname) ||
+ isLoading ? (
+
+
+
+ ) : (
+ false
+ )}
+ {!selectedNetwork?.apname ? (
+
+
+
+
+ ) : (
+ false
+ )}
+ {scanned.length === 0 && status === "scanned" ? (
+
+
+ No scan result
+
+
+ ) : (
+ false
+ )}
+ {!selectedNetwork?.apname ? (
+
+
+
+
+
+
+
+
+ Error setting network} />
+ )}
+ {validHostnameError && (
+ Must select a valid hostname} />
+ )}
+
+ );
+};
diff --git a/plugins/lime-plugin-fbw/src/containers/scanPage/components/buttons.js b/plugins/lime-plugin-fbw/src/containers/scanPage/components/buttons.js
new file mode 100644
index 00000000..5a4d3fa7
--- /dev/null
+++ b/plugins/lime-plugin-fbw/src/containers/scanPage/components/buttons.js
@@ -0,0 +1,25 @@
+import { Trans } from "@lingui/macro";
+
+export const RescanButton = ({ rescan }) => {
+ return (
+
+ );
+};
+
+export const CancelButton = ({ cancel }) => {
+ return (
+
+ );
+};
+
+export const BackButton = ({ goBack }) => {
+ return (
+
+ );
+};
diff --git a/plugins/lime-plugin-fbw/src/containers/scanPage/components/networkTile.js b/plugins/lime-plugin-fbw/src/containers/scanPage/components/networkTile.js
new file mode 100644
index 00000000..7311ec4b
--- /dev/null
+++ b/plugins/lime-plugin-fbw/src/containers/scanPage/components/networkTile.js
@@ -0,0 +1,149 @@
+import { Trans } from "@lingui/macro";
+
+import { ListItem } from "components/list";
+import { SignalBar } from "components/signalbar";
+import signalStyle from "components/signalbar/style.less";
+
+import style from "../../../style.less";
+
+export const NetworkTile = ({
+ station,
+ network,
+ expandedAps,
+ setExpandedAps,
+ status,
+ onSelect,
+}) => {
+ let hostname = network.ap; // Hostname got from config file
+ let listKey = station.bssid.replaceAll(":", "_"); // Used as key to expand the card
+
+ const setExpanded = () => {
+ if (expandedAps.includes(listKey)) {
+ setExpandedAps([...expandedAps.filter((v) => v !== listKey)]);
+ } else {
+ setExpandedAps([...expandedAps, listKey]);
+ }
+ };
+
+ const statusMessage = () => {
+ // console.debug(station, station?.status, hostname, status)
+ // Case no scanned status or scanned is true but scan end
+ if (
+ (station.status == null ||
+ (station?.status?.code === "downloaded_config" &&
+ hostname === undefined) ||
+ station?.status?.code === "downloading_config") &&
+ status === "scanned"
+ ) {
+ return (
+
+
+ {isSetNetworkError && (
+
+ {selectedNetwork.apname ? (
+
+
+
+ ) : (
+ false
+ )}
+
+
+
+
+
+
+
+
+
+
+
+
+ Join the mesh
+
+
+
+
+
+
+
+
+
+
+
+
+ Error reaching hostname!
+
+ );
+ }
+ // Case configuration download not started yet
+ else if (station.status == null) {
+ return (
+
+ Connection attempt not yet started
+
+ );
+ }
+ // Case scan retval is false
+ else if (station.status.retval === false) {
+ let msg;
+ switch (station.status.code) {
+ case "error_download_lime_community":
+ msg = {msg}
;
+ }
+ // Case scan retval is true
+ else if (station.status.retval === true) {
+ // Is downloading
+ if (station.status.code == "downloading_config") {
+ return (
+
+ Fetching name
+
+ );
+ }
+ // Has hostname
+ else if (station.status.code === "downloaded_config" && hostname) {
+ return (
+
+ {hostname}
+
+ {`(${network.config.wifi.ap_ssid})`}
+
+
+ );
+ }
+ }
+ return (
+
+ Unknown error
+
+ );
+ };
+
+ return (
+
+ {statusMessage()}
+
+
+
+ {station.bssid}
+
+ Channel : {station.channel}
+
+
+ {hostname && station?.status?.code == "downloaded_config" && (
+
+ )}
+
+
+
+
+
+
+ {station.signal}
+
+
+
+);
+
+export const Reverted = () => (
+
+
+
+
+ )}
+
+
+
+
+
+ Please wait while the device reboots, and reload the app
+
+
+
+);
+
+export const ConfirmPage = ({ hasReverted, onReverted }) => {
+ const { mutateAsync: upgradeConfirm, isLoading: isConfirming } =
+ useUpgradeConfirm();
+ const { mutate: upgradeRevert, isLoading: isReverting } =
+ useUpgradeRevert();
+
+ async function onConfirm() {
+ await upgradeConfirm();
+ route("/");
+ }
+
+ async function onRevert() {
+ await upgradeRevert();
+ onReverted();
+ }
+
+ if (hasReverted) {
+ return
+ Reverting to previous version
+
+
+
+
+ );
+ }
+ if (upgradeInfo.suCounter > 0 || hasReverted) {
+ return (
+
+ {versionName} is now available
+
+
+ )
+ }
+
+
+ );
+ }
+
+ function onNotShowAgain(e) {
+ const value = e.target.checked ? newVersion.version : "show";
+ localStorage.setItem("hideReleaseBannerPlease", value);
+ }
+
+ return (
+
+
+
+ Currently your node has version:
+
+ {boardData && boardData.release.description} +
+You can upgrade to:
+
+ {newVersion.version} + {newVersion["release-info-url"] && ( +
+
+
+ More details on the release can be found at:
+
+
+ + {" "} + {newVersion["release-info-url"]}{" "} + +
+ )}
+
+
+
+ );
+};
diff --git a/plugins/lime-plugin-firmware/src/upgradeCountdown.js b/plugins/lime-plugin-firmware/src/upgradeCountdown.js
new file mode 100644
index 00000000..491e93a4
--- /dev/null
+++ b/plugins/lime-plugin-firmware/src/upgradeCountdown.js
@@ -0,0 +1,31 @@
+import { Trans } from "@lingui/macro";
+import { route } from "preact-router";
+import { useEffect, useState } from "preact/hooks";
+
+export const SafeUpgradeCountdown = ({ counter }) => {
+ const [_counter, setcounter] = useState(counter);
+
+ useEffect(() => {
+ const interval = setInterval(() => setcounter(_counter - 1), 1000);
+ return () => {
+ clearInterval(interval);
+ };
+ }, [_counter, setcounter]);
+
+ return (
+ +
+ A new firmware version has been released
+
+ + {boardData && boardData.release.description} +
+
+ {newVersion.version} + {newVersion["release-info-url"] && ( +
+
+ + {" "} + {newVersion["release-info-url"]}{" "} + +
+
+
+
+
+ );
+};
diff --git a/plugins/lime-plugin-firmware/src/upgradePage/style.less b/plugins/lime-plugin-firmware/src/upgradePage/style.less
new file mode 100644
index 00000000..16bc4df2
--- /dev/null
+++ b/plugins/lime-plugin-firmware/src/upgradePage/style.less
@@ -0,0 +1,27 @@
+.note {
+ padding: 0.5em;
+ margin-bottom: 1em;
+}
+
+.notePositive {
+ background-color: #389256;
+ color: #FFF;
+};
+
+.noteWarning {
+ background-color: #f7a336;
+};
+
+.noteError {
+ background-color: #923838;
+ color: #FFF;
+}
+
+.fileDescription {
+ padding-bottom: 1em;
+}
+
+.upgradeForm {
+ display:flex;
+ flex-direction: column;
+}
diff --git a/plugins/lime-plugin-firmware/src/upgradePage/upgradePage.js b/plugins/lime-plugin-firmware/src/upgradePage/upgradePage.js
new file mode 100644
index 00000000..48691a4f
--- /dev/null
+++ b/plugins/lime-plugin-firmware/src/upgradePage/upgradePage.js
@@ -0,0 +1,293 @@
+import { Trans } from "@lingui/macro";
+import path from "path";
+import { useEffect, useState } from "preact/hooks";
+import { useForm } from "react-hook-form";
+
+import Loading from "components/loading";
+
+import { upgradeFirmware, uploadFile } from "../firmwareApi";
+import {
+ useDownloadRelease,
+ useDownloadStatus,
+ useNewVersion,
+ useUpgradeFirwmare,
+ useUpgradeInfo,
+} from "../firmwareQueries";
+import style from "./style.less";
+
+export const SafeUpgradeBadge = () => {
+ const { isLoading, data: upgradeInfo } = useUpgradeInfo();
+ if (isLoading) return;
+
+ const isAvailable = upgradeInfo["is_upgrade_confirm_supported"];
+ return (
+
+
+ Cofirm upgrade before {_counter} seconds or it will be
+ reverted
+
+
+
+
+ {isAvailable === true && (
+
+ );
+};
+
+const UpgradeFromRelease = ({ onUpgrading, onSwitch }) => {
+ const [pollingInterval, setPollingInterval] = useState(null);
+ const { data: newVersion } = useNewVersion();
+ const versionName = newVersion && newVersion.version;
+ const { data: downloadStatus } = useDownloadStatus({
+ refetchInterval: pollingInterval,
+ enabled: !!versionName,
+ });
+
+ const { mutate: downloadRelease, isLoading: submittingDownload } =
+ useDownloadRelease();
+ const { mutateAsync: upgradeFirmware, isLoading: submittingUpgrade } =
+ useUpgradeFirwmare();
+ const filePath = downloadStatus && downloadStatus.fw_path;
+ const status = downloadStatus && downloadStatus.download_status;
+
+ useEffect(() => {
+ if (
+ downloadStatus &&
+ downloadStatus.download_status === "downloading"
+ ) {
+ setPollingInterval(1000);
+ } else {
+ setPollingInterval(null);
+ }
+ }, [downloadStatus]);
+
+ function onDownload() {
+ downloadRelease();
+ }
+
+ async function onUpgrade() {
+ upgradeFirmware(filePath).then(onUpgrading);
+ }
+
+ if (!versionName) return;
+
+ return (
+
+
+ This device supports secure rollback to previous version
+ if something goes wrong
+
+
+ )}
+ {isAvailable === false && (
+
+
+ This device does not support secure rollback to previous
+ version if something goes wrong
+
+
+ )}
+
+
+
+
+
+
+ );
+};
+
+export const UpgradeFromFile = ({ onUpgrading, onSwitch }) => {
+ const { data: newVersion } = useNewVersion();
+ const [invalidFirmwareError, setinvalidFirmwareError] = useState(false);
+ const {
+ register,
+ handleSubmit,
+ watch,
+ formState: { errors, isSubmitting },
+ } = useForm();
+ const file = watch("file");
+
+ function onUpgrade(data) {
+ setinvalidFirmwareError(false);
+ const file = data.file[0];
+ return uploadFile(file)
+ .then((filepath) => upgradeFirmware(filepath))
+ .then(() => onUpgrading())
+ .catch((error) => {
+ switch (error) {
+ case "Invalid firmware":
+ setinvalidFirmwareError(true);
+ break;
+ default:
+ throw new Error(error);
+ }
+ });
+ }
+
+ function isValidExtname(value) {
+ const extname = path.extname(value[0].name);
+ return extname === ".sh" || extname === ".bin";
+ }
+
+ return (
+
+ Upgrade to lastest firmware version
+
+
+ {versionName} is now available 🎉
+
+ + SPAM - {JSON.stringify(newVersion)} -{" "} + {JSON.stringify(downloadStatus)} +
+ {status === "not-initiated" && ( + + )} + {(submittingDownload || submittingUpgrade) &&
+
+ )}
+ {status === "download-failed" && (
+
+ Downloading
+
+
+
+
+ )}
+ {status === "downloaded" && (
+
+ )}
+ {newVersion["release-info-url"] && (
+
+ The download failed
+
+
+
+ More info at:
+
+ {" "}
+ {newVersion["release-info-url"]}{" "}
+
+
+ )}
+
+
+
+
+
+
+ {isSubmitting && (
+
+ );
+};
+
+export const UpgradePage = ({ onUpgrading }) => {
+ const [fwSource, setfwSource] = useState();
+ const { data: newVersion, isLoading } = useNewVersion();
+
+ useEffect(() => {
+ const defaultSrc =
+ newVersion && newVersion.version ? "fromRelease" : "fromFile";
+ // @ts-ignore
+ setfwSource(defaultSrc);
+ }, [newVersion]);
+
+ const switchTo = (fwSource) => (e) => {
+ e.preventDefault();
+ setfwSource(fwSource);
+ };
+
+ if (isLoading) {
+ return (
+
+
+ Upload firmware image from your device
+
+
+
+ {isSubmitting && (
+
+
+ )}
+ {invalidFirmwareError && (
+
+
+ The selected image is not valid for the target device
+
+
+ )}
+ {newVersion && newVersion.version && (
+
+ )}
+
+
+ );
+ }
+ if (fwSource === "fromRelease") {
+ return (
+
+
+
+
+ {upgradeConfirmAvailable && (
+
+
+
+ When reloading the app you will be asked to confirm the
+ upgrade, otherwise it will be reverted
+
+
+
+ )}
+
+);
+export const UpgradeProgress = ({ elapsedTime, totalTime }) => {
+ const remainingTime = totalTime - elapsedTime;
+ const progress = (elapsedTime / totalTime) * 100;
+ return (
+
+ The upgrade should be done
+
+
+ {upgradeConfirmAvailable && (
+
+
+
+
+
+
+ Please wait patiently for {remainingTime} seconds and do not
+ disconnect the device.
+
+
+
+ );
+};
+
+export const UpgradingPage = ({ upgradeConfirmAvailable }) => {
+ const totalTime = 180;
+ const [elapsedTime, setElapsedTime] = useState(0);
+
+ useEffect(() => {
+ const id = setInterval(
+ () => setElapsedTime((elapsedTime) => elapsedTime + 1),
+ 1000
+ );
+ return () => {
+ clearInterval(id);
+ };
+ }, [elapsedTime, setElapsedTime]);
+
+ function onReload() {
+ // @ts-ignore
+ window.location = window.origin;
+ }
+
+ if (elapsedTime < totalTime) {
+ return (
+
+ The firmware is being upgraded...
+
+
+
+
+
+ );
+};
+
+const mapStateToProps = (state) => ({
+ configuration: state.groundrouting.configuration,
+ loading: state.groundrouting.loading,
+});
+
+const mapDispatchToProps = (dispatch) => ({
+ getGroundRouting: bindActionCreators(getGroundRouting, dispatch),
+});
+
+export default connect(mapStateToProps, mapDispatchToProps)(Page);
diff --git a/plugins/lime-plugin-ground-routing/src/groundRoutingReducer.js b/plugins/lime-plugin-ground-routing/src/groundRoutingReducer.js
new file mode 100644
index 00000000..67cb8a88
--- /dev/null
+++ b/plugins/lime-plugin-ground-routing/src/groundRoutingReducer.js
@@ -0,0 +1,38 @@
+import {
+ GROUNDROUTING_GET,
+ GROUNDROUTING_GET_ERROR,
+ GROUNDROUTING_GET_SUCCESS,
+ GROUNDROUTING_SET,
+ GROUNDROUTING_SET_ERROR,
+} from "./groundRoutingConstants";
+
+export const initialState = {
+ configuration: null,
+ loading: false,
+ error: false,
+};
+
+export const reducer = (state = initialState, { type, payload }) => {
+ switch (type) {
+ case GROUNDROUTING_GET:
+ return Object.assign({}, state, { loading: true });
+
+ case GROUNDROUTING_GET_ERROR:
+ return Object.assign({}, state, { loading: false, error: true });
+
+ case GROUNDROUTING_GET_SUCCESS:
+ return Object.assign({}, state, {
+ loading: false,
+ configuration: payload.config,
+ });
+
+ case GROUNDROUTING_SET_ERROR:
+ return Object.assign({}, state, { loading: false, error: true });
+
+ case GROUNDROUTING_SET:
+ return Object.assign({}, state, { loading: true });
+
+ default:
+ return state;
+ }
+};
diff --git a/plugins/lime-plugin-align/test/epics.spec.js b/plugins/lime-plugin-ground-routing/src/groundRoutingSelectors.js
similarity index 100%
rename from plugins/lime-plugin-align/test/epics.spec.js
rename to plugins/lime-plugin-ground-routing/src/groundRoutingSelectors.js
diff --git a/plugins/lime-plugin-ground-routing/src/style.less b/plugins/lime-plugin-ground-routing/src/style.less
new file mode 100644
index 00000000..2304c27b
--- /dev/null
+++ b/plugins/lime-plugin-ground-routing/src/style.less
@@ -0,0 +1,4 @@
+.groundRouting {
+ width: 100%;
+ height: 50vh;
+}
\ No newline at end of file
diff --git a/plugins/lime-plugin-locate/index.js b/plugins/lime-plugin-locate/index.js
deleted file mode 100755
index 881b6023..00000000
--- a/plugins/lime-plugin-locate/index.js
+++ /dev/null
@@ -1,19 +0,0 @@
-import epics from './src/locateEpics';
-import { reducer } from './src/locateReducer';
-import * as selector from './src/locateSelectors';
-import * as constants from './src/locateConstants';
-import Locate from './src/locatePage';
-import { LocateMenu } from './src/locateMenu';
-
-export default {
- name: 'Locate',
- page: Locate,
- menu: LocateMenu,
- store: {
- name: 'locate',
- epics,
- reducer,
- selector,
- constants
- }
-};
diff --git a/plugins/lime-plugin-locate/index.ts b/plugins/lime-plugin-locate/index.ts
new file mode 100755
index 00000000..fc2045db
--- /dev/null
+++ b/plugins/lime-plugin-locate/index.ts
@@ -0,0 +1,8 @@
+import { LocateMenu } from "./src/locateMenu";
+import Locate from "./src/locatePage";
+
+export default {
+ name: "Locate",
+ page: Locate,
+ menu: LocateMenu,
+} as LimePlugin;
diff --git a/plugins/lime-plugin-locate/locate.stories.js b/plugins/lime-plugin-locate/locate.stories.js
new file mode 100644
index 00000000..550dd5fe
--- /dev/null
+++ b/plugins/lime-plugin-locate/locate.stories.js
@@ -0,0 +1,948 @@
+import { action } from "@storybook/addon-actions";
+
+import { LocatePage } from "./src/locatePage";
+
+export default {
+ title: "Containers/Map",
+ component: LocatePage,
+};
+
+const actions = {
+ loadLocation: action("loadLocation"),
+ loadLocationLinks: action("loadLocationLinks"),
+};
+
+export const nodeAndCommunityNotLocated = () => (
+
+ Ground Routing configuration
+
+
+ {loading
+ ? "Loading..."
+ : JSON.stringify(configuration, null, " ")}
+
+
+ ${I18n.t('Station')} ${this.props.stationHostname}
- - `) - .openOn(map); - this.setState({ popup }); - - const marker = L.marker([this.props.stationLocation.lat, this.props.stationLocation.lon],{ draggable: false }) - .addTo(map) - .on('click', (x) => map.setView(x.target._latlng)) - .bindPopup(popup); - this.setState({ marker }); - } - - isLoaded(exist) { - if (exist === true) { - return ( - - ); - } - return (
Loading...
);
- }
-
- showButton(change) {
- if (change) {
- return ();
- }
- }
-
- rerenderMap(latlon) {
- if (this.state.scriptLoaded === true) {
- if (this.state.scriptCoords === false ) {
- this.state.map.setView([latlon.lat, latlon.lon]);
- }
- this.state.marker.setLatLng([latlon.lat, latlon.lon]);
- return (
-
-
-
-
- );
- }
- }
-
- addCoord() {
- if (this.state.scriptCoords === false ) {
- L = window.L;
- L.control.mapCenterCoord().addTo(this.state.map);
- this.setState({ scriptCoords: true });
- }
- }
-
- toogleEdit() {
- this.setState({ change: !this.state.change });
- this.state.map.closePopup();
- let pointer = document.getElementsByClassName('leaflet-control-mapcentercoord-icon');
- if (pointer.length > 0) {
- this.setState({ buttonText: (this.state.change)? 'Close edit mode' : 'Edit location' });
- this.state.popup.setContent(`${I18n.t('Station')} ${this.props.stationHostname}
- - `); - pointer[0].style.opacity = (this.state.change)? 1 : 0; - } - } - - constructor(props){ - super(props); - this.state = { - scriptLoaded: false, - scriptCoords: false, - scriptError: false, - buttonText: 'Edit location', - change: false - }; - this.handleScriptCreate = this.handleScriptCreate.bind(this); - this.handleScriptError = this.handleScriptError.bind(this); - this.handleScriptLoad = this.handleScriptLoad.bind(this); - this.updatePosition = this.updatePosition.bind(this); - this.toogleEdit = this.toogleEdit.bind(this); - this.addCoord = this.addCoord.bind(this); - - window.toggleEdit = this.toogleEdit; - } - - componentWillMount() { - this.props.loadLocation(); - this.requestCurrentPosition(); - } - - render({ user }, { time, count }) { - return ( -
-
-
-
-
- {this.isLoaded(this.state.scriptLoaded)}
- {this.rerenderMap(this.props.stationLocation)}
- {this.showButton(this.state.change)}
-
- );
- }
-}
-
-const mapStateToProps = (state) => ({
- stationLocation: getLocation(state),
- userLocation: getUserLocation(state),
- stationHostname: getSelectedHost(state)
-});
-
-const mapDispatchToProps = (dispatch) => ({
- loadLocation: bindActionCreators(loadLocation, dispatch),
- changeLocation: bindActionCreators(changeLocation, dispatch),
- setUserLocation: bindActionCreators(setUserLocation, dispatch)
-});
-
-export default connect(mapStateToProps, mapDispatchToProps)(Locate);
\ No newline at end of file
diff --git a/plugins/lime-plugin-locate/src/locatePage.tsx b/plugins/lime-plugin-locate/src/locatePage.tsx
new file mode 100644
index 00000000..cc65c67f
--- /dev/null
+++ b/plugins/lime-plugin-locate/src/locatePage.tsx
@@ -0,0 +1,239 @@
+import { Trans } from "@lingui/macro";
+import L, { LatLngExpression, icon } from "leaflet";
+import { useEffect, useRef, useState } from "preact/hooks";
+import { LayersControl, MapContainer, Marker, TileLayer } from "react-leaflet";
+
+import { Loading } from "components/loading";
+
+import {
+ useChangeLocation,
+ useLoadLeaflet,
+ useLocation,
+ useNodesandlinks,
+} from "plugins/lime-plugin-locate/src/locateQueries";
+
+import { useBoardData } from "utils/queries";
+
+import { getCommunityGeoJSON } from "./communityGeoJSON";
+import { homeIcon } from "./leafletUtils";
+import style from "./style.less";
+
+const openStreetMapTileString = "http://{s}.tile.osm.org/{z}/{x}/{y}.png";
+const openStreetMapAttribution =
+ '© OpenStreetMap contributors';
+
+const gmSatellite = "https://{s}.google.com/vt/lyrs=s&x={x}&y={y}&z={z}";
+const gmHybrid = "https://{s}.google.com/vt/lyrs=s,h&x={x}&y={y}&z={z}";
+const gmSubdomains = ["mt0", "mt1", "mt2", "mt3"];
+
+function getCommunityLayer(nodeHostname, stationLat, stationLon, nodesData) {
+ /** Create a Leaflet layer with community nodes and links to be added to the map*/
+ if (nodesData[nodeHostname]) {
+ nodesData[nodeHostname].data.coordinates = {
+ lat: stationLat,
+ lon: stationLon,
+ };
+ }
+ // Get community GeoJSON, filter out nodes in same location as station host.
+ const geoJSON = getCommunityGeoJSON(nodesData, [stationLon, stationLat]);
+ return L.geoJSON(geoJSON, {
+ onEachFeature: (feature, layer) => {
+ if (feature.properties && feature.properties.name) {
+ layer.bindTooltip(feature.properties.name).openTooltip();
+ }
+ },
+ });
+}
+
+export const LocatePage = () => {
+ const { data: boardData } = useBoardData();
+ const {
+ isError: isAssetError,
+ isFetchedAfterMount: assetsLoaded,
+ isLoading: isLoadingAssets,
+ } = useLoadLeaflet({
+ refetchOnWindowFocus: false,
+ });
+
+ const {
+ data: nodeLocation,
+ isLoading: isLoadingLocation,
+ isFetched: locationLoaded,
+ } = useLocation({
+ enabled: assetsLoaded,
+ });
+
+ const { data: nodesData } = useNodesandlinks({
+ enabled: locationLoaded,
+ });
+
+ const { mutate: changeLocation, isLoading: submitting } = useChangeLocation(
+ {
+ onSettled: () => {
+ toogleEdition();
+ },
+ }
+ );
+
+ const loading = isLoadingLocation || isLoadingAssets;
+ const isCommunityLocation = nodeLocation.default;
+ const stationLat =
+ nodeLocation.location.lat !== "FIXME"
+ ? nodeLocation.location.lat
+ : null;
+ const stationLon =
+ nodeLocation.location.lon !== "FIXME"
+ ? nodeLocation.location.lon
+ : null;
+ const hasLocation = stationLat && !isCommunityLocation;
+
+ const [editting, setEditting] = useState(false);
+ const [nodeMarker, setNodeMarker] = useState
+ Cannot load map, check your internet connection
+
+ );
+ }
+
+ return (
+ <>
+ {(!isReady() || submitting) && (
+
+
+ )}
+ {isReady() && (
+
+ {editting && (
+
+ )}
+ {!editting && (
+
+ )}
+
+
+
+ )}
+
+ );
+};
+
+export default LocatePage;
diff --git a/plugins/lime-plugin-locate/src/locateQueries.tsx b/plugins/lime-plugin-locate/src/locateQueries.tsx
new file mode 100644
index 00000000..45c1f399
--- /dev/null
+++ b/plugins/lime-plugin-locate/src/locateQueries.tsx
@@ -0,0 +1,74 @@
+import { useMutation, useQuery } from "@tanstack/react-query";
+
+import { loadLeafLet } from "plugins/lime-plugin-locate/src/leafletUtils";
+import {
+ changeLocation,
+ getLocation,
+ getNodesandlinks,
+} from "plugins/lime-plugin-locate/src/locateApi";
+
+import queryCache from "utils/queryCache";
+
+export interface INodeLocation {
+ location: {
+ lon: string;
+ lat: string;
+ };
+ default: boolean;
+}
+
+export function useLocation(params) {
+ return useQuery
- {this.isGateway(this.props.gateway, this.props.station.hostname)}
- {this.props.station.bandwidth} Mbps / {I18n.t('Packet loss')} {this.props.station.loss}%
- -
- );
- }
-}
+ // colorScale.setConfig({
+ // outputStart: 1,
+ // outputEnd: 100,
+ // inputStart: 0,
+ // inputEnd: settings.acceptable_loss
+ // });
+ const stationName = station.hostname === "" ? station.ip : station.hostname;
+
+ const loadingMetrics = metricsIsLoading;
+
+ return (
+ - {this.props.station.bandwidth} Mbps / {I18n.t('Packet loss')} {this.props.station.loss}%
- -
+
+
+ {gateway === true
+ ? `${stationName} (Gateway)`
+ : stationName}
+ {(metrics !== undefined &&
+ Number(metrics.bandwidth || "0") === 0 &&
+ metrics.loss) ||
+ isError ? (
+
+ {" "}
+ (Error )
+
+ ) : (
+ false
+ )}
+
+
+ + {loadingMetrics ? ( +
+ );
+};
-export default Box;
\ No newline at end of file
+export default Box;
diff --git a/plugins/lime-plugin-metrics/src/components/internetStatus.js b/plugins/lime-plugin-metrics/src/components/internetStatus.js
new file mode 100644
index 00000000..b044a6dd
--- /dev/null
+++ b/plugins/lime-plugin-metrics/src/components/internetStatus.js
@@ -0,0 +1,45 @@
+import { Trans } from "@lingui/macro";
+
+import { Box } from "components/box";
+
+export const InternetStatus = ({ isLoading, internet }) => {
+ return isLoading ? (
+
+ ) : (
+ + + {loadingMetrics ? ( +
+ {metrics.bandwidth} Mbps /{" "}
+
+ Packet loss
+ {" "}
+ {metrics.loss}%
+ +
+ ) : (
+ false
+ )}
+ + +
+
+
+ ) : (
+ +
+
+
+
+
+ + +
+ );
+};
diff --git a/plugins/lime-plugin-metrics/src/metricsActions.js b/plugins/lime-plugin-metrics/src/metricsActions.js
deleted file mode 100644
index e4b10c48..00000000
--- a/plugins/lime-plugin-metrics/src/metricsActions.js
+++ /dev/null
@@ -1,38 +0,0 @@
-import { push } from 'preact-router-redux';
-
-import {
- LOAD_METRICS,
- LOAD_METRICS_ALL
-} from './metricsConstants';
-
-import {
- GET_INTERNET_STATUS
-} from '../../lime-plugin-rx/src/rxConstants';
-
-export const getMetrics = ( ) => (dispatch) => {
- dispatch({
- type: LOAD_METRICS
- });
- dispatch({
- type: GET_INTERNET_STATUS
- });
-};
-
-export const getMetricsAll = ( ) => (dispatch) => {
- dispatch({
- type: LOAD_METRICS_ALL
- });
-};
-
-export const getMetricsGateway = ( hostname ) => (dispatch) => {
- dispatch({
- type: LOAD_METRICS
- });
- dispatch({
- type: GET_INTERNET_STATUS
- });
-};
-
-export const changeNode = (hostname) => (dispatch) => {
- dispatch(push('changeNode/'+hostname));
-};
\ No newline at end of file
diff --git a/plugins/lime-plugin-metrics/src/metricsApi.js b/plugins/lime-plugin-metrics/src/metricsApi.js
index e87a9294..39a06809 100644
--- a/plugins/lime-plugin-metrics/src/metricsApi.js
+++ b/plugins/lime-plugin-metrics/src/metricsApi.js
@@ -1,15 +1,12 @@
-export const getMetrics = (api, sid,params) => api.call(sid, 'lime-metrics', 'get_metrics', params)
- .map(result => Object.assign({}, result, { hostname: params.target })
- );
+import api from "utils/uhttpd.service";
-export const getAllMetrics = (api, sid, params) => params.targets.map(x => getMetrics(api,sid, { target: x }));
+export const getMetrics = (ip) => {
+ console.log("getting metrics for ", ip);
+ return api.call("lime-metrics", "get_metrics", { target: ip });
+};
-export const getGateway = (api, sid) => api.call(sid, 'lime-metrics', 'get_gateway', {})
- .map(result => result);
+export const getGateway = () =>
+ api.call("lime-metrics", "get_gateway", {}).then((res) => res.gateway);
-export const getPath = (api, sid, params) => api.call(sid, 'lime-metrics', 'get_path', params)
- .map(data => Object.keys(data.path).map((key, index) => data.path[key]).reduce((x,y) => x.concat(y), []));
-
-
-export const getLastKnownPath = (api, sid, params) => api.call(sid, 'lime-metrics', 'get_last_internet_path', params)
- .map(data => Object.keys(data.path).map((key, index) => data.path[key]).reduce((x,y) => x.concat(y), []));
\ No newline at end of file
+export const getPath = () =>
+ api.call("lime-metrics", "get_path", {}).then((res) => res.path);
diff --git a/plugins/lime-plugin-metrics/src/metricsConstants.js b/plugins/lime-plugin-metrics/src/metricsConstants.js
deleted file mode 100644
index 71160966..00000000
--- a/plugins/lime-plugin-metrics/src/metricsConstants.js
+++ /dev/null
@@ -1,15 +0,0 @@
-export const LOAD_GATEWAY = 'metrics/LOAD_GATEWAY';
-export const LOAD_GATEWAY_SUCCESS = 'metrics/LOAD_GATEWAY_SUCCESS';
-export const LOAD_GATEWAY_NOT_FOUND = 'metrics/LOAD_GATEWAY_NOT_FOUND';
-export const LOAD_GATEWAY_ERROR = 'metrics/LOAD_GATEWAY_ERROR';
-export const LOAD_METRICS = 'metrics/LOAD_METRICS';
-export const LOAD_ALL_METRICS = 'metrics/LOAD_ALL_METRICS';
-export const LOAD_METRICS_SUCCESS = 'metrics/LOAD_METRICS_SUCCESS';
-export const LOAD_METRICS_ERROR = 'metrics/LOAD_METRICS_ERROR';
-export const LOAD_PATH = 'metrics/LOAD_PATH';
-export const LOAD_PATH_SUCCESS = 'metrics/LOAD_PATH_SUCCESS';
-export const LOAD_PATH_ERROR = 'metrics/LOAD_PATH_ERROR';
-export const LOAD_PATH_NOT_FOUND = 'metrics/LOAD_PATH_NOT_FOUND';
-export const LOAD_METRICS_ALL = 'metrics/LOAD_METRICS_ALL';
-export const LOAD_METRICS_GATEWAY = 'metrics/LOAD_METRICS_GATEWAY';
-export const LOAD_METRICS_GATEWAY_SUCCESS = 'metrics/LOAD_METRICS_GATEWAY_SUCCESS';
\ No newline at end of file
diff --git a/plugins/lime-plugin-metrics/src/metricsEpics.js b/plugins/lime-plugin-metrics/src/metricsEpics.js
index f37cf8e3..e69de29b 100644
--- a/plugins/lime-plugin-metrics/src/metricsEpics.js
+++ b/plugins/lime-plugin-metrics/src/metricsEpics.js
@@ -1,65 +0,0 @@
-import { getPath, getGateway, getMetrics, getLastKnownPath } from './metricsApi';
-import {
- LOAD_GATEWAY_SUCCESS,
- LOAD_GATEWAY_ERROR,
- LOAD_GATEWAY_NOT_FOUND,
- LOAD_PATH_SUCCESS,
- LOAD_PATH_ERROR,
- LOAD_PATH_NOT_FOUND,
- LOAD_METRICS,
- LOAD_METRICS_SUCCESS,
- LOAD_METRICS_GATEWAY_SUCCESS,
- LOAD_METRICS_ALL,
- LOAD_METRICS_GATEWAY
-} from './metricsConstants';
-
-import { Observable } from 'rxjs/Observable';
-import 'rxjs/add/operator/map';
-import 'rxjs/add/operator/catch';
-import 'rxjs/add/operator/concatMap';
-import 'rxjs/add/operator/concatAll';
-import 'rxjs/add/operator/mergeMap';
-
-const loadGateway = ( action$, store, { wsAPI }) =>
- action$.ofType(LOAD_METRICS)
- .mergeMap(() => getGateway(wsAPI,store.getState().meta.sid,))
- .map(payload => {
- if (!payload.error) return { type: LOAD_GATEWAY_SUCCESS, payload };
- return { type: LOAD_GATEWAY_NOT_FOUND, payload };
- })
- .catch([({ type: LOAD_GATEWAY_ERROR })]);
-
-const loadPath = ( action$, store, { wsAPI }) =>
- action$.ofType(LOAD_GATEWAY_SUCCESS)
- .mergeMap((action) => getPath(wsAPI,store.getState().meta.sid,{ target: store.getState().metrics.gateway }))
- .map(payload => {
- if (!payload.error) return { type: LOAD_PATH_SUCCESS, payload };
- return { type: LOAD_PATH_NOT_FOUND, payload };
- })
- .catch([({ type: LOAD_PATH_ERROR })]);
-
-const loadLastPath = ( action$, store, { wsAPI }) =>
- action$.ofType(LOAD_GATEWAY_NOT_FOUND)
- .mergeMap((action) => getLastKnownPath(wsAPI,store.getState().meta.sid,{}))
- .map(payload => {
- if (!payload.error) return { type: LOAD_PATH_SUCCESS, payload };
- return { type: LOAD_PATH_NOT_FOUND, payload };
- })
- .catch([({ type: LOAD_PATH_ERROR })]);
-
-const loadMetrics = ( action$, store, { wsAPI }) =>
- action$.ofType(LOAD_METRICS_ALL)
- .map(action => store.getState().metrics.metrics) // Get array of paths
- .map(paths => Observable.from(paths) // Change array of paths for array of observables
- .concatMap((path) => getMetrics(wsAPI,store.getState().meta.sid,{ target: path.hostname })))
- .concatAll() // Consume one observable at a time
- .map(payload => ({ type: LOAD_METRICS_SUCCESS, payload })); // Output one result for each observable/promise consumed
-
-const loadGatewayMetrics = ( action$, store, { wsAPI }) =>
- action$.ofType(...[LOAD_PATH_SUCCESS,LOAD_METRICS_GATEWAY])
- .map(action => action.payload)
- .mergeMap(payload => getMetrics(wsAPI,store.getState().meta.sid,{ target: store.getState().metrics.gateway })
- .map(payload => ({ type: LOAD_METRICS_GATEWAY_SUCCESS, payload })));
-
-
-export default { loadGateway, loadPath, loadMetrics, loadLastPath, loadGatewayMetrics };
\ No newline at end of file
diff --git a/plugins/lime-plugin-metrics/src/metricsMenu.js b/plugins/lime-plugin-metrics/src/metricsMenu.js
index d066249e..dbbe909f 100644
--- a/plugins/lime-plugin-metrics/src/metricsMenu.js
+++ b/plugins/lime-plugin-metrics/src/metricsMenu.js
@@ -1,7 +1,12 @@
-import { h } from 'preact';
+import { Trans } from "@lingui/macro";
-import I18n from 'i18n-js';
+import { EqualizerIcon } from "components/icons/teenny/equalizer";
export const MetricsMenu = () => (
- {I18n.t('Metrics')}
-);
\ No newline at end of file
+
+ + + +
-
- - -
- );
- }
- return (
-
- );
- }
-
- showLoading(loading) {
- if (!loading) {
- return;
- }
- return (
- - - -
-
- );
- }
-
- showInternetStatus(loading,node) {
- if (!loading) {
- return (
- Error: {errorMessages[error.msg]}
); - } - return; - } - - isGateway(hostname, gateway) { - return (hostname === gateway); - } - - wrapperChangeNode (station) { - return () => { - this.props.changeNode(station.hostname.split('_')[0]); - }; - } - - - constructor(props) { - super(props); - this.wrapperChangeNode = this.wrapperChangeNode.bind(this); - this.clickGateway = this.clickGateway.bind(this); - } - - componentWillMount() { - this.props.getMetrics(); - colorScale.setConfig({ - outputStart: 1, - outputEnd: 100, - inputStart: 0, - inputEnd: 30 - }); - } - render() { - return ( -
- {this.props.metrics.error.map(x => this.showError(x))}
-
-
- );
- }
-}
-
-
-const mapStateToProps = (state) => ({
- metrics: state.metrics,
- meta: state.meta,
- node: getNodeData(state),
- settings: getSettings(state)
-});
-
-const mapDispatchToProps = (dispatch) => ({
- getMetrics: bindActionCreators(getMetrics,dispatch),
- getMetricsGateway: bindActionCreators(getMetricsGateway,dispatch),
- getMetricsAll: bindActionCreators(getMetricsAll,dispatch),
- changeNode: bindActionCreators(changeNode,dispatch)
-});
-
-export default connect(mapStateToProps, mapDispatchToProps)(Metrics);
diff --git a/plugins/lime-plugin-metrics/src/metricsPage.tsx b/plugins/lime-plugin-metrics/src/metricsPage.tsx
new file mode 100644
index 00000000..8656492b
--- /dev/null
+++ b/plugins/lime-plugin-metrics/src/metricsPage.tsx
@@ -0,0 +1,177 @@
+import { i18n } from "@lingui/core";
+import { Trans, defineMessage } from "@lingui/macro";
+
+import { useBoardData } from "utils/queries";
+import queryCache from "utils/queryCache";
+
+import { useInternetStatus } from "../../lime-plugin-rx/src/rxQueries";
+import MetricsBox from "./components/box";
+import { InternetStatus } from "./components/internetStatus";
+import { ShowPathButton } from "./components/showPathButton";
+import { useAllMetrics, useGateway, usePath } from "./metricsQueries";
+
+const style = {
+ textLoading: {
+ textAlign: "center",
+ display: "block",
+ background: "#3bc1a5",
+ color: "#fff",
+ padding: "5px",
+ borderRadius: "4px",
+ fontWeight: "bold",
+ },
+ textError: {
+ textAlign: "center",
+ display: "block",
+ background: "#d55206",
+ color: "#fff",
+ padding: "5px",
+ borderRadius: "4px",
+ fontWeight: "bold",
+ },
+ box: {
+ margin: "3px",
+ padding: "10px",
+ fontSize: "1.4em",
+ background: "#f5f5f5",
+ textAalign: "center",
+ overflow: "hidden",
+ height: "auto",
+ },
+};
+
+export const Metrics = () => {
+ const { data: boardData } = useBoardData();
+
+ const {
+ data: internet,
+ isLoading: isInternetLoading,
+ refetch: getInternetStatus,
+ } = useInternetStatus();
+
+ const internetError =
+ !internet?.IPv4?.working ?? !internet?.IPv6?.working ?? true;
+
+ const {
+ data: path,
+ isFetching: pathIsLoading,
+ refetch: getPath,
+ } = usePath({
+ refetchOnWindowFocus: false,
+ enabled: false,
+ });
+
+ const { refetch: getAllMetrics, isFetching: metricsIsLoading } =
+ useAllMetrics(path?.map((station) => station.ip) ?? [], {
+ refetchOnWindowFocus: false,
+ enabled: false,
+ initialData: [],
+ });
+
+ const {
+ data: gateway,
+ isFetching: gatewayIsLoading,
+ isError: gatewayNotFound,
+ refetch: getMetricsGateway,
+ } = useGateway({
+ refetchOnWindowFocus: false,
+ enabled: true,
+ onSuccess: getPath,
+ onError: getPath,
+ });
+
+ function showLoading(loading) {
+ if (!loading) {
+ return;
+ }
+
+ let msg = "";
+ if (gatewayIsLoading) {
+ // @ts-ignore
+ msg = defineMessage({
+ message: "Searching gateway",
+ });
+ } else if (pathIsLoading) {
+ // @ts-ignore
+ msg = defineMessage({
+ message: "Calculating network path",
+ });
+ } else if (metricsIsLoading) {
+ // @ts-ignore
+ msg = defineMessage({
+ message: "Measuring links",
+ });
+ } else if (gatewayNotFound || internetError) {
+ // @ts-ignore
+ msg = defineMessage({
+ message: "Load last known Internet path",
+ });
+ }
+
+ // @ts-ignore
+ return {I18n.t('From')+' '+this.props.meta.selectedHost}
- {this.props.metrics.metrics.map(station => (
- {I18n.t('To Internet')}
- {this.showInternetStatus(this.props.metrics.loading, this.props.node)}
- {this.showLoading(this.props.metrics.loading)}
- {this.showButton(this.props.metrics.loading)}-
{i18n._(msg)}
; + } + + function showError() { + if (gatewayNotFound || internetError) { + return ( + // @ts-ignore +
+
+ {isLoading ? showLoading(isLoading) : showError()}
+
+
+ );
+};
+
+export default Metrics;
diff --git a/plugins/lime-plugin-metrics/src/metricsQueries.js b/plugins/lime-plugin-metrics/src/metricsQueries.js
new file mode 100644
index 00000000..4700871f
--- /dev/null
+++ b/plugins/lime-plugin-metrics/src/metricsQueries.js
@@ -0,0 +1,44 @@
+import { useQuery } from "@tanstack/react-query";
+
+import queryCache from "utils/queryCache";
+
+import { getGateway, getMetrics, getPath } from "./metricsApi";
+
+export function useMetrics(ip, params) {
+ return useQuery(["lime-metrics", "get_metrics", ip], () => getMetrics(ip), {
+ retry: false,
+ ...params,
+ });
+}
+
+export const getAllMetrics = async (ips) => {
+ const metrics = [];
+ for (const ip of ips) {
+ const metric = await queryCache.fetchQuery([
+ "lime-metrics",
+ "get_metrics",
+ ip,
+ ]);
+ metrics.push({ ip: metric });
+ }
+ return metrics;
+};
+
+export function useAllMetrics(ips, params) {
+ return useQuery(
+ ["lime-metrics", "get_metrics", ips],
+ (query) => getAllMetrics(query.queryKey[2]),
+ {
+ retry: false,
+ ...params,
+ }
+ );
+}
+
+export function useGateway(params) {
+ return useQuery(["lime-metrics", "get_gateway"], getGateway, params);
+}
+
+export function usePath(params) {
+ return useQuery(["lime-metrics", "get_path"], getPath, params);
+}
diff --git a/plugins/lime-plugin-metrics/src/metricsReducer.js b/plugins/lime-plugin-metrics/src/metricsReducer.js
deleted file mode 100644
index e6fe242b..00000000
--- a/plugins/lime-plugin-metrics/src/metricsReducer.js
+++ /dev/null
@@ -1,77 +0,0 @@
-import {
- LOAD_METRICS,
- LOAD_METRICS_SUCCESS,
- LOAD_PATH,
- LOAD_PATH_SUCCESS,
- LOAD_PATH_NOT_FOUND,
- LOAD_GATEWAY_SUCCESS,
- LOAD_GATEWAY_NOT_FOUND,
- LOAD_METRICS_GATEWAY,
- LOAD_METRICS_GATEWAY_SUCCESS,
- LOAD_METRICS_ALL
-} from './metricsConstants';
-
-
-const initialState = {
- metrics: [],
- error: [],
- loading: false,
- status: ''
-};
-
-const getMetrics = (data, payload) => data.map(x => {
- if (x.bandwidth < payload.bandwidth) { x.bandwidth = payload.bandwidth; }
- if (x.loss > payload.loss) { x.loss = payload.loss; }
- if (x.hostname !== payload.hostname) { return x; }
- x.loading = false;
- return Object.assign({}, x, payload);
-});
-
-export const reducer = (state = initialState, { type, payload, meta }) => {
- switch (type) {
- case LOAD_METRICS:
- return Object.assign({}, initialState, { loading: true, status: 'metrics_status_gateway' });
- case LOAD_PATH:
- return Object.assign({}, state, { loading: true, metrics: [], status: 'metrics_status_path' });
- case LOAD_GATEWAY_SUCCESS:
- return Object.assign({}, state, { gateway: payload.gateway, status: 'metrics_status_path' });
- case LOAD_GATEWAY_NOT_FOUND:
- return Object.assign({}, state, { error: state.error.concat(payload.error), status: 'load_last_known_internet_path' });
- case LOAD_PATH_SUCCESS:
- return Object.assign({}, state, {
- metrics: payload.map(x => ({ hostname: x, loading: true, error: false })),
- loading: true, status: 'metrics_status_stations'
- });
- case LOAD_PATH_NOT_FOUND:
- return Object.assign({}, state, { error: state.error.concat(payload.error), loading: false, status: '' });
- case LOAD_METRICS_SUCCESS:
- return Object.assign({}, state, {
- metrics: getMetrics(state.metrics, payload),
- loading: getMetrics(state.metrics, payload).filter(x => x.loading === true).length !== 0,
- status: 'metrics_status_stations'
- });
- case LOAD_METRICS_GATEWAY:
- return Object.assign({}, state, {
- metrics: state.metrics.map(x => {
- if (x.hostname !== payload.hostname) { return x; }
- x.loading = true;
- return Object.assign({}, x, payload);
- }),
- loading: true,
- status: 'metrics_status_stations'
- });
- case LOAD_METRICS_GATEWAY_SUCCESS:
- return Object.assign({}, state, {
- metrics: state.metrics.map(x => {
- if (x.hostname !== payload.hostname) { return x; }
- x.loading = false;
- return Object.assign({}, x, payload);
- }),
- loading: false
- });
- case LOAD_METRICS_ALL:
- return Object.assign({}, state, { metrics: state.metrics.map(x => Object.assign({},x, { loading: true })), loading: true });
- default:
- return state;
- }
-};
\ No newline at end of file
diff --git a/plugins/lime-plugin-metrics/src/metricsSelectors.js b/plugins/lime-plugin-metrics/src/metricsSelectors.js
deleted file mode 100644
index 2c088950..00000000
--- a/plugins/lime-plugin-metrics/src/metricsSelectors.js
+++ /dev/null
@@ -1 +0,0 @@
-/*export const getSid = (state) => state.meta.sid;*/
diff --git a/plugins/lime-plugin-network-admin/index.ts b/plugins/lime-plugin-network-admin/index.ts
new file mode 100755
index 00000000..f28c3e61
--- /dev/null
+++ b/plugins/lime-plugin-network-admin/index.ts
@@ -0,0 +1,9 @@
+import { NetAdminMenu } from "./src/netAdminMenu";
+import NetAdmin from "./src/netAdminPage";
+
+export default {
+ name: "NetAdmin",
+ page: NetAdmin,
+ menu: NetAdminMenu,
+ isCommunityProtected: true,
+} as LimePlugin;
diff --git a/plugins/lime-plugin-network-admin/network-admin.stories.js b/plugins/lime-plugin-network-admin/network-admin.stories.js
new file mode 100644
index 00000000..6ff448fc
--- /dev/null
+++ b/plugins/lime-plugin-network-admin/network-admin.stories.js
@@ -0,0 +1,17 @@
+import { action } from "@storybook/addon-actions";
+
+import { NetAdmin } from "./src/netAdminPage";
+
+const submitSharedPassword = action("setSharedPassword");
+
+export default {
+ title: "Containers/Network Configuration screen",
+};
+
+export const ChangeSharedPassword = (args) => (
+
+ From {boardData.hostname}
+
+ {path &&
+ path.map((station, key) => (
+
+ To Internet
+
+ +
+
+
+
+
+
+ );
+};
+
+const NetAdminHOC = () => {
+ const [submitting, setSubmitting] = useState(false);
+ const [success, setSuccess] = useState(false);
+
+ function submitSharedPassword(password) {
+ setSubmitting(true);
+ return api
+ .call("lime-utils-admin", "set_root_password", { password })
+ .then(
+ (result) =>
+ new Promise((res, rej) => {
+ result.status === "ok" ? res() : rej();
+ })
+ )
+ .then(() => setSuccess(true))
+ .finally(() => setSubmitting(false));
+ }
+
+ return (
+
+ Change Shared Password
+
+
+
+
+
+
+
+ {submitting && (
+
+ Setting up new password
+
+ )}
+ {success && (
+
+ Shared Password changed successfully
+
+ )}
+
+
+
+
+ {title}
+ {isLoading &&
+
+ )}
+ {subtitle}
+ {value}
+
+
+ ›
+
+
+ );
+ }
+
+ return (
+
+ Saved} />
+ )}
+ {showError && (
+ Error: Not Saved} />
+ )}
+
+ );
+};
+
+export default ConfigPageLayout;
diff --git a/plugins/lime-plugin-node-admin/src/layouts/index.js b/plugins/lime-plugin-node-admin/src/layouts/index.js
new file mode 100644
index 00000000..1b6b4ecd
--- /dev/null
+++ b/plugins/lime-plugin-node-admin/src/layouts/index.js
@@ -0,0 +1 @@
+export { default as ConfigPageLayout } from "./configPageLayout";
diff --git a/plugins/lime-plugin-node-admin/src/nodeAdminApi.js b/plugins/lime-plugin-node-admin/src/nodeAdminApi.js
new file mode 100644
index 00000000..23b7b1f3
--- /dev/null
+++ b/plugins/lime-plugin-node-admin/src/nodeAdminApi.js
@@ -0,0 +1,21 @@
+import api from "utils/uhttpd.service";
+
+export const changeHostname = (hostname) =>
+ api
+ .call("lime-utils-admin", "set_hostname", { hostname })
+ .then(() => hostname);
+
+export const changeApNamePassword = ({ password, enablePassword }) =>
+ api.call("wireless-service-admin", "set_node_ap", {
+ password,
+ has_password: enablePassword,
+ });
+
+export const getAPsData = () =>
+ api.call("wireless-service", "get_access_points_data", {});
+
+export const getAdminApsData = () =>
+ api.call("wireless-service-admin", "get_access_points_data", {});
+
+export const setupRoamingAP = ({ enabled }) =>
+ api.call("wireless-service-admin", "set_community_ap", { enabled });
diff --git a/plugins/lime-plugin-node-admin/src/nodeAdminMenu.js b/plugins/lime-plugin-node-admin/src/nodeAdminMenu.js
new file mode 100644
index 00000000..6b31215d
--- /dev/null
+++ b/plugins/lime-plugin-node-admin/src/nodeAdminMenu.js
@@ -0,0 +1,14 @@
+import { Trans } from "@lingui/macro";
+
+import { SettingsIcon } from "components/icons/teenny/settings";
+
+const Menu = () => (
+
+
+
+ route(backUrl)}
+ >
+ ❮
+
+ {title}
+{children}
+ {showSuccess && (
+
+
+ );
+};
+
+export default NodeAdmin;
diff --git a/plugins/lime-plugin-node-admin/src/nodeAdminQueries.js b/plugins/lime-plugin-node-admin/src/nodeAdminQueries.js
new file mode 100644
index 00000000..f23a2ab4
--- /dev/null
+++ b/plugins/lime-plugin-node-admin/src/nodeAdminQueries.js
@@ -0,0 +1,46 @@
+import { useMutation, useQuery } from "@tanstack/react-query";
+
+import { setChangesNeedReboot } from "utils/api";
+import queryCache from "utils/queryCache";
+
+import {
+ changeApNamePassword,
+ changeHostname,
+ getAPsData,
+ getAdminApsData,
+ setupRoamingAP,
+} from "./nodeAdminApi";
+
+export const useChangeHostname = () =>
+ useMutation(changeHostname, {
+ onSuccess: () => {
+ setChangesNeedReboot("yes");
+ queryCache.invalidateQueries({ queryKey: ["changes-need-reboot"] });
+ },
+ });
+
+export const useWifiData = () =>
+ useQuery(["lime-utils", "get_wifi_data"], getAPsData);
+
+export const useAdminWifiData = () =>
+ useQuery(["lime-utils-admin", "get_wifi_data"], getAdminApsData);
+
+export const useChangeAPPassword = () =>
+ useMutation(changeApNamePassword, {
+ onSuccess: () => {
+ setChangesNeedReboot("yes");
+ queryCache.invalidateQueries({ queryKey: ["changes-need-reboot"] });
+ queryCache.invalidateQueries(["lime-utils", "get_wifi_data"]);
+ queryCache.invalidateQueries(["lime-utils-admin", "get_wifi_data"]);
+ },
+ });
+
+export const useSetupRoamingAP = () =>
+ useMutation(setupRoamingAP, {
+ onSuccess: () => {
+ setChangesNeedReboot("yes");
+ queryCache.invalidateQueries({ queryKey: ["changes-need-reboot"] });
+ queryCache.invalidateQueries(["lime-utils", "get_wifi_data"]);
+ queryCache.invalidateQueries(["lime-utils-admin", "get_wifi_data"]);
+ },
+ });
diff --git a/plugins/lime-plugin-node-admin/src/screens/hostname.js b/plugins/lime-plugin-node-admin/src/screens/hostname.js
new file mode 100644
index 00000000..c850e4c2
--- /dev/null
+++ b/plugins/lime-plugin-node-admin/src/screens/hostname.js
@@ -0,0 +1,94 @@
+import { Trans } from "@lingui/macro";
+import { useEffect } from "preact/hooks";
+import { useForm } from "react-hook-form";
+
+import Loading from "components/loading";
+
+import { isValidHostname, slugify } from "utils/isValidHostname";
+import { useBoardData } from "utils/queries";
+
+import ConfigPageLayout from "../layouts/configPageLayout";
+import { useChangeHostname } from "../nodeAdminQueries";
+
+const HostnamePage = () => {
+ const { data: boardData, isLoading } = useBoardData();
+ const {
+ register,
+ handleSubmit,
+ reset,
+ setValue,
+ formState: { errors },
+ } = useForm();
+ const {
+ mutate: changeHostname,
+ isLoading: isSubmitting,
+ isSuccess,
+ isError,
+ } = useChangeHostname();
+
+ useEffect(() => {
+ reset({ hostname: boardData && boardData.hostname });
+ }, [boardData, reset]);
+
+ function onSubmit({ hostname }) {
+ changeHostname(hostname);
+ }
+
+ return (
+
+
+
+
+
+ Node Configuration
+
+ -
+
+
+
+ {!isSubmitting && (
+
+ )}
+ {isSubmitting &&
+
+
+ );
+};
+
+export const ConnectionToThePhone = () => {
+ const { data, isFetching, refetch } = useHotspotData();
+ return (
+
+
+ {title}
+ ⟳
+
+ {isFetching ? (
+
+
+
+ ) : (
+ {children}
+ )}
+
+
+ )}
+ {data?.connected === false && (
+
+ Connected
+
+
+ {data.signal}
+ dBm
+
+
+
+ )}
+
+ Not Connected
+
+
+
+ )}
+ {data?.connected === false && (
+
+ Connected
+
+
+
+ )}
+
+ Not Connected
+
+
+
+
+ {!isSubmitting && !waitingRadioReset && (
+
+ )}
+ {(isSubmitting || waitingRadioReset) &&
+
+
+ );
+};
+
+const WaitingRadioResetMessage = () => (
+ -
+
-
+
+ Get an additional cell phone to the one you are + currently using that has a mobile data connection + +
+ -
+
+ With this second cell phone create an access point or + hotspot with this data: + +
+
+
+
+
+ Network Name: {ssid}
+
+
+
+
+ Password: {password}
+
+
+
+
+ Encryption: {encryptionMethod}
+
+
+
+
+);
+
+const SubmitError = ({ error }) => (
+
+ The radio needs to be restarted...
+
+
+ Please stay connected to the wifi network
+
+
+ {error && error === "hotspot ap not found" && (
+
+
+ The hotspot couldn’t be found, please review the
+ instructions above.
+
+
+ )}
+ {error && error === "radio has mesh ifaces" && (
+
+
+ Cannot use Radio 0, it's being used for mesh links
+
+
+ )}
+
+);
+const HotspotPage_ = ({
+ submitError,
+ hotspotData,
+ onSubmit,
+ isSubmitting,
+ waitingRadioReset,
+}) => (
+
+ Cellphone Instructions}
+ >
+
+ {submitError &&
+);
+
+const HotspotPage = () => {
+ const { data: hotspotData, isLoading, refetch } = useHotspotData();
+ const {
+ mutate: toggle,
+ error: submitError,
+ isError,
+ isLoading: isSubmitting,
+ isSuccess,
+ } = useToggleHotspot();
+ const waitingRadioReset = hotspotData?.waitingForRadioReset;
+
+ useEffect(() => {
+ if (waitingRadioReset) {
+ setTimeout(() => {
+ refetch();
+ }, 10000);
+ }
+ }, [waitingRadioReset, refetch]);
+
+ function onSubmit({ enabled }) {
+ return toggle(enabled);
+ }
+
+ return (
+
+
+
+ {waitingRadioReset &&
+
+ )}
+
+
+
+
+
+
+
+ {!isSubmitting && (
+
+ )}
+ {isSubmitting &&
+
+
+
+ {!isSubmitting && (
+
+ )}
+ {isSubmitting &&
+
+
+
+
+
-
- );
- }
-}
+ //After notes reload
+ useEffect(() => {
+ setValue(notes);
+ return () => {};
+ }, [notes]);
+ return (
+ {I18n.t('Notes of')} {this.props.hostname}
- - -
+
+
+
+
+
+
+ );
+};
const mapStateToProps = (state) => ({
- notes: getNotesState(state),
- loading: state.notes.loading,
- hostname: state.meta.selectedHost
+ notes: getNotesState(state),
+ loading: state.notes.loading,
});
const mapDispatchToProps = (dispatch) => ({
- getNotes: bindActionCreators(getNotes, dispatch),
- setNotes: bindActionCreators(setNotes, dispatch)
+ getNotes: bindActionCreators(getNotes, dispatch),
+ setNotes: bindActionCreators(setNotes, dispatch),
});
-export default connect(mapStateToProps, mapDispatchToProps)(Page);
\ No newline at end of file
+export default connect(mapStateToProps, mapDispatchToProps)(Page);
diff --git a/plugins/lime-plugin-notes/src/notesReducer.js b/plugins/lime-plugin-notes/src/notesReducer.js
index 213ed372..f2248fb5 100644
--- a/plugins/lime-plugin-notes/src/notesReducer.js
+++ b/plugins/lime-plugin-notes/src/notesReducer.js
@@ -1,36 +1,44 @@
import {
- NOTES_GET,
- NOTES_GET_ERROR,
- NOTES_GET_SUCCESS,
- NOTES_SET,
- NOTES_SET_ERROR
-} from './notesConstants';
+ NOTES_GET,
+ NOTES_GET_ERROR,
+ NOTES_GET_SUCCESS,
+ NOTES_SET,
+ NOTES_SET_ERROR,
+} from "./notesConstants";
export const initialState = {
- notes: '',
- loading: false,
- error: false
+ notes: "",
+ loading: false,
+ error: false,
};
-export const reducer = (state = initialState, { type, payload, meta }) => {
- switch (type) {
-
- case NOTES_GET:
- return Object.assign({}, initialState, { loading: true });
-
- case NOTES_GET_ERROR:
- return Object.assign({}, initialState, { loading: false, error: true });
-
- case NOTES_GET_SUCCESS:
- return Object.assign({}, initialState, { loading: false, notes: payload.notes });
-
- case NOTES_SET_ERROR:
- return Object.assign({}, initialState, { loading: false, error: true });
-
- case NOTES_SET:
- return Object.assign({}, state, { loading: true });
-
- default:
- return state;
- }
+export const reducer = (state = initialState, { type, payload }) => {
+ switch (type) {
+ case NOTES_GET:
+ return Object.assign({}, initialState, { loading: true });
+
+ case NOTES_GET_ERROR:
+ return Object.assign({}, initialState, {
+ loading: false,
+ error: true,
+ });
+
+ case NOTES_GET_SUCCESS:
+ return Object.assign({}, initialState, {
+ loading: false,
+ notes: payload.notes,
+ });
+
+ case NOTES_SET_ERROR:
+ return Object.assign({}, initialState, {
+ loading: false,
+ error: true,
+ });
+
+ case NOTES_SET:
+ return Object.assign({}, state, { loading: true });
+
+ default:
+ return state;
+ }
};
diff --git a/plugins/lime-plugin-notes/src/notesSelectors.js b/plugins/lime-plugin-notes/src/notesSelectors.js
index 178209b6..f33c6068 100644
--- a/plugins/lime-plugin-notes/src/notesSelectors.js
+++ b/plugins/lime-plugin-notes/src/notesSelectors.js
@@ -1,2 +1 @@
-
-export const getNotesState = (state) => state.notes.notes;
\ No newline at end of file
+export const getNotesState = (state) => state.notes.notes;
diff --git a/plugins/lime-plugin-notes/src/style.less b/plugins/lime-plugin-notes/src/style.less
index adf6e80d..aee2fe71 100644
--- a/plugins/lime-plugin-notes/src/style.less
+++ b/plugins/lime-plugin-notes/src/style.less
@@ -1,4 +1,5 @@
.notes {
width: 100%;
+ display: block;
height: 50vh;
-}
\ No newline at end of file
+}
diff --git a/plugins/lime-plugin-pirania/index.ts b/plugins/lime-plugin-pirania/index.ts
new file mode 100644
index 00000000..fe2ffd09
--- /dev/null
+++ b/plugins/lime-plugin-pirania/index.ts
@@ -0,0 +1,21 @@
+import PiraniaMenu from "./src/piraniaMenu";
+import PiraniaPage from "./src/piraniaPage";
+import CreateVoucher from "./src/screens/createVoucher";
+import EditVoucher from "./src/screens/editVoucher";
+import InvalidateVoucher from "./src/screens/invalidateVoucher";
+import Voucher from "./src/screens/voucher";
+import { WellcomeScreenEditor } from "./src/screens/wellcomeScreenEditor";
+
+export default {
+ name: "Access",
+ page: PiraniaPage,
+ menu: PiraniaMenu,
+ isCommunityProtected: true,
+ additionalProtectedRoutes: [
+ ["access/wellcomescreen", WellcomeScreenEditor],
+ ["access/create", CreateVoucher],
+ ["access/view/:id", Voucher],
+ ["access/edit/:id", EditVoucher],
+ ["access/invalidate/:id", InvalidateVoucher],
+ ],
+} as LimePlugin;
diff --git a/plugins/lime-plugin-pirania/nodeAdmin/PortalConfigItem.spec.js b/plugins/lime-plugin-pirania/nodeAdmin/PortalConfigItem.spec.js
new file mode 100644
index 00000000..7f231176
--- /dev/null
+++ b/plugins/lime-plugin-pirania/nodeAdmin/PortalConfigItem.spec.js
@@ -0,0 +1,67 @@
+import "@testing-library/jest-dom";
+import { act, cleanup, fireEvent, screen } from "@testing-library/preact";
+import { route } from "preact-router";
+import waitForExpect from "wait-for-expect";
+
+import queryCache from "utils/queryCache";
+import { render } from "utils/test_utils";
+
+import { getPortalConfig } from "../src/piraniaApi";
+import { PortalConfigItem } from "./PortalConfigItem";
+
+jest.mock("../src/piraniaApi");
+
+describe("portal config item", () => {
+ beforeEach(() => {
+ getPortalConfig.mockImplementation(async () => ({
+ activated: true,
+ with_vouchers: true,
+ }));
+ });
+
+ afterEach(() => {
+ cleanup();
+ act(() => queryCache.clear());
+ });
+
+ it("has test id portal-config-item", async () => {
+ render(
+
+ Notes of
+ {" "}
+ {boardData.hostname}
+
+
+
+
+
+
+ {!isSubmitting && (
+
+ )}
+ {isSubmitting &&
+
+
+ );
+};
+export default Copy;
diff --git a/plugins/lime-plugin-pirania/src/components/createVoucherForm.tsx b/plugins/lime-plugin-pirania/src/components/createVoucherForm.tsx
new file mode 100644
index 00000000..11cdc793
--- /dev/null
+++ b/plugins/lime-plugin-pirania/src/components/createVoucherForm.tsx
@@ -0,0 +1,144 @@
+import { Trans } from "@lingui/macro";
+import { Fragment } from "preact";
+import { useForm } from "react-hook-form";
+
+import {
+ MaxLengthErrorMsg,
+ MaxLengthMsg,
+ RequiredErrorMsg,
+} from "components/form";
+import Loading from "components/loading";
+import switchStyle from "components/switch";
+
+type CreateVoucherFormProps = {
+ submitVoucher: () => void;
+ isSubmitting: boolean;
+};
+
+type VoucherForm = {
+ name: string;
+ duration_m: number;
+ qty: number;
+ activation_deadline: string;
+ permanent: boolean;
+ with_activation_deadline: boolean;
+};
+
+const minDate = new Date().toISOString().substring(0, 10);
+
+const CreateVoucherForm = ({
+ submitVoucher,
+ isSubmitting,
+}: CreateVoucherFormProps) => {
+ const {
+ register,
+ handleSubmit,
+ formState: { errors },
+ watch,
+ } = useForm
+
+ {text}
+
+
+ ⧉
+
+
+
+
+
+ {!isSubmitting && (
+
+ )}
+ {isSubmitting &&
+ route(url)}>
+ ❮
+
+);
+export default GoBack;
diff --git a/plugins/lime-plugin-pirania/src/components/timeAgo.spec.js b/plugins/lime-plugin-pirania/src/components/timeAgo.spec.js
new file mode 100644
index 00000000..340f4e50
--- /dev/null
+++ b/plugins/lime-plugin-pirania/src/components/timeAgo.spec.js
@@ -0,0 +1,17 @@
+import "@testing-library/jest-dom";
+import { screen } from "@testing-library/preact";
+import * as timeago from "timeago.js";
+
+import { render } from "utils/test_utils";
+
+import TimeAgo from "./timeAgo";
+
+describe("time ago component", () => {
+ it("formats raw data into formated date", async () => {
+ let date = new Date().getTime() / 1000;
+ render(
+
+ );
+};
+
+export default VoucherListItem;
diff --git a/plugins/lime-plugin-pirania/src/components/voucherListItem.spec.js b/plugins/lime-plugin-pirania/src/components/voucherListItem.spec.js
new file mode 100644
index 00000000..6d672f69
--- /dev/null
+++ b/plugins/lime-plugin-pirania/src/components/voucherListItem.spec.js
@@ -0,0 +1,127 @@
+import "@testing-library/jest-dom";
+import { fireEvent, screen } from "@testing-library/preact";
+import each from "jest-each";
+import { route } from "preact-router";
+import * as timeago from "timeago.js";
+import waitForExpect from "wait-for-expect";
+
+import { render } from "utils/test_utils";
+
+import VoucherListItem from "./voucherListItem";
+
+const voucher = {
+ code: "PIDFIG",
+ id: "x5crd4",
+ activation_deadline: 1633022276, // creation_date + 1 week
+ name: "luandro",
+ duration_m: 10000,
+ creation_date: 1632417476, // Sep 23 2021 14:17:56 GMT-0300
+ permanent: false,
+ status: "available",
+ author_node: "ml-luandro",
+};
+
+describe("voucher list item", () => {
+ it("has test id voucher-item-{voucher.id}", async () => {
+ render(
+
+
+
+
+ {statusMsgs[status]}
+
+
+ {author_node}: {name}
+
+
+
+
+ {status === "active" && permanent && (
+
+ Permanent
+
+ )}
+ {status === "active" && expiration_date && (
+
+
+ Expires{" "}
+ {TimeAgo({ timestamp: expiration_date })}
+
+
+ )}
+ {status === "expired" && (
+
+
+ Expired{" "}
+ {TimeAgo({ timestamp: expiration_date })}
+
+
+ )}
+ {status === "available" && activation_deadline && (
+
+
+ Activation deadline:{" "}
+ {TimeAgo({ timestamp: activation_deadline })}
+
+
+ )}
+
+
+
+ Created {TimeAgo({ timestamp: creation_date })}
+
+
+
+
+ );
+ }
+ return
+
+
+ {!isSubmitting && (
+
+ )}
+ {isSubmitting &&
+
+
+ );
+};
+
+export default InvalidateVoucher;
diff --git a/plugins/lime-plugin-pirania/src/screens/invalidateVoucher.spec.js b/plugins/lime-plugin-pirania/src/screens/invalidateVoucher.spec.js
new file mode 100644
index 00000000..597c3e21
--- /dev/null
+++ b/plugins/lime-plugin-pirania/src/screens/invalidateVoucher.spec.js
@@ -0,0 +1,54 @@
+import "@testing-library/jest-dom";
+import { fireEvent, screen } from "@testing-library/preact";
+import { route } from "preact-router";
+import waitForExpect from "wait-for-expect";
+
+import { render } from "utils/test_utils";
+
+import { invalidate } from "../piraniaApi";
+import InvalidateVoucher from "./invalidateVoucher";
+
+jest.mock("../piraniaApi");
+
+let voucher = {
+ id: "x5crd4",
+};
+
+describe("Invalidate Voucher Page", () => {
+ beforeEach(() => {
+ invalidate.mockClear();
+ invalidate.mockImplementation(async () => null);
+ });
+
+ it("ask if user is sure of invalidating", async () => {
+ render(
+
+
+
+ )}
+
+ {vouchers.map((v) => (
+
+);
+
+const Duration = ({ days }) => {
+ if (!days) {
+ return {v.code}
+ ))}
+
+
+ );
+};
+
+export default PostCreate;
diff --git a/plugins/lime-plugin-pirania/src/screens/postCreate.spec.js b/plugins/lime-plugin-pirania/src/screens/postCreate.spec.js
new file mode 100644
index 00000000..eecfee9a
--- /dev/null
+++ b/plugins/lime-plugin-pirania/src/screens/postCreate.spec.js
@@ -0,0 +1,97 @@
+import "@testing-library/jest-dom";
+import { fireEvent, screen } from "@testing-library/preact";
+import { route } from "preact-router";
+import * as timeago from "timeago.js";
+import waitForExpect from "wait-for-expect";
+
+import { render } from "utils/test_utils";
+
+import PostCreate from "./postCreate";
+
+const vouchers = [
+ {
+ code: "PIDFIG",
+ id: "x5crd4",
+ name: "for luandro",
+ duration_m: 14400,
+ status: "available",
+ },
+ {
+ code: "NNDAMD",
+ id: "fteNhN",
+ name: "for luandro",
+ duration_m: 14400,
+ status: "available",
+ },
+ {
+ code: "BAVWNS",
+ id: "5nLNT9",
+ name: "for luandro",
+ duration_m: 14400,
+ },
+];
+
+describe("voucher post create screen", () => {
+ it("renders the code for each created voucher", async () => {
+ render(
+
+
+
+
+
+
+
+ Created vouchers
+
+
+
+
+ Description: {name}
+
+
+
+ {activation_deadline && (
+
+
+ Activation deadline:{" "}
+ {TimeAgo({ timestamp: activation_deadline })}
+
+
+ )}
+
+
+ );
+};
+
+const Voucher = ({ id }) => {
+ const { data: vouchers, isLoading } = useListVouchers();
+ const voucher = vouchers && vouchers.filter((v) => v.id === id)[0];
+ return (
+
+
+
+ {(status == "available" || status == "active") && (
+
+ )}
+
+
+
+ Description: {name}
+
+
+ Author node: {author_node}
+
+
+
+ Creation date: {TimeAgo({ timestamp: creation_date })}
+
+
+
+ {!permanent && Duration: is permanent }
+
+
+ Status: {statusMsgs[status]}
+
+ {status === "expired" && (
+
+
+ Expiration date:{" "}
+ {TimeAgo({ timestamp: expiration_date })}
+
+
+ )}
+ {status === "active" && (
+
+
+ Activation date:{" "}
+ {TimeAgo({ timestamp: activation_date })}
+
+
+ )}
+ {status === "available" && activation_deadline && (
+
+
+ Activation deadline:{" "}
+ {TimeAgo({ timestamp: activation_deadline })}
+
+
+ )}
+
+
+ );
+};
+
+export default VoucherList;
diff --git a/plugins/lime-plugin-pirania/src/screens/voucherList.spec.js b/plugins/lime-plugin-pirania/src/screens/voucherList.spec.js
new file mode 100644
index 00000000..44e081eb
--- /dev/null
+++ b/plugins/lime-plugin-pirania/src/screens/voucherList.spec.js
@@ -0,0 +1,270 @@
+/* eslint jest/expect-expect: ["error", { "assertFunctionNames": ["expect", "selectFilterOption", "findExpectedVouchers"] }] */
+import "@testing-library/jest-dom";
+import {
+ act,
+ cleanup,
+ fireEvent,
+ screen,
+ waitFor,
+} from "@testing-library/preact";
+import userEvent from "@testing-library/user-event";
+import { route } from "preact-router";
+import waitForExpect from "wait-for-expect";
+
+import { getBoardData, getChangesNeedReboot, getSession } from "utils/api";
+import queryCache from "utils/queryCache";
+import { render } from "utils/test_utils";
+
+import { listVouchers } from "../piraniaApi";
+import VoucherList from "./voucherList";
+
+jest.mock("utils/api");
+jest.mock("../piraniaApi");
+
+const now = new Date().getTime() / 1000;
+const availableVouchers = [
+ {
+ code: "PIDFIG",
+ id: "x5crd4",
+ activation_date: now - 600e3,
+ name: "luandro",
+ duration_m: 1200,
+ is_active: false,
+ creation_date: now - 700e3,
+ permanent: false,
+ status: "available",
+ author_node: "pirania",
+ },
+ {
+ code: "NNDAMD",
+ id: "fteNhN",
+ is_active: false,
+ name: "hiure2",
+ duration_m: 10000000000,
+ creation_date: 1631880815,
+ permanent: false,
+ status: "available",
+ author_node: "conteiner",
+ },
+];
+
+const activeVouchers = [
+ {
+ mac: "6c:88:14:ba:c4:84",
+ expiration_date: 601631880811,
+ code: "BAVWNS",
+ id: "5nLNT9",
+ activation_date: 1631880811,
+ name: "hiure2",
+ duration_m: 10000000000,
+ is_active: true,
+ creation_date: 1631880790,
+ permanent: false,
+ status: "active",
+ author_node: "conteiner",
+ },
+];
+
+const expiredVouchers = [
+ {
+ mac: "98:9e:63:a7:91:e2",
+ expiration_date: 6e25,
+ code: "COSVQK",
+ id: "6TIgTr",
+ activation_date: 1633530122,
+ name: "luandro-iphone",
+ duration_m: 1e24,
+ is_active: false,
+ creation_date: 1633530042,
+ permanent: false,
+ status: "expired",
+ author_node: "sede",
+ },
+];
+
+const invalidatedVouchers = [
+ {
+ mac: "98:9e:63:a7:91:e2",
+ expiration_date: 6e25,
+ code: "KQEDWC",
+ id: "7tyG2",
+ activation_date: 1633530122,
+ name: "made by mistake",
+ duration_m: 1e24,
+ is_active: false,
+ creation_date: 1633530042,
+ permanent: false,
+ status: "invalidated",
+ author_node: "some-node",
+ },
+];
+
+const createdInThisNode = [availableVouchers[1], activeVouchers[0]];
+
+const vouchers = [
+ ...availableVouchers,
+ ...activeVouchers,
+ ...expiredVouchers,
+ ...invalidatedVouchers,
+];
+
+const selectFilterOption = async (option) => {
+ const select = await screen.findByLabelText("Filter by");
+ userEvent.selectOptions(
+ select,
+ screen.getByRole("option", { name: option })
+ );
+ expect(screen.getByRole("option", { name: option })).toBeInTheDocument();
+};
+
+const findExpectedVouchers = async (expectedVouchers) => {
+ for (let i = 0; i < expectedVouchers.length; i++) {
+ const v = expectedVouchers[i];
+ await waitForExpect(async () => {
+ expect(
+ await screen.findByTestId(`voucher-item-${v.id}`)
+ ).toBeInTheDocument();
+ });
+ }
+ const otherVouchers = vouchers.filter(
+ (v) => expectedVouchers.indexOf(v) === -1
+ );
+ for (let i = 0; i < otherVouchers.length; i++) {
+ const v = otherVouchers[i];
+ await waitFor(() => {
+ expect(screen.queryByTestId(`voucher-item-${v.id}`)).toBeNull();
+ });
+ }
+};
+
+describe("voucher list", () => {
+ beforeEach(() => {
+ listVouchers.mockImplementation(async () => [...vouchers]);
+ getBoardData.mockImplementation(async () => ({
+ hostname: "conteiner",
+ }));
+ getSession.mockImplementation(async () => ({
+ username: "root",
+ }));
+ getChangesNeedReboot.mockImplementation(async () => ({
+ "need-reboot": "no",
+ }));
+ });
+
+ afterEach(() => {
+ cleanup();
+ act(() => queryCache.clear());
+ });
+
+ it("shows a button to create a new voucher that routes to creation page", async () => {
+ render(
+
+
+
+
+
+
+ Voucher list
+
+
+
+
+
+ setSearch(e.target.value)}
+ />
+
+
+
+
+
+
+ {filteredVoucher.map((voucher) => (
+
+ There are no vouchers matching the current
+ criteria
+
+
+ )}
+
+
+
+ ))}
+ {filteredVoucher.length === 0 && (
+
+
+
+
+
+
+
+ {!isSubmitting && (
+
+ )}
+ {isSubmitting &&
+
+
+
+);
+
+function toWeb(rwSsh) {
+ const rwSshParts = rwSsh.split(" ");
+ const [token, domain] = rwSshParts[rwSshParts.length - 1].split("@");
+ return `https://${domain}/t/${token}`;
+}
+
+const ConsoleView = () => {
+ const { data: session, isLoading } = useSession();
+ const [sessionSrc, setSessionSrc] = useState(null);
+
+ useEffect(() => {
+ if (!isLoading && !session) goBack();
+ }, [isLoading, session]);
+
+ useEffect(() => {
+ if (session) {
+ setSessionSrc(toWeb(session.rw_ssh));
+ }
+ }, [session]);
+
+ function goBack() {
+ route("/remotesupport");
+ }
+
+ if (isLoading) {
+ return (
+
+
+
+
+
+ );
+ }
+
+ return
+ Please check that ubus-tmate package is installed
+
+ );
+ }
+
+ if (loadingInternetStatus || loadingSession) {
+ return (
+
+
+ );
+ }
+
+ if (internetStatus?.connected === false) {
+ return
+
+
+
+);
+
+export const RemoteSupportPage_ = ({
+ session,
+ openError = false,
+ isSubmitting = false,
+ onOpenSession,
+ onCloseSession,
+ onShowConsole,
+}) => (
+
+ Ask for remote support
+
+
+
+
+
+ To enable remote access an internet connection is needed
+ {" "}
+
+
+
+ You can share your mobile connection to the node by setting
+ up a mobile hotspot
+
+
+
+
+
+
+
+ {!session && (
+
+);
+
+export default RemoteSupportPage;
diff --git a/plugins/lime-plugin-remotesupport/src/remoteSupportQueries.js b/plugins/lime-plugin-remotesupport/src/remoteSupportQueries.js
new file mode 100644
index 00000000..50afabba
--- /dev/null
+++ b/plugins/lime-plugin-remotesupport/src/remoteSupportQueries.js
@@ -0,0 +1,22 @@
+import { useMutation, useQuery } from "@tanstack/react-query";
+
+import queryCache from "utils/queryCache";
+
+import { closeSession, getSession, openSession } from "./remoteSupportApi";
+
+export function useSession(queryConfig) {
+ return useQuery(["tmate", "get_session"], getSession, queryConfig);
+}
+
+export function useOpenSession() {
+ return useMutation(openSession, {
+ onSuccess: () => queryCache.invalidateQueries(["tmate", "get_session"]),
+ onError: () => queryCache.setQueryData(["tmate", "get_session"], null),
+ });
+}
+
+export function useCloseSession() {
+ return useMutation(closeSession, {
+ onSuccess: () => queryCache.invalidateQueries(["tmate", "get_session"]),
+ });
+}
diff --git a/plugins/lime-plugin-remotesupport/src/style.less b/plugins/lime-plugin-remotesupport/src/style.less
new file mode 100644
index 00000000..6da13a84
--- /dev/null
+++ b/plugins/lime-plugin-remotesupport/src/style.less
@@ -0,0 +1,33 @@
+.noteError {
+ background-color: #923838;
+ color: #FFF;
+ padding: 0.5em;
+ margin-bottom: 1em;
+}
+
+.token {
+ border: 0.1em solid #808080;
+ background-color: #c9c9c9;
+ padding: 0.5em;
+ text-align: center;
+ pre {
+ margin: 0;
+ white-space: pre-wrap;
+ white-space: -moz-pre-wrap;
+ }
+ margin-bottom: 1em;
+ overflow-wrap: break-word;
+}
+
+.section {
+ margin-top: 1em;
+}
+
+.btnDanger {
+ border-color: #923838;
+ color: #923838;
+}
+
+.consoleButtons {
+ padding:0.5em;
+}
\ No newline at end of file
diff --git a/plugins/lime-plugin-rx/index.js b/plugins/lime-plugin-rx/index.js
deleted file mode 100755
index b03496a6..00000000
--- a/plugins/lime-plugin-rx/index.js
+++ /dev/null
@@ -1,19 +0,0 @@
-import epics from './src/rxEpics';
-import { reducer } from './src/rxReducer';
-import * as selector from './src/rxSelectors';
-import * as constants from './src/rxConstants';
-import Rx from './src/rxPage';
-import { RxMenu } from './src/rxMenu';
-
-export default {
- name: 'Rx',
- page: Rx,
- menu: RxMenu,
- store: {
- name: 'rx',
- epics,
- reducer,
- selector,
- constants
- }
-};
diff --git a/plugins/lime-plugin-rx/index.ts b/plugins/lime-plugin-rx/index.ts
new file mode 100755
index 00000000..24ee2969
--- /dev/null
+++ b/plugins/lime-plugin-rx/index.ts
@@ -0,0 +1,8 @@
+import { RxMenu } from "./src/rxMenu";
+import Rx from "./src/rxPage";
+
+export default {
+ name: "Rx",
+ page: Rx,
+ menu: RxMenu,
+};
diff --git a/plugins/lime-plugin-rx/rx.stories.js b/plugins/lime-plugin-rx/rx.stories.js
new file mode 100644
index 00000000..233c7d71
--- /dev/null
+++ b/plugins/lime-plugin-rx/rx.stories.js
@@ -0,0 +1,111 @@
+import { action } from "@storybook/addon-actions";
+
+import { Page } from "./src/rxPage";
+
+const nodeData = {
+ internet: {
+ DNS: {
+ working: true,
+ },
+ IPv6: {
+ working: false,
+ },
+ status: "ok",
+ IPv4: {
+ working: true,
+ },
+ },
+ ips: [
+ {
+ version: "4",
+ address: "10.5.0.36/21",
+ },
+ {
+ version: "6",
+ address: "2801:1e8:2::7288:d100/64",
+ },
+ {
+ version: "6",
+ address: "fe80::6670:2ff:fed1:8872/64",
+ },
+ ],
+ hostname: "ql-anaymarcos",
+ status: "ok",
+ uptime: "93055.80\n",
+ most_active: {
+ rx_bytes: 82509781,
+ station_mac: "A8:40:41:1C:84:05",
+ station_hostname: "ql_graciela_wlan2_adhoc",
+ tx_bytes: 12806307,
+ iface: "wlan1-adhoc",
+ attributes: {
+ inactive: 20,
+ signal: "-63",
+ channel: 136,
+ },
+ link_type: "wifi",
+ signal: "-62",
+ },
+};
+
+const newVersionAvailable = {
+ version: "LibreRouter 1.5",
+};
+
+const actions = {
+ getNodeStatusTimer: action("getNodeStatusTimer"),
+ getNodeStatus: action("getNodeStatus"),
+ stopTimer: action("stopTimer"),
+ changeNode: action("changeNode"),
+};
+
+export default {
+ title: "Containers/Home Screen (Rx)",
+ component: Page,
+};
+
+export const withData = (args) =>
+ Ask for remote support
+
+ {!session && (
+
+
+ )}
+ {openError && (
+
+
+
+ Cannot connect to the remote support server
+
+
+Please verify your internet connection
+
+ )}
+ {session && (
+ +
+
+ )}
+ {isSubmitting &&
+
+
+
+ {session.rw_ssh}
+
+
+
+
+
+ Show Console
+
+
+
+
+
+
+
+ Close Session
+
+
+
- -
+ + + +
+ + + +
+ +
- {I18n.t('Interface')} {node.most_active.iface.split('-')[0]}
- {I18n.t('Traffic')} {Math.round((node.most_active.rx_bytes + node.most_active.tx_bytes)/1024/1024)}MB - -
+ +
+ +
- {I18n.t('Loading node status...')} -
- ); - } - - - startCount() { - if (typeof this.count === 'undefined') { - this.setState({ plusTime: 0 }); - this.count = setInterval(() => { - let newTime = this.state.plusTime + 1; - this.setState({ plusTime: newTime }); - },1000); - } - } - - stopCount() { - clearInterval(this.count); - this.setState({ plusTime: 0 }); - delete this.count; - } - - changeNode(node) { - return () => { - this.props.changeNode(node.most_active.hostname.split('_')[0]); - }; - } - - nodeStatus(node){ - if (node.hostname) { - this.startCount(); - return ( -
-
-
-
- {(node.internet.IPv4.working === true)? (✔): (✘)} IPv4
- {(node.internet.IPv6.working === true)? (✔): (✘)} IPv6
- {(node.internet.DNS.working === true)? (✔): (✘)} DNS
-
-
-
-
- { node.ips.map((ip,key) => (
-
- IPv{ip.version} {ip.address}
- ) - )} -
-
-
- );
- }
- }
-
- constructor(props) {
- super(props);
- this.startCount = this.startCount.bind(this);
- this.changeNode = this.changeNode.bind(this);
- }
-
- componentDidMount() {
- this.props.getNodeStatus();
- }
-
- componentWillUnmount() {
- this.props.stopTimer();
- this.stopCount();
- }
-
- render() {
- return (
- - ) - )} -
- { this.loading(this.props.isLoading, this.props.nodeData,this.props.signal) }
-
- );
- }
-}
-
-
-export const mapStateToProps = (state) => ({
- nodeData: getNodeData(state),
- isLoading: isLoading(state)
-});
-
-export const mapDispatchToProps = (dispatch) => ({
- getNodeStatus: bindActionCreators(getNodeStatus,dispatch),
- stopTimer: bindActionCreators(stopTimer,dispatch),
- changeNode: bindActionCreators(changeNode,dispatch)
-});
+const Page = ({}) => {
+ const { data: boardData, isLoading: loadingBoardData } = useBoardData();
+
+ const { data: nodeStatusData, isLoading } = useNodeStatus({});
+ const { data: internet } = useInternetStatus();
+
+ function loading(option, nodeData) {
+ if (!option && !loadingBoardData) {
+ return nodeStatus(nodeData);
+ }
+ return (
+
+ Loading node status...
+
+ );
+ }
+
+ function _changeNode(hostname) {
+ window.location.href = `http://${hostname}`;
+ }
+
+ function nodeStatus(node) {
+ if (node.hostname) {
+ return (
+
+ Internet connection}>
+
+
+ {" "}
+ {internet.IPv4.working === true ? (
+ ✔
+ ) : (
+ ✘
+ )}{" "}
+ IPv4{" "}
+
+
+ {" "}
+ {internet.IPv6.working === true ? (
+ ✔
+ ) : (
+ ✘
+ )}{" "}
+ IPv6{" "}
+
+
+ {" "}
+ {internet.DNS.working === true ? (
+ ✔
+ ) : (
+ ✘
+ )}{" "}
+ DNS{" "}
+
+
+
+
+ IP Addresses}>
+ {node.ips.map((ip, key) => (
+
+ IPv{ip.version} {ip.address}
+
+ + ))} +
+
+ );
+ }
+ }
+
+ return (
+ + + ))} +
+ {loading(isLoading, nodeStatusData)}
+
+ );
+};
-export default connect(mapStateToProps, mapDispatchToProps)(Page);
\ No newline at end of file
+export default Page;
+
+// export const mapStateToProps = (state) => ({
+// nodeData: getNodeData(state),
+// isLoading: isLoading(state),
+// });
+//
+// export const mapDispatchToProps = (dispatch) => ({
+// getNodeStatusTimer: bindActionCreators(getNodeStatusTimer, dispatch),
+// getNodeStatus: bindActionCreators(getNodeStatus, dispatch),
+// stopTimer: bindActionCreators(stopTimer, dispatch),
+// });
+//
+// export default connect(mapStateToProps, mapDispatchToProps)(Page);
diff --git a/plugins/lime-plugin-rx/src/rxQueries.js b/plugins/lime-plugin-rx/src/rxQueries.js
new file mode 100644
index 00000000..6a94a9b5
--- /dev/null
+++ b/plugins/lime-plugin-rx/src/rxQueries.js
@@ -0,0 +1,26 @@
+import { useQuery } from "@tanstack/react-query";
+
+import { getInternetStatus, getNodeStatus } from "./rxApi";
+
+const refetchInterval = 2000;
+
+export function useNodeStatus(params) {
+ return useQuery(["lime-rx", "node-status"], getNodeStatus, {
+ enabled: true,
+ refetchInterval,
+ ...params,
+ });
+}
+
+export function useInternetStatus(params) {
+ return useQuery(["lime-rx", "internet-status"], getInternetStatus, {
+ placeholderData: {
+ IPv4: { working: null },
+ IPv6: { working: null },
+ DNS: { working: null },
+ },
+ enabled: true,
+ refetchInterval,
+ ...params,
+ });
+}
diff --git a/plugins/lime-plugin-rx/src/rxReducer.js b/plugins/lime-plugin-rx/src/rxReducer.js
deleted file mode 100644
index 9a848cb2..00000000
--- a/plugins/lime-plugin-rx/src/rxReducer.js
+++ /dev/null
@@ -1,58 +0,0 @@
-import {
- GET_NODE_STATUS,
- GET_NODE_STATUS_SUCCESS,
- GET_NODE_STATUS_ERROR,
- GET_TRAFFIC_SUCCESS,
- GET_SIGNAL_SUCCESS,
- GET_INTERNET_STATUS_SUCCESS
-} from './rxConstants';
-
-export const initialState = {
- loading: false,
- interval: 800,
- data: {
- internet: {
- IPv4: { working: null },
- IPv6: { working: null },
- DNS: { working: null }
- }
- }
-};
-
-export const reducer = (state = initialState, { type, payload }) => {
- switch (type) {
- case GET_NODE_STATUS:
- return Object.assign( initialState, { loading: true, data: {
- internet: {
- IPv4: { working: null },
- IPv6: { working: null },
- DNS: { working: null }
- }
- } });
- case GET_NODE_STATUS_SUCCESS:
- return Object.assign({}, state, { loading: false, data: Object.assign({}, state.data, payload) });
- case GET_NODE_STATUS_ERROR:
- return Object.assign({}, state, { loading: false, data: Object.assign({}, state.data, payload) });
- case GET_SIGNAL_SUCCESS:
- return Object.assign({}, state, {
- data: Object.assign({},state.data, {
- most_active: Object.assign({},state.data.most_active, {
- signal: payload.signal
- })
- })
- });
- case GET_TRAFFIC_SUCCESS:
- return Object.assign({}, state, {
- data: Object.assign({},state.data, {
- most_active: Object.assign({},state.data.most_active, {
- tx_bytes: payload.tx_bytes,
- rx_bytes: payload.rx_bytes
- })
- })
- });
- case GET_INTERNET_STATUS_SUCCESS:
- return Object.assign({}, state, { data: Object.assign({}, state.data, { internet: payload }) });
- default:
- return state;
- }
-};
diff --git a/plugins/lime-plugin-rx/src/rxSelectors.js b/plugins/lime-plugin-rx/src/rxSelectors.js
deleted file mode 100755
index f0d49780..00000000
--- a/plugins/lime-plugin-rx/src/rxSelectors.js
+++ /dev/null
@@ -1,4 +0,0 @@
-export const getNodeData = (state) => state.rx.data;
-export const isLoading = (state) => state.rx.loading;
-export const getInternetStatus = (state) => state.rx.data.internet;
-export const getSettings = (state) => state.meta.settings;
\ No newline at end of file
diff --git a/plugins/lime-plugin-rx/src/style.less b/plugins/lime-plugin-rx/src/style.less
deleted file mode 100755
index e69de29b..00000000
diff --git a/plugins/lime-plugin-rx/test/actions.spec.js b/plugins/lime-plugin-rx/test/actions.spec.js
deleted file mode 100644
index 0908524f..00000000
--- a/plugins/lime-plugin-rx/test/actions.spec.js
+++ /dev/null
@@ -1,14 +0,0 @@
-import limePlugin from '../src/index';
-import { getNodeStatus } from '../src/rxActions';
-import { expect } from 'chai';
-
-describe('Dispatch action', () => {
- it('Get node status', () => {
- let change = getNodeStatus();
- let dispatched = [];
- change((action) => dispatched.push(action),'');
- expect(JSON.stringify(dispatched)).to.be.equal(JSON.stringify([
- { type: limePlugin.store.constants.GET_NODE_STATUS, payload: {} }
- ]));
- });
-});
diff --git a/plugins/lime-plugin-rx/test/epics.spec.js b/plugins/lime-plugin-rx/test/epics.spec.js
deleted file mode 100644
index ca81d9e5..00000000
--- a/plugins/lime-plugin-rx/test/epics.spec.js
+++ /dev/null
@@ -1,71 +0,0 @@
-
-import limeCorePlugin from '../src/index';
-import { assert } from 'chai';
-
-import { ActionsObservable } from 'redux-observable';
-
-import { Subject } from 'rxjs/Subject';
-import { Observable } from 'rxjs/Observable';
-
-import 'rxjs/add/operator/toArray';
-import 'rxjs/add/observable/of';
-
-const c = limeCorePlugin.store.constants;
-import epics from '../src/rxEpics';
-
-const epicAssert = (epic,options,compare) => {
- const actions = new Subject();
- const actions$ = new ActionsObservable(actions);
- const store = { getState: () => options.store };
-
- epic(actions$, store, options.api)
- .take(options.result.length)
- .toArray()
- .subscribe(compare);
-
- if (options.action.length) {
- options.action.map(act => actions.next(act));
- }
- else {
- actions.next(options.action);
- }
-};
-
-//TESTS
-describe('Status epics', () => {
- it('Get status', (done) => {
-
- const onAction = {
- type: c.GET_NODE_STATUS,
- payload: {}
- };
-
- const expectedOutput = {
- type: c.GET_NODE_STATUS_SUCCESS,
- payload: {
- test: 'ok'
- }
- };
-
- const wsAPI = {
- call: () => Observable.of({ test: 'ok' })
- };
-
- const options = {
- action: [onAction],
- result: [expectedOutput],
- store: { meta: { sid: 123 } },
- api: { wsAPI }
- };
-
- epicAssert(
- epics.nodeStatus,
- options,
- (actions) => {
- assert.deepEqual(actions,[expectedOutput]);
- done();
- }
- );
- });
-
-});
\ No newline at end of file
diff --git a/plugins/lime-plugin-rx/test/menu.spec.js b/plugins/lime-plugin-rx/test/menu.spec.js
deleted file mode 100644
index d9ffd435..00000000
--- a/plugins/lime-plugin-rx/test/menu.spec.js
+++ /dev/null
@@ -1,14 +0,0 @@
-import { h } from 'preact'; /** @jsx h */
-import chai from 'chai';
-import assertJsx from 'preact-jsx-chai';
-
-chai.use(assertJsx);
-
-// import { RxMenu } from '../src/rxMenu';
-
-// describe('Menu item', () => {
-// it('Render html', () => {
-// expect(
-
- );
- }
-}
-
-export default Alert;
\ No newline at end of file
diff --git a/src/components/alert/style.less b/src/components/alert/style.less
deleted file mode 100644
index b834245b..00000000
--- a/src/components/alert/style.less
+++ /dev/null
@@ -1,11 +0,0 @@
-.toast {
- width: calc(~"100% - 20px");
- position: fixed;
- z-index: 99990;
- background: #000;
- bottom: 10px;
- margin: 0 10px;
- text-align: center;
- transition: all 250ms ease-in;
- opacity: 0.8;
-};
diff --git a/src/components/app.tsx b/src/components/app.tsx
new file mode 100644
index 00000000..d14b9ac7
--- /dev/null
+++ b/src/components/app.tsx
@@ -0,0 +1,123 @@
+import { fromNavigator } from "@lingui/detect-locale";
+import { I18nProvider } from "@lingui/react";
+import { QueryClientProvider } from "@tanstack/react-query";
+import { ReactQueryDevtools } from "@tanstack/react-query-devtools";
+import Router from "preact-router";
+import { useEffect } from "preact/hooks";
+import { Provider } from "react-redux";
+
+import { Menu } from "containers/Menu";
+import { RebootPage } from "containers/RebootPage";
+import SubHeader from "containers/SubHeader";
+
+import { AppContextProvider } from "utils/app.context";
+import { useBoardData, useLogin, useSession } from "utils/queries";
+import queryCache from "utils/queryCache";
+import { CommunityProtectedRoute, Redirect, Route } from "utils/routes";
+
+import { plugins } from "../config";
+import i18n, { dynamicActivate } from "../i18n";
+import { store } from "../store";
+import { history } from "../store/history";
+import { Header } from "./header";
+
+const Routes = () => (
+ // @ts-ignore
+
- {this.props.text}
-
-
+
+ );
+};
+
+const AppDefault = () => {
+ useEffect(() => {
+ dynamicActivate(fromNavigator().split("-")[0] as Locales);
+ }, []);
+ return (
+
+
+
+
+);
diff --git a/src/components/banner/banner_with_options.js b/src/components/banner/banner_with_options.js
new file mode 100644
index 00000000..a05a44b0
--- /dev/null
+++ b/src/components/banner/banner_with_options.js
@@ -0,0 +1,28 @@
+import { Trans } from "@lingui/macro";
+
+import style from "./style.less";
+
+export const BannerWithOptions = ({
+ title,
+ cancelOption,
+ onNotShowAgain,
+ options,
+}) => (
+ {description}
+
+
+
+
+
+);
diff --git a/src/components/banner/index.js b/src/components/banner/index.js
new file mode 100644
index 00000000..76d88b3d
--- /dev/null
+++ b/src/components/banner/index.js
@@ -0,0 +1,34 @@
+import { Trans } from "@lingui/macro";
+
+import style from "./style.less";
+
+export const Banner = ({
+ onOk,
+ onCancel,
+ title,
+ description,
+ onNotShowAgain,
+}) => (
+ {title}
+ {options.map((option, i) => { + return{option}
;
+ })}
+ {cancelOption}
+
+
+
+
+
+);
diff --git a/src/components/banner/style.less b/src/components/banner/style.less
new file mode 100644
index 00000000..996b49c6
--- /dev/null
+++ b/src/components/banner/style.less
@@ -0,0 +1,44 @@
+.banner {
+ padding: 20px 10px;
+ flex:auto;
+ display: flex;
+ flex-direction: column;
+ height: 100%;
+ background: #54716a;
+ color: #fff;
+ text-align: center;
+}
+
+.description {
+ max-width: 400px;
+ margin: 20px auto;
+ font-size: 19px;
+}
+
+.bannerButton {
+ border: 1px solid rbga(255, 255, 255, 0.5);
+ color: #54716a;
+ background: whitesmoke;
+ margin: 10px;
+ padding: 0 13px;
+ transition: border cubic-bezier(0.075, 0.82, 0.165, 1);
+}
+
+.bannerButtonCancel button {
+ color: #fff;
+ background: transparent;
+}
+
+.bannerButtonCancel .description {
+ font-size: 13px;
+ font-weight: bold;
+
+}
+
+.bannerButton:hover {
+ border: 1px solid rbga(255, 255, 255, 1);
+}
+
+.dontShowAgain {
+ margin-top: auto;
+}
diff --git a/src/components/box/index.js b/src/components/box/index.js
index 1aff9963..9c60057f 100644
--- a/src/components/box/index.js
+++ b/src/components/box/index.js
@@ -1,13 +1,23 @@
-import { h } from 'preact';
-
export const Box = ({ title, children }) => (
- {title}
+{description}
+
+
+
+
+
+
+
+
-
+
- {title}
-
-
- {children}
-
-
+
);
-
diff --git a/src/components/collapsible/index.js b/src/components/collapsible/index.js
new file mode 100644
index 00000000..617f8cce
--- /dev/null
+++ b/src/components/collapsible/index.js
@@ -0,0 +1,20 @@
+import { useToggle } from "react-use";
+
+import style from "./style.less";
+
+export const Collapsible = ({ title, children, initCollapsed }) => {
+ const [collapsed, toggleCollapsed] = useToggle(initCollapsed);
+ return (
+
+ {title}
+
+
+ {children}
+
+
+
+ );
+};
diff --git a/src/components/collapsible/style.less b/src/components/collapsible/style.less
new file mode 100644
index 00000000..cd5b92e9
--- /dev/null
+++ b/src/components/collapsible/style.less
@@ -0,0 +1,5 @@
+.collapsible {
+ border: 1px solid #222;
+ padding: 1em;
+ border-radius: .5em;
+}
diff --git a/src/components/drawer/index.js b/src/components/drawer/index.js
deleted file mode 100644
index 3b73dd4a..00000000
--- a/src/components/drawer/index.js
+++ /dev/null
@@ -1,20 +0,0 @@
-import { h, Component } from 'preact';
-import style from './style';
-
-export class Drawer extends Component {
-
- status(open) {
- if (open) {
- return 'transform: translate(0,0)';
- }
- return 'transform: translate(-100vw,0)';
- }
-
- render() {
- return (
-
+
+ {!collapsed && {title}
+ {collapsed ? "ᐯ" : "ᐱ"}
+ {children}
}
+
- {(this.props.children)}
-
- );
- }
-}
\ No newline at end of file
diff --git a/src/components/drawer/style.less b/src/components/drawer/style.less
deleted file mode 100644
index 5e07cd05..00000000
--- a/src/components/drawer/style.less
+++ /dev/null
@@ -1,29 +0,0 @@
-.drawer {
- height: 100vh;
- width: 80vw;
- background: #f5f5f5;
- position: absolute;
- left:0px;
- top: 0px;
- -webkit-transition: 0.25s ease-in-out;
- -moz-transition: 0.25s ease-in-out;
- -o-transition: 0.25s ease-in-out;
- transition: 0.25s ease-in-out;
- box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);
- nav {
- padding-top: 20px;
- a {
- display: block;
- padding: 10px 0 10px 30px;
- font-weight: bold;
- text-align: left;
- text-decoration: none;
- color: #555;
- will-change: background-color;
- &:hover, &:active {
- background: rgba(255,255,255,0.3);
- }
- }
- }
-}
-
diff --git a/src/components/footer/index.js b/src/components/footer/index.js
deleted file mode 100644
index 3f89ee97..00000000
--- a/src/components/footer/index.js
+++ /dev/null
@@ -1,13 +0,0 @@
-import { h } from 'preact';
-import { Link } from 'preact-router';
-import style from './style';
-
-export const Footer = () => (
- LimeApp
- -{children}
+); + +export const MaxLengthMsg = ({ length }) => ( +{(this.props.hostname !== '')?this.props.hostname:'LiMe'}
- -{boardData.hostname}
} + {boardData && menuEnabled && ( +
+ toogle menu
+
+ )}
+
+
+ );
+};
+
+export default Help;
diff --git a/src/components/help/index.js b/src/components/help/index.js
new file mode 100644
index 00000000..728a0b0e
--- /dev/null
+++ b/src/components/help/index.js
@@ -0,0 +1,2 @@
+export * from "./help";
+export { default } from "./help";
diff --git a/src/components/help/style.less b/src/components/help/style.less
new file mode 100644
index 00000000..fa98012f
--- /dev/null
+++ b/src/components/help/style.less
@@ -0,0 +1,49 @@
+.symbol {
+ background: #F39100;
+ border-radius: 50%;
+ width: 2em;
+ z-index: 999;
+ color: white;
+ text-align: center;
+ line-height: 2em;
+ cursor: pointer;
+}
+
+.tooltip {
+ background: #fff;
+ border: 0.1em solid #F39100;
+ border-radius: 1em;
+ padding: 2em;
+ cursor:auto;
+}
+
+
+.tooltipWrapper {
+ z-index: 999;
+ position: absolute;
+ top: 0px;
+ left: 0px;
+ height: 100%;
+ width: 100%;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ padding: 3em;
+ cursor:pointer;
+}
+
+.tooltipX {
+ cursor:pointer;
+ margin-left: auto;
+}
+
+.background {
+ position: absolute;
+ top: 0px;
+ left: 0px;
+ height: 100%;
+ background: #fff;
+ z-index: 998;
+ width: 100%;
+ opacity: 70%;
+}
diff --git a/src/components/icons/teenny/README.md b/src/components/icons/teenny/README.md
new file mode 100644
index 00000000..59ee244f
--- /dev/null
+++ b/src/components/icons/teenny/README.md
@@ -0,0 +1,5 @@
+Icons borrowed from.
+
+https://teenyicons.com/
+
+(kon) To add svg icons without external packages on a Preact project, the easiest way is to add them as components.
diff --git a/src/components/icons/teenny/align.jsx b/src/components/icons/teenny/align.jsx
new file mode 100644
index 00000000..d91650bf
--- /dev/null
+++ b/src/components/icons/teenny/align.jsx
@@ -0,0 +1,16 @@
+export const AlignIcon = () => {
+ return (
+
+ );
+};
diff --git a/src/components/icons/teenny/doc.jsx b/src/components/icons/teenny/doc.jsx
new file mode 100644
index 00000000..8ba1a6f3
--- /dev/null
+++ b/src/components/icons/teenny/doc.jsx
@@ -0,0 +1,14 @@
+export const DocIcon = () => (
+
+);
diff --git a/src/components/icons/teenny/equalizer.jsx b/src/components/icons/teenny/equalizer.jsx
new file mode 100644
index 00000000..e0ea822b
--- /dev/null
+++ b/src/components/icons/teenny/equalizer.jsx
@@ -0,0 +1,14 @@
+export const EqualizerIcon = () => (
+
+);
diff --git a/src/components/icons/teenny/lifebuoy.jsx b/src/components/icons/teenny/lifebuoy.jsx
new file mode 100644
index 00000000..1b87d916
--- /dev/null
+++ b/src/components/icons/teenny/lifebuoy.jsx
@@ -0,0 +1,14 @@
+export const LifeBuoyIcon = () => (
+
+);
diff --git a/src/components/icons/teenny/lock.jsx b/src/components/icons/teenny/lock.jsx
new file mode 100644
index 00000000..73fe1065
--- /dev/null
+++ b/src/components/icons/teenny/lock.jsx
@@ -0,0 +1,14 @@
+export const LockIcon = () => (
+
+);
diff --git a/src/components/icons/teenny/map.jsx b/src/components/icons/teenny/map.jsx
new file mode 100644
index 00000000..2cad4b4c
--- /dev/null
+++ b/src/components/icons/teenny/map.jsx
@@ -0,0 +1,14 @@
+export const MapIcon = () => (
+
+);
diff --git a/src/components/icons/teenny/router.jsx b/src/components/icons/teenny/router.jsx
new file mode 100644
index 00000000..8cda80f7
--- /dev/null
+++ b/src/components/icons/teenny/router.jsx
@@ -0,0 +1,14 @@
+export const RouterIcon = () => (
+
+);
diff --git a/src/components/icons/teenny/settings.jsx b/src/components/icons/teenny/settings.jsx
new file mode 100644
index 00000000..a152232f
--- /dev/null
+++ b/src/components/icons/teenny/settings.jsx
@@ -0,0 +1,24 @@
+export const SettingsIcon = () => (
+
+);
diff --git a/src/components/icons/teenny/status.jsx b/src/components/icons/teenny/status.jsx
new file mode 100644
index 00000000..23504254
--- /dev/null
+++ b/src/components/icons/teenny/status.jsx
@@ -0,0 +1,16 @@
+export const StatusIcon = () => {
+ return (
+
+ );
+};
diff --git a/src/components/icons/teenny/ticket.jsx b/src/components/icons/teenny/ticket.jsx
new file mode 100644
index 00000000..84793b2c
--- /dev/null
+++ b/src/components/icons/teenny/ticket.jsx
@@ -0,0 +1,14 @@
+export const TicketIcon = () => (
+
+);
diff --git a/src/components/icons/teenny/up.jsx b/src/components/icons/teenny/up.jsx
new file mode 100644
index 00000000..26b1ed3b
--- /dev/null
+++ b/src/components/icons/teenny/up.jsx
@@ -0,0 +1,14 @@
+export const UpIcon = () => (
+
+);
diff --git a/src/components/list/index.js b/src/components/list/index.js
new file mode 100644
index 00000000..491ccf0c
--- /dev/null
+++ b/src/components/list/index.js
@@ -0,0 +1 @@
+export * from "./list";
diff --git a/src/components/list/list.js b/src/components/list/list.js
new file mode 100644
index 00000000..c2b6ca86
--- /dev/null
+++ b/src/components/list/list.js
@@ -0,0 +1,15 @@
+import style from "./style.less";
+
+export const List = ({ children }) => (
+
+ ?
+
+ {shown && }
+ {shown && (
+
+
+ )}
+ e.stopPropagation()}
+ >
+
+
+
+
+ X
+
+ {children}
+);
+
+export const ListItem = ({ children, onClick, ...props }) => (
+
+ {children}
+
+);
diff --git a/src/components/list/style.less b/src/components/list/style.less
new file mode 100644
index 00000000..c1eebc03
--- /dev/null
+++ b/src/components/list/style.less
@@ -0,0 +1,16 @@
+.list {
+ display: flex;
+ flex-direction: column;
+ flex:auto;
+ overflow: auto;
+}
+
+.listItem {
+ display: flex;
+ padding: 1em;
+ border-bottom: 0.05em solid #eaeaea;
+}
+
+.clickable {
+ cursor: pointer;
+}
\ No newline at end of file
diff --git a/src/components/loading/index.js b/src/components/loading/index.js
deleted file mode 100644
index a1bee1a6..00000000
--- a/src/components/loading/index.js
+++ /dev/null
@@ -1,13 +0,0 @@
-import { h } from 'preact';
-
-import style from './style';
-
-export const Loading = () => (
-
-
-
-
-
-);
-
-export default Loading;
diff --git a/src/components/loading/index.tsx b/src/components/loading/index.tsx
new file mode 100644
index 00000000..79d169ff
--- /dev/null
+++ b/src/components/loading/index.tsx
@@ -0,0 +1,22 @@
+import style from "./style.less";
+
+type LoadingProps = {
+ color?: string
+}
+
+export const Loading = ({ color } : LoadingProps) => {
+ const styleOverride = color ? { backgroundColor: color } : undefined;
+ return (
+
+
+
+
+
+ );
+};
+
+export default Loading;
diff --git a/src/components/navigator/index.js b/src/components/navigator/index.js
deleted file mode 100644
index 4d1f7fa7..00000000
--- a/src/components/navigator/index.js
+++ /dev/null
@@ -1,22 +0,0 @@
-import { h, Component } from 'preact';
-import style from './style';
-
-class Navigator extends Component {
- notInBase(meta){
- if (meta.selectedHost !== meta.base && meta.sid !== '00000000000000000000000000000000' && meta.stauts !== 'start') {
- return 'transform: translate(0,0)';
- }
- return 'transform: translate(0,-100px)';
- }
-
- render() {
- return (
-
- );
- }
-}
-
-export default Navigator;
diff --git a/src/components/navigator/style.less b/src/components/navigator/style.less
deleted file mode 100644
index 17c583e6..00000000
--- a/src/components/navigator/style.less
+++ /dev/null
@@ -1,26 +0,0 @@
-.navigation {
- position: fixed;
- width: 100%;
- padding: 10px;
- background: #325850;
- color: #fff;
- top:55px;
- z-index: 9998;
- -webkit-transition: 0.25s ease-in-out;
- -moz-transition: 0.25s ease-in-out;
- -o-transition: 0.25s ease-in-out;
- transition: 0.25s ease-in-out;
- h4 {
- display: inline;
- line-height: 1.6em;
- padding-left: 5px;
- }
- button {
- border-radius: 0px;
- background: #fff;
- color: #325850;
- margin: 0px;
- float: right;
- padding: 0 13px;
- }
-}
\ No newline at end of file
diff --git a/src/components/progressbar/index.js b/src/components/progressbar/index.js
new file mode 100644
index 00000000..ec805155
--- /dev/null
+++ b/src/components/progressbar/index.js
@@ -0,0 +1,12 @@
+import style from "./style.less";
+
+const ProgressBar = ({ color = "#38927f", progress = 0 }) => (
+
+
+
+);
+
+export default ProgressBar;
diff --git a/src/components/progressbar/style.less b/src/components/progressbar/style.less
new file mode 100644
index 00000000..001798e7
--- /dev/null
+++ b/src/components/progressbar/style.less
@@ -0,0 +1,12 @@
+.wrapper {
+ width: 100%;
+ height: 15px;
+ border: 1px solid rgba(0,0,0,0.5);
+ margin-bottom: 0.2em;
+}
+
+.progress {
+ width: 0;
+ height: 11px;
+ margin-top: 1px;
+}
diff --git a/src/components/signalbar/index.js b/src/components/signalbar/index.js
new file mode 100644
index 00000000..2bb10681
--- /dev/null
+++ b/src/components/signalbar/index.js
@@ -0,0 +1,28 @@
+import { useEffect } from "preact/hooks";
+import colorScale from "simple-color-scale";
+
+import { useCommunitySettings } from "utils/queries";
+
+export const SignalBar = ({ signal, className }) => {
+ const { data: communitySettings } = useCommunitySettings();
+
+ useEffect(() => {
+ colorScale.setConfig({
+ outputStart: 1,
+ outputEnd: Number(communitySettings?.bad_signal) * -1,
+ inputStart: Number(communitySettings?.good_signal) * -1,
+ inputEnd: Number(communitySettings?.bad_signal) * -1 + 10,
+ });
+ }, [communitySettings]);
+
+ return (
+
+ );
+};
diff --git a/src/components/signalbar/style.less b/src/components/signalbar/style.less
new file mode 100644
index 00000000..ad89c5e0
--- /dev/null
+++ b/src/components/signalbar/style.less
@@ -0,0 +1,15 @@
+.bar {
+ height: 0.4rem;
+}
+
+.signal {
+ display: flex;
+ flex-direction: column;
+ margin-left: auto;
+ font-size: 4rem;
+ justify-content: center;
+}
+.unit {
+ font-size: 0.3em;
+ margin-left: 0.1em;
+}
diff --git a/src/components/status/index.js b/src/components/status/index.js
deleted file mode 100644
index f7b6fff6..00000000
--- a/src/components/status/index.js
+++ /dev/null
@@ -1,47 +0,0 @@
-import { h, Component } from 'preact';
-import style from './style';
-
-import I18n from 'i18n-js';
-
-class Status extends Component {
- goBack () {
- this.props.back(this.props.meta.base);
- }
-
- goGeneric () {
- this.props.back('thisnode.info');
- }
-
- constructor() {
- super();
- this.goBack = this.goBack.bind(this);
- this.goGeneric = this.goGeneric.bind(this);
- }
- render() {
- let isBase = (base,current) => {
- if (base !== current) {
- return ();
- }
- return;
- };
- let isError = (ws, error) => {
- if (typeof error !== 'undefined') {
- return (
-
- {I18n.t('Connection fail',{ meta_ws: this.props.meta.ws.split('/')[2] })}
- - - ); - } - return ({I18n.t('Trying to connect',{ meta_ws: this.props.meta.ws.split('/')[2] })}
); - }; - return ( -
- {isError(this.props.meta.ws.split('/')[2], this.props.meta.error) }
- {isBase(this.props.meta.base,this.props.meta.selectedHost)}
-
- );
- }
-}
-
-export default Status;
diff --git a/src/components/status/style.less b/src/components/status/style.less
deleted file mode 100644
index 5dc4aeae..00000000
--- a/src/components/status/style.less
+++ /dev/null
@@ -1,10 +0,0 @@
-.center {
- padding: 100px 20px;
- margin: 0 auto;
- text-align: center;
-};
-
-.green {
- background-color: #87d914;
- color: #fff;
-}
\ No newline at end of file
diff --git a/src/components/switch/index.js b/src/components/switch/index.js
new file mode 100644
index 00000000..0989b503
--- /dev/null
+++ b/src/components/switch/index.js
@@ -0,0 +1,3 @@
+import style from "./index.less";
+
+export default style;
diff --git a/src/components/switch/index.less b/src/components/switch/index.less
new file mode 100644
index 00000000..eb97950b
--- /dev/null
+++ b/src/components/switch/index.less
@@ -0,0 +1,78 @@
+// Copyright (c) 2021 by Adrian Roselli (https://codepen.io/aardrian/pen/RdvvXW)
+// Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:
+// The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
+// THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
+
+
+.toggles [type="checkbox"] {
+ position: absolute;
+ top: auto;
+ overflow: hidden;
+ clip: rect(1px, 1px, 1px, 1px);
+ width: 1px;
+ height: 1px;
+ white-space: nowrap;
+ }
+
+ .toggles [type="checkbox"] + label {
+ display: block;
+ position: relative;
+ padding: 0.5em;
+ padding-left: 4em;
+ max-width: calc(100% - 2em);
+ }
+
+ .toggles [type="checkbox"] + label::before,
+ .toggles [type="checkbox"] + label::after {
+ content: "";
+ position: absolute;
+ height: 1.6em; // 1.5 -> 1.6 due to skeleton.less
+ transition: all 0.25s ease;
+ }
+
+ .toggles [type="checkbox"] + label::before {
+ left: 0;
+ top: 0.2em;
+ width: 3em;
+ border: 0.2em solid #767676;
+ background: #767676;
+ border-radius: 1.1em;
+ }
+
+.toggles [type="checkbox"] + label::after {
+ left: 0;
+ top: 0.25em;
+ background-color: #fff;
+ background-position: center center;
+ border-radius: 50%;
+ width: 1.5em;
+ border: 0.15em solid #767676;
+}
+
+.toggles [type="checkbox"]:checked + label::after {
+ left: 1.6em;
+ border-color: #38927f;
+ color: #38927f;
+}
+
+.toggles [type="checkbox"]:indeterminate + label::after {
+ left: 0.8em;
+}
+
+.toggles [type="checkbox"]:indeterminate + label::before {
+ background-color: #ddd;
+}
+
+.toggles [type="checkbox"]:checked + label::before {
+ background-color: #38927f;
+ border-color: #38927f;
+}
+
+.toggles [type="checkbox"][disabled] + label::before {
+ background-color: transparent;
+ border-color: #ddd;
+}
+
+.toggles [type="checkbox"][disabled] + label::after {
+ border-color: #ddd;
+}
diff --git a/src/components/tabs/index.js b/src/components/tabs/index.js
new file mode 100644
index 00000000..22785a41
--- /dev/null
+++ b/src/components/tabs/index.js
@@ -0,0 +1,22 @@
+import style from "./style.less";
+
+const Tabs = ({ tabs, current, onChange }) => (
+
+ {tabs.map((tab) => (
+
+);
+
+export default Tabs;
diff --git a/src/components/tabs/style.less b/src/components/tabs/style.less
new file mode 100644
index 00000000..7cc4570e
--- /dev/null
+++ b/src/components/tabs/style.less
@@ -0,0 +1,25 @@
+.tabs {
+ display: flex;
+ border-bottom: 0.05em solid #38927f;
+}
+
+.tab {
+ padding: 1em;
+ cursor: pointer;
+}
+
+.tabWrapper {
+ display: flex;
+}
+
+.separator {
+ width: 0.05em;
+ height: 80%;
+ align-self: center;
+ background-color: #eaeaea;
+}
+
+.tabActive {
+ font-weight: bold;
+ box-shadow: inset 0 -0.1em 0px 0px #38927f;
+}
diff --git a/src/components/toast/index.tsx b/src/components/toast/index.tsx
new file mode 100644
index 00000000..cf72a3ea
--- /dev/null
+++ b/src/components/toast/index.tsx
@@ -0,0 +1,32 @@
+import { ComponentChildren } from "preact";
+
+import style from "./style.less";
+
+type ToastType = "success" | "error" | "info";
+
+type ToastProps = {
+ text: ComponentChildren;
+ type?: ToastType;
+ onHide?: () => void;
+};
+
+const getStyle = (type: ToastType) => {
+ switch (type) {
+ case "success":
+ return style.success;
+ case "error":
+ return style.error;
+ default:
+ return "";
+ }
+};
+
+const Toast = ({ text, type = "info", onHide }: ToastProps) => (
+
+
+ ))}
+ onChange(tab.key)}
+ >
+ {tab.repr}
+
+
+
+
+);
+
+export default Toast;
diff --git a/src/components/toast/style.less b/src/components/toast/style.less
new file mode 100644
index 00000000..849af08d
--- /dev/null
+++ b/src/components/toast/style.less
@@ -0,0 +1,25 @@
+.toastWrapper {
+ width: 100%;
+ position: fixed;
+ z-index: 99990;
+ bottom: 0px;
+ right: 0px;
+}
+
+.toast {
+ background: #000;
+ margin: 2em 2em;
+ text-align: center;
+ transition: all 250ms ease-in;
+ color: #FFF;
+ cursor: pointer;
+ padding: 0.5em;
+};
+
+.success {
+ background: #389256;
+}
+
+.error {
+ background-color: #923838;
+}
diff --git a/src/config.js b/src/config.js
deleted file mode 100644
index 72ee4cb8..00000000
--- a/src/config.js
+++ /dev/null
@@ -1,17 +0,0 @@
-import Meta from '../plugins/lime-plugin-core';
-import Align from '../plugins/lime-plugin-align';
-import Locate from '../plugins/lime-plugin-locate';
-import Metrics from '../plugins/lime-plugin-metrics';
-import Notes from '../plugins/lime-plugin-notes';
-import Rx from '../plugins/lime-plugin-rx';
-import Admin from '../plugins/lime-plugin-admin';
-// REGISTER PLUGINS
-export const plugins = [
- Rx,
- Align,
- Locate,
- Metrics,
- Notes,
- Meta,
- Admin
-];
\ No newline at end of file
diff --git a/src/config.ts b/src/config.ts
new file mode 100644
index 00000000..b4302bbd
--- /dev/null
+++ b/src/config.ts
@@ -0,0 +1,28 @@
+import Align from "plugins/lime-plugin-align";
+import ChangeNode from "plugins/lime-plugin-changeNode";
+import Fbw from "plugins/lime-plugin-fbw";
+import Firmware from "plugins/lime-plugin-firmware";
+import Locate from "plugins/lime-plugin-locate";
+import Metrics from "plugins/lime-plugin-metrics";
+import NetworkAdmin from "plugins/lime-plugin-network-admin";
+import NodeAdmin from "plugins/lime-plugin-node-admin";
+import Notes from "plugins/lime-plugin-notes";
+import Pirania from "plugins/lime-plugin-pirania";
+import RemoteSupport from "plugins/lime-plugin-remotesupport";
+import Rx from "plugins/lime-plugin-rx";
+
+// REGISTER PLUGINS
+export const plugins: LimePlugin[] = [
+ Rx,
+ Align,
+ Locate,
+ Metrics,
+ Notes,
+ NodeAdmin,
+ NetworkAdmin,
+ Firmware,
+ ChangeNode,
+ RemoteSupport,
+ Pirania,
+ Fbw, // fbw does not have menu item
+];
diff --git a/src/containers/Menu/index.js b/src/containers/Menu/index.js
new file mode 100644
index 00000000..1f577526
--- /dev/null
+++ b/src/containers/Menu/index.js
@@ -0,0 +1 @@
+export { Menu } from "./menu";
diff --git a/src/containers/Menu/menu.js b/src/containers/Menu/menu.js
new file mode 100644
index 00000000..ce6e7a4d
--- /dev/null
+++ b/src/containers/Menu/menu.js
@@ -0,0 +1,58 @@
+import { Trans } from "@lingui/macro";
+import { useState } from "preact/hooks";
+
+import { plugins } from "../../config";
+import style from "./style.less";
+
+export const Menu = ({ opened, toggle }) => {
+ const [currentView, setCurrentView] = useState("node");
+ const hasCommunityPlugins = () =>
+ plugins.filter((p) => p.menuView && p.menuView === "community").length >
+ 0;
+ function changeCurrentView(e) {
+ e.preventDefault();
+ setCurrentView(currentView === "node" ? "community" : "node");
+ }
+
+ return (
+
+ {text}
+
+
+
+ {hasCommunityPlugins() && (
+
+ )}
+
+ );
+};
diff --git a/src/containers/Menu/style.less b/src/containers/Menu/style.less
new file mode 100644
index 00000000..93dff5b8
--- /dev/null
+++ b/src/containers/Menu/style.less
@@ -0,0 +1,52 @@
+.menu {
+ height: 100vh;
+ width: 80vw;
+ background: #f5f5f5;
+ position: absolute;
+ left: 0px;
+ top: 0px;
+ -webkit-transition: 0.25s ease-in-out;
+ -moz-transition: 0.25s ease-in-out;
+ -o-transition: 0.25s ease-in-out;
+ transition: 0.25s ease-in-out;
+ box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);
+ z-index: 9999;
+ nav {
+ padding-top: 20px;
+ span {
+ padding: 0 0 5px 30px;
+ display: flex;
+ align-items: center;
+ }
+ a {
+ display: block;
+ padding: 10px 0 10px 30px;
+ font-weight: bold;
+ text-align: left;
+ text-decoration: none;
+ color: #555;
+ will-change: background-color;
+ &:hover,
+ &:active {
+ background: rgba(255, 255, 255, 0.3);
+ }
+ }
+ }
+}
+
+.menuOpened {
+ transform: translate(0, 0);
+}
+
+.menuClosed {
+ transform: translate(-100vw, 0);
+}
+
+.viewSwitchWrapper {
+ background: #38927f;
+ margin-top: auto;
+}
+
+.viewSwitch {
+ color: white !important; // need no override skeleton framework
+}
diff --git a/src/containers/RebootBanner/index.js b/src/containers/RebootBanner/index.js
new file mode 100644
index 00000000..dd25fe79
--- /dev/null
+++ b/src/containers/RebootBanner/index.js
@@ -0,0 +1 @@
+export { RebootBanner } from "./rebootBanner";
diff --git a/src/containers/RebootBanner/rebootBanner.js b/src/containers/RebootBanner/rebootBanner.js
new file mode 100644
index 00000000..5d56048c
--- /dev/null
+++ b/src/containers/RebootBanner/rebootBanner.js
@@ -0,0 +1,23 @@
+import { Trans } from "@lingui/macro";
+import { route } from "preact-router";
+import Match from "preact-router/match";
+
+export const RebootBanner = () => (
+ // @ts-ignore
+
+ A reboot is needed to apply changes
+
+
+ )
+ }
+
+
+
+
+
+ Please wait while the device reboots, and reload the app
+
+
+
+ );
+ }
+
+ return (
+
+ Rebooting
+
+
+
+
+ );
+};
+
+export default RebootPage;
diff --git a/src/containers/RebootPage/RebootPage.spec.js b/src/containers/RebootPage/RebootPage.spec.js
new file mode 100644
index 00000000..dcdb0a3c
--- /dev/null
+++ b/src/containers/RebootPage/RebootPage.spec.js
@@ -0,0 +1,84 @@
+import "@testing-library/jest-dom";
+import { fireEvent, screen } from "@testing-library/preact";
+import { route } from "preact-router";
+import waitForExpect from "wait-for-expect";
+
+import { reboot, setChangesNeedReboot } from "utils/api";
+import { render } from "utils/test_utils";
+
+import { RebootPage } from "./";
+
+jest.mock("utils/api");
+
+describe("RebootPage", () => {
+ beforeEach(() => {
+ setChangesNeedReboot.mockClear();
+ setChangesNeedReboot.mockImplementation(() => true);
+ reboot.mockClear();
+ reboot.mockImplementation(async () => null);
+ });
+
+ it("ask if user is sure of rebooting", async () => {
+ render(
+
+
+ )}
+
+
+
+
+
+
+
+ );
+};
+
+const SharedPasswordLoginHOC = () => {
+ const { mutate: login, isLoading, isError } = useLogin();
+
+ function submitLogin(password) {
+ login({ username: "root", password });
+ }
+
+ return (
+
+ {showSuCountdown && (
+
+ );
+};
+
+export default SubHeader;
diff --git a/src/containers/app.js b/src/containers/app.js
deleted file mode 100644
index 6aa7a246..00000000
--- a/src/containers/app.js
+++ /dev/null
@@ -1,99 +0,0 @@
-import { h, Component } from 'preact';
-import Router from 'preact-router';
-
-import style from './style';
-
-import { bindActionCreators } from 'redux';
-import { connect } from 'preact-redux';
-
-import Header from '../components/header';
-import Alert from '../components/alert';
-import Status from '../components/status';
-import { plugins } from '../config';
-
-class ChangeNode extends Component {
- componentWillMount () {
- this.props.change(this.props.hostname);
- }
-}
-
-
-class App extends Component {
- render({ store,history }) {
- const isConnected = (meta) => {
- if (meta.sid !== '00000000000000000000000000000000' && meta.stauts !== 'start' ) {
- return (
-
-
-
-
- );
- }
- return (
-
-
- );
- };
-
- /* Ignore for now */
- const isBase = (meta) => {
- if (meta.selectedHost !== meta.base && meta.sid !== 'no_user' && meta.stauts !== 'start') {
- return { minWidth: '100%' };
- }
- return { minWidth: '100%' };
- };
-
-
- return (
-
-
- );
- }
-}
-
-
-const mapStateToProps = (state) => ({ meta: state.meta });
-
-const goBase = (hostname) => (dispatch) => {
- dispatch({
- type: 'meta/CONECTION_CHANGE_URL',
- payload: 'http://thisnode.info/ubus'
- });
-};
-
-const hideAlert = () => (dispatch) => {
- dispatch({
- type: 'NOTIFICATION_HIDE'
- });
-};
-
-const changeNode = (hostname) => (dispatch) => {
- dispatch({
- type: 'meta/CONECTION_CHANGE_URL',
- payload: 'http://'+ hostname +'/ubus'
- });
- dispatch({
- type: 'meta/CONECTION_CHANGE_CURRENT_BASE',
- payload: hostname
- });
-};
-
-const mapDispatchToProps = (dispatch) => ({
- goBase: bindActionCreators(goBase, dispatch),
- changeNode: bindActionCreators(changeNode, dispatch),
- hideAlert: bindActionCreators(hideAlert, dispatch)
-});
-
-
-export default connect(mapStateToProps, mapDispatchToProps)(App);
\ No newline at end of file
diff --git a/src/containers/style.less b/src/containers/style.less
deleted file mode 100644
index 90b12d8a..00000000
--- a/src/containers/style.less
+++ /dev/null
@@ -1,2 +0,0 @@
-.wraper {
-};
\ No newline at end of file
diff --git a/src/i18n.ts b/src/i18n.ts
new file mode 100644
index 00000000..e7ede5d3
--- /dev/null
+++ b/src/i18n.ts
@@ -0,0 +1,27 @@
+import { i18n } from "@lingui/core";
+import {
+ en as enPlurals,
+ es as esPlurals,
+ pt as ptPlurals,
+} from "make-plural/plurals";
+
+export async function dynamicActivate(locale: Locales) {
+ let catalog;
+ try {
+ catalog = await import(`@lingui/loader!../i18n/${locale}/messages.po`);
+ } catch (e) {
+ // This will fail only during test, due to webpack config, which is expected
+ catalog = { messages: {} };
+ }
+
+ i18n.load(locale, catalog.messages);
+ i18n.activate(locale);
+}
+
+i18n.loadLocaleData({
+ en: { plurals: enPlurals },
+ es: { plurals: esPlurals },
+ pt: { plurals: ptPlurals },
+});
+
+export default i18n;
diff --git a/src/i18nline-glue.js b/src/i18nline-glue.js
deleted file mode 100644
index ea9d4d3d..00000000
--- a/src/i18nline-glue.js
+++ /dev/null
@@ -1,18 +0,0 @@
-const extend = require('extend');
-const I18n = require('i18n-js');
-I18n.locale = navigator.language.split('-')[0];
-require('i18nline/lib/extensions/i18n_js')(I18n);
-require('preact-i18nline/dist/extensions/i18n_js')(I18n);
-
-let translationsTotal = {};
-
-const translationFiles = require.context('../i18n/translations', true, /\.json$/);
-translationFiles.keys().forEach((key) => {
- let translation = {};
- translation[key.substring(2).slice(0,-5)] = translationFiles(key);
- extend(true, translationsTotal, translation );
-});
-
-extend(true, I18n, { translations: translationsTotal });
-
-window.I18n = I18n;
\ No newline at end of file
diff --git a/src/index.ejs b/src/index.ejs
deleted file mode 100644
index 2f111404..00000000
--- a/src/index.ejs
+++ /dev/null
@@ -1,26 +0,0 @@
-
-
-
- <% for (var chunk in htmlWebpackPlugin.files.css) { %>
-
- <% } %>
- <% for (var chunk in htmlWebpackPlugin.files.chunks) { %>
-
- <% } %>
-
-
+ {args.body}
+
+);
+BasicBox.args = {
+ title: "Some title",
+ body: "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.",
+};
diff --git a/stories/components/collapsible.stories.js b/stories/components/collapsible.stories.js
new file mode 100644
index 00000000..99f1bbc6
--- /dev/null
+++ b/stories/components/collapsible.stories.js
@@ -0,0 +1,39 @@
+import { Collapsible } from "components/collapsible";
+
+export default {
+ title: "Collapsible",
+};
+
+const Content = () => (
+ + Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod + tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim + veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea + commodo consequat. Duis aute irure dolor in reprehenderit in voluptate + velit esse cillum dolore eu fugiat nulla pariatur. +
+); + +export const Collapsed = (args) => ( +
+
+
+
+);
+Collapsed.args = {
+ title: "Some Title",
+ initCollapsed: true,
+};
+
+export const NonCollapsed = (args) => (
+
+
+
+
+);
+NonCollapsed.args = {
+ title: "Some Title",
+ initCollapsed: false,
+};
diff --git a/stories/components/header.stories.js b/stories/components/header.stories.js
new file mode 100644
index 00000000..e15c89c7
--- /dev/null
+++ b/stories/components/header.stories.js
@@ -0,0 +1,28 @@
+import { Header } from "components/header";
+
+import { Menu } from "containers/Menu";
+
+import { AppContext } from "utils/app.context";
+
+export default {
+ title: "Header",
+ component: Header,
+};
+
+export const WithMenuDisabled = (args) => (
+