mirror
/
meshastic.web
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

Add handling for remaining config tabs

pull/110/head
Malte Grimm 3 years ago
parent
f4bef9946e
commit
d7bc49c9e0
9 changed files with 276 additions and 140 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 54
      src/components/PageComponents/Config/Bluetooth.tsx
  2. 16
      src/components/PageComponents/Config/Device.tsx
  3. 55
      src/components/PageComponents/Config/Display.tsx
  4. 54
      src/components/PageComponents/Config/LoRa.tsx
  5. 59
      src/components/PageComponents/Config/Network.tsx
  6. 52
      src/components/PageComponents/Config/Position.tsx
  7. 54
      src/components/PageComponents/Config/Power.tsx
  8. 33
      src/core/stores/appStore.ts
  9. 21
      src/core/stores/deviceStore.ts

54
src/components/PageComponents/Config/Bluetooth.tsx
View File

@ -1,27 +1,49 @@
import type { BluetoothValidation } from "@app/validation/config/bluetooth.js"; import type { ConfigPreset } from '@app/core/stores/appStore';
import { useConfig, useDevice } from "@core/stores/deviceStore.js"; import type { BluetoothValidation } from '@app/validation/config/bluetooth.js';
import { Protobuf } from "@meshtastic/meshtasticjs"; import {
import { DynamicForm } from "@components/Form/DynamicForm.js"; DynamicForm,
EnableSwitchData,
} from '@components/Form/DynamicForm.js';
import {
useConfig,
useDevice,
} from '@core/stores/deviceStore.js';
import { Protobuf } from '@meshtastic/meshtasticjs';
export const Bluetooth = (): JSX.Element => { export const Bluetooth = (): JSX.Element => {
// const { config, setWorkingConfig } = useDevice();
const config = useConfig(); const config = useConfig();
const enableSwitch: EnableSwitchData | undefined = config.overrideValues ? {
getEnabled(name) {
return config.overrideValues![name] ?? false;
},
setEnabled(name, value) {
config.overrideValues![name] = value;
},
} : undefined;
const isPresetConfig = !("id" in config);
const setConfig: (data: BluetoothValidation) => void =
isPresetConfig ? (data) => {
config.config.bluetooth = new Protobuf.Config_BluetoothConfig(data);
(config as ConfigPreset).saveConfigTree();
}
: (data) => {
useDevice().setWorkingConfig!(
new Protobuf.Config({
payloadVariant: {
case: "bluetooth",
value: data
}
})
);
}
const onSubmit = (data: BluetoothValidation) => { const onSubmit = setConfig;
// setWorkingConfig(
// new Protobuf.Config({
// payloadVariant: {
// case: "bluetooth",
// value: data
// }
// })
// );
};
return ( return (
<DynamicForm<BluetoothValidation> <DynamicForm<BluetoothValidation>
onSubmit={onSubmit} onSubmit={onSubmit}
defaultValues={config.bluetooth} defaultValues={config.config.bluetooth}
enableSwitch={enableSwitch}
fieldGroups={[ fieldGroups={[
{ {
label: "Bluetooth Settings", label: "Bluetooth Settings",

16
src/components/PageComponents/Config/Device.tsx
View File

@ -11,7 +11,6 @@ import {
import { Protobuf } from '@meshtastic/meshtasticjs'; import { Protobuf } from '@meshtastic/meshtasticjs';
export const Device = (): JSX.Element => { export const Device = (): JSX.Element => {
//const { config, setWorkingConfig } = useDevice();
const config = useConfig(); const config = useConfig();
const enableSwitch: EnableSwitchData | undefined = config.overrideValues ? { const enableSwitch: EnableSwitchData | undefined = config.overrideValues ? {
getEnabled(name) { getEnabled(name) {
@ -21,16 +20,14 @@ export const Device = (): JSX.Element => {
config.overrideValues![name] = value; config.overrideValues![name] = value;
}, },
} : undefined; } : undefined;
const isPresetConfig = !("id" in config); // Kinda hacky... const isPresetConfig = !("id" in config);
const { setWorkingConfig } = isPresetConfig ? { setWorkingConfig: undefined } : useDevice(); const setConfig: (data: DeviceValidation) => void =
isPresetConfig ? (data) => {
const onSubmit = (data: DeviceValidation) => {
if(isPresetConfig) {
config.config.device = new Protobuf.Config_DeviceConfig(data); config.config.device = new Protobuf.Config_DeviceConfig(data);
(config as ConfigPreset).saveConfigTree(); (config as ConfigPreset).saveConfigTree();
} }
else { : (data) => {
setWorkingConfig!( useDevice().setWorkingConfig!(
new Protobuf.Config({ new Protobuf.Config({
payloadVariant: { payloadVariant: {
case: "device", case: "device",
@ -39,7 +36,8 @@ export const Device = (): JSX.Element => {
}) })
); );
} }
};
const onSubmit = setConfig;
return ( return (
<DynamicForm<DeviceValidation> <DynamicForm<DeviceValidation>

55
src/components/PageComponents/Config/Display.tsx
View File

@ -1,27 +1,50 @@
import type { DisplayValidation } from "@app/validation/config/display.js"; import type { ConfigPreset } from '@app/core/stores/appStore';
import { useConfig, useDevice } from "@core/stores/deviceStore.js"; import type { DisplayValidation } from '@app/validation/config/display.js';
import { Protobuf } from "@meshtastic/meshtasticjs"; import {
import { DynamicForm } from "@components/Form/DynamicForm.js"; DynamicForm,
EnableSwitchData,
} from '@components/Form/DynamicForm.js';
import {
useConfig,
useDevice,
} from '@core/stores/deviceStore.js';
import { Protobuf } from '@meshtastic/meshtasticjs';
export const Display = (): JSX.Element => { export const Display = (): JSX.Element => {
// const { config, setWorkingConfig } = useDevice();
const config = useConfig(); const config = useConfig();
const enableSwitch: EnableSwitchData | undefined = config.overrideValues ? {
getEnabled(name) {
return config.overrideValues![name] ?? false;
},
setEnabled(name, value) {
config.overrideValues![name] = value;
},
} : undefined;
const isPresetConfig = !("id" in config);
const setConfig: (data: DisplayValidation) => void =
isPresetConfig ? (data) => {
config.config.display = new Protobuf.Config_DisplayConfig(data);
debugger;
(config as ConfigPreset).saveConfigTree();
}
: (data) => {
useDevice().setWorkingConfig!(
new Protobuf.Config({
payloadVariant: {
case: "display",
value: data
}
})
);
}
const onSubmit = (data: DisplayValidation) => { const onSubmit = setConfig;
// setWorkingConfig(
// new Protobuf.Config({
// payloadVariant: {
// case: "display",
// value: data
// }
// })
// );
};
return ( return (
<DynamicForm<DisplayValidation> <DynamicForm<DisplayValidation>
onSubmit={onSubmit} onSubmit={onSubmit}
defaultValues={config.display} defaultValues={config.config.display}
enableSwitch={enableSwitch}
fieldGroups={[ fieldGroups={[
{ {
label: "Display Settings", label: "Display Settings",

54
src/components/PageComponents/Config/LoRa.tsx
View File

@ -1,27 +1,49 @@
import type { LoRaValidation } from "@app/validation/config/lora.js"; import type { ConfigPreset } from '@app/core/stores/appStore';
import { useConfig, useDevice } from "@core/stores/deviceStore.js"; import type { LoRaValidation } from '@app/validation/config/lora.js';
import { Protobuf } from "@meshtastic/meshtasticjs"; import {
import { DynamicForm } from "@components/Form/DynamicForm.js"; DynamicForm,
EnableSwitchData,
} from '@components/Form/DynamicForm.js';
import {
useConfig,
useDevice,
} from '@core/stores/deviceStore.js';
import { Protobuf } from '@meshtastic/meshtasticjs';
export const LoRa = (): JSX.Element => { export const LoRa = (): JSX.Element => {
// const { config, setWorkingConfig } = useDevice();
const config = useConfig(); const config = useConfig();
const enableSwitch: EnableSwitchData | undefined = config.overrideValues ? {
getEnabled(name) {
return config.overrideValues![name] ?? false;
},
setEnabled(name, value) {
config.overrideValues![name] = value;
},
} : undefined;
const isPresetConfig = !("id" in config);
const setConfig: (data: LoRaValidation) => void =
isPresetConfig ? (data) => {
config.config.lora = new Protobuf.Config_LoRaConfig(data);
(config as ConfigPreset).saveConfigTree();
}
: (data) => {
useDevice().setWorkingConfig!(
new Protobuf.Config({
payloadVariant: {
case: "lora",
value: data
}
})
);
}
const onSubmit = (data: LoRaValidation) => { const onSubmit = setConfig;
// setWorkingConfig(
// new Protobuf.Config({
// payloadVariant: {
// case: "lora",
// value: data
// }
// })
// );
};
return ( return (
<DynamicForm<LoRaValidation> <DynamicForm<LoRaValidation>
onSubmit={onSubmit} onSubmit={onSubmit}
defaultValues={config.lora} defaultValues={config.config.lora}
enableSwitch={enableSwitch}
fieldGroups={[ fieldGroups={[
{ {
label: "Mesh Settings", label: "Mesh Settings",

59
src/components/PageComponents/Config/Network.tsx
View File

@ -1,32 +1,49 @@
import type { NetworkValidation } from "@app/validation/config/network.js"; import type { ConfigPreset } from '@app/core/stores/appStore';
import { useConfig, useDevice } from "@core/stores/deviceStore.js"; import type { NetworkValidation } from '@app/validation/config/network.js';
import { Protobuf } from "@meshtastic/meshtasticjs"; import {
import { DynamicForm } from "@components/Form/DynamicForm.js"; DynamicForm,
EnableSwitchData,
} from '@components/Form/DynamicForm.js';
import {
useConfig,
useDevice,
} from '@core/stores/deviceStore.js';
import { Protobuf } from '@meshtastic/meshtasticjs';
export const Network = (): JSX.Element => { export const Network = (): JSX.Element => {
// const { config, setWorkingConfig } = useDevice();
const config = useConfig(); const config = useConfig();
const enableSwitch: EnableSwitchData | undefined = config.overrideValues ? {
getEnabled(name) {
return config.overrideValues![name] ?? false;
},
setEnabled(name, value) {
config.overrideValues![name] = value;
},
} : undefined;
const isPresetConfig = !("id" in config);
const setConfig: (data: NetworkValidation) => void =
isPresetConfig ? (data) => {
config.config.network = new Protobuf.Config_NetworkConfig(data);
(config as ConfigPreset).saveConfigTree();
}
: (data) => {
useDevice().setWorkingConfig!(
new Protobuf.Config({
payloadVariant: {
case: "network",
value: data
}
})
);
}
const onSubmit = (data: NetworkValidation) => { const onSubmit = setConfig;
// setWorkingConfig(
// new Protobuf.Config({
// payloadVariant: {
// case: "network",
// value: {
// ...data,
// ipv4Config: new Protobuf.Config_NetworkConfig_IpV4Config(
// data.ipv4Config
// )
// }
// }
// })
// );
};
return ( return (
<DynamicForm<NetworkValidation> <DynamicForm<NetworkValidation>
onSubmit={onSubmit} onSubmit={onSubmit}
defaultValues={config.network} defaultValues={config.config.network}
enableSwitch={enableSwitch}
fieldGroups={[ fieldGroups={[
{ {
label: "WiFi Config", label: "WiFi Config",

52
src/components/PageComponents/Config/Position.tsx
View File

@ -1,27 +1,49 @@
import type { PositionValidation } from "@app/validation/config/position.js"; import type { ConfigPreset } from '@app/core/stores/appStore';
import { useConfig, useDevice } from "@core/stores/deviceStore.js"; import type { PositionValidation } from '@app/validation/config/position.js';
import { Protobuf } from "@meshtastic/meshtasticjs"; import {
import { DynamicForm } from "@components/Form/DynamicForm.js"; DynamicForm,
EnableSwitchData,
} from '@components/Form/DynamicForm.js';
import {
useConfig,
useDevice,
} from '@core/stores/deviceStore.js';
import { Protobuf } from '@meshtastic/meshtasticjs';
export const Position = (): JSX.Element => { export const Position = (): JSX.Element => {
// const { config, nodes, hardware, setWorkingConfig } = useDevice();
const config = useConfig(); const config = useConfig();
const enableSwitch: EnableSwitchData | undefined = config.overrideValues ? {
getEnabled(name) {
return config.overrideValues![name] ?? false;
},
setEnabled(name, value) {
config.overrideValues![name] = value;
},
} : undefined;
const isPresetConfig = !("id" in config);
const setConfig: (data: PositionValidation) => void =
isPresetConfig ? (data) => {
config.config.position = new Protobuf.Config_PositionConfig(data);
(config as ConfigPreset).saveConfigTree();
}
: (data) => {
useDevice().setWorkingConfig!(
new Protobuf.Config({
payloadVariant: {
case: "position",
value: data
}
})
);
}
const onSubmit = (data: PositionValidation) => { const onSubmit = setConfig;
// setWorkingConfig(
// new Protobuf.Config({
// payloadVariant: {
// case: "position",
// value: data
// }
// })
// );
};
return ( return (
<DynamicForm<PositionValidation> <DynamicForm<PositionValidation>
onSubmit={onSubmit} onSubmit={onSubmit}
defaultValues={config.config.position} defaultValues={config.config.position}
enableSwitch={enableSwitch}
fieldGroups={[ fieldGroups={[
{ {
label: "Position settings", label: "Position settings",

54
src/components/PageComponents/Config/Power.tsx
View File

@ -1,27 +1,49 @@
import type { PowerValidation } from "@app/validation/config/power.js"; import type { ConfigPreset } from '@app/core/stores/appStore';
import { useConfig, useDevice } from "@core/stores/deviceStore.js"; import type { PowerValidation } from '@app/validation/config/power.js';
import { Protobuf } from "@meshtastic/meshtasticjs"; import {
import { DynamicForm } from "@components/Form/DynamicForm.js"; DynamicForm,
EnableSwitchData,
} from '@components/Form/DynamicForm.js';
import {
useConfig,
useDevice,
} from '@core/stores/deviceStore.js';
import { Protobuf } from '@meshtastic/meshtasticjs';
export const Power = (): JSX.Element => { export const Power = (): JSX.Element => {
// const { config, setWorkingConfig } = useDevice();
const config = useConfig(); const config = useConfig();
const enableSwitch: EnableSwitchData | undefined = config.overrideValues ? {
getEnabled(name) {
return config.overrideValues![name] ?? false;
},
setEnabled(name, value) {
config.overrideValues![name] = value;
},
} : undefined;
const isPresetConfig = !("id" in config);
const setConfig: (data: PowerValidation) => void =
isPresetConfig ? (data) => {
config.config.power = new Protobuf.Config_PowerConfig(data);
(config as ConfigPreset).saveConfigTree();
}
: (data) => {
useDevice().setWorkingConfig!(
new Protobuf.Config({
payloadVariant: {
case: "power",
value: data
}
})
);
}
const onSubmit = (data: PowerValidation) => { const onSubmit = setConfig;
// setWorkingConfig(
// new Protobuf.Config({
// payloadVariant: {
// case: "power",
// value: data
// }
// })
// );
};
return ( return (
<DynamicForm<PowerValidation> <DynamicForm<PowerValidation>
onSubmit={onSubmit} onSubmit={onSubmit}
defaultValues={config.power} defaultValues={config.config.power}
enableSwitch={enableSwitch}
fieldGroups={[ fieldGroups={[
{ {
label: "Power Config", label: "Power Config",

33
src/core/stores/appStore.ts
View File

@ -23,29 +23,16 @@ export type accentColor =
| "pink"; | "pink";
export class ConfigPreset { export class ConfigPreset {
public children: ConfigPreset[] = []; public children: ConfigPreset[] = [];
public count: number = 0; public count: number = 0;
public overrideValues: {[fieldName: string]: boolean}; public overrideValues: {[fieldName: string]: boolean};
public constructor(public name: string, public parent?: ConfigPreset, public config : Protobuf.LocalConfig = new Protobuf.LocalConfig()) { public constructor(public name: string, public parent?: ConfigPreset, public config = ConfigPreset.createDefaultConfig()) {
if(parent) { if(parent) {
// Root config should not be overridable // Root config should not be overridable
this.overrideValues = {}; this.overrideValues = {};
} }
if(config.device === undefined)
config.device = new Protobuf.Config_DeviceConfig();
if(config.position === undefined)
config.position = new Protobuf.Config_PositionConfig();
if(config.power === undefined)
config.power = new Protobuf.Config_PowerConfig();
if(config.network === undefined)
config.network = new Protobuf.Config_NetworkConfig();
if(config.display === undefined)
config.display = new Protobuf.Config_DisplayConfig();
if(config.lora === undefined)
config.lora = new Protobuf.Config_LoRaConfig();
if(config.bluetooth === undefined)
config.bluetooth = new Protobuf.Config_BluetoothConfig();
} }
public saveConfigTree() { public saveConfigTree() {
@ -143,6 +130,7 @@ export class ConfigPreset {
public static loadOrCreate(): ConfigPreset { public static loadOrCreate(): ConfigPreset {
const storedConfigs = localStorage.getItem("PresetConfigs"); const storedConfigs = localStorage.getItem("PresetConfigs");
debugger;
if(storedConfigs !== null) { if(storedConfigs !== null) {
const rootPreset = this.tryFromJson(storedConfigs); const rootPreset = this.tryFromJson(storedConfigs);
if(rootPreset !== undefined) if(rootPreset !== undefined)
@ -175,6 +163,21 @@ export class ConfigPreset {
}); });
} }
private static createDefaultConfig(): Protobuf.LocalConfig {
return new Protobuf.LocalConfig({
device: new Protobuf.Config_DeviceConfig({
serialEnabled: true,
nodeInfoBroadcastSecs: 10800
}),
position: new Protobuf.Config_PositionConfig({ }),
power: new Protobuf.Config_PowerConfig({ }),
network: new Protobuf.Config_NetworkConfig({ }),
display: new Protobuf.Config_DisplayConfig({ }),
lora: new Protobuf.Config_LoRaConfig({ }),
bluetooth: new Protobuf.Config_BluetoothConfig({ }),
});
}
} }
function loadFirmwareListFromStorage(): FirmwareVersion[] { function loadFirmwareListFromStorage(): FirmwareVersion[] {

21
src/core/stores/deviceStore.ts
View File

@ -1,12 +1,18 @@
import { createContext, useContext } from "react"; import {
createContext,
useContext,
} from 'react';
import { produce } from "immer"; import { produce } from 'immer';
import { create } from "zustand"; import { create } from 'zustand';
import { Protobuf, Types } from "@meshtastic/meshtasticjs"; import {
import { channel } from "diagnostics_channel"; Protobuf,
import { useAppStore } from "./appStore"; Types,
import type { FlashState } from "../flashing/Flasher"; } from '@meshtastic/meshtasticjs';
import type { FlashState } from '../flashing/Flasher';
import { useAppStore } from './appStore';
export type Page = "messages" | "map" | "config" | "channels" | "peers"; export type Page = "messages" | "map" | "config" | "channels" | "peers";
@ -605,6 +611,7 @@ export const useConfig = (): ConfigProvider => {
const context = useContext(DeviceContext); const context = useContext(DeviceContext);
if(context == undefined) { if(context == undefined) {
const {configPresetRoot, configPresetSelected } = useAppStore(); const {configPresetRoot, configPresetSelected } = useAppStore();
debugger;
if(configPresetSelected) { if(configPresetSelected) {
console.log(`Displaying selected preset: ${configPresetSelected.name} (${configPresetSelected.config.device?.buttonGpio})`); console.log(`Displaying selected preset: ${configPresetSelected.name} (${configPresetSelected.config.device?.buttonGpio})`);
console.log(`Identical? ${configPresetSelected.config == configPresetRoot.config}`); console.log(`Identical? ${configPresetSelected.config == configPresetRoot.config}`);

Write Preview
Loading…
Cancel
Save