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
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 56
      src/components/PageComponents/Config/Bluetooth.tsx
  2. 20
      src/components/PageComponents/Config/Device.tsx
  3. 57
      src/components/PageComponents/Config/Display.tsx
  4. 56
      src/components/PageComponents/Config/LoRa.tsx
  5. 61
      src/components/PageComponents/Config/Network.tsx
  6. 54
      src/components/PageComponents/Config/Position.tsx
  7. 56
      src/components/PageComponents/Config/Power.tsx
  8. 35
      src/core/stores/appStore.ts
  9. 21
      src/core/stores/deviceStore.ts

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

@ -1,27 +1,49 @@
import type { BluetoothValidation } from "@app/validation/config/bluetooth.js";
import { useConfig, useDevice } from "@core/stores/deviceStore.js";
import { Protobuf } from "@meshtastic/meshtasticjs";
import { DynamicForm } from "@components/Form/DynamicForm.js";
import type { ConfigPreset } from '@app/core/stores/appStore';
import type { BluetoothValidation } from '@app/validation/config/bluetooth.js';
import {
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 => {
// 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) => {
// setWorkingConfig(
// new Protobuf.Config({
// payloadVariant: {
// case: "bluetooth",
// value: data
// }
// })
// );
};
const onSubmit = setConfig;
return (
<DynamicForm<BluetoothValidation>
onSubmit={onSubmit}
defaultValues={config.bluetooth}
defaultValues={config.config.bluetooth}
enableSwitch={enableSwitch}
fieldGroups={[
{
label: "Bluetooth Settings",

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

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

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

@ -1,27 +1,50 @@
import type { DisplayValidation } from "@app/validation/config/display.js";
import { useConfig, useDevice } from "@core/stores/deviceStore.js";
import { Protobuf } from "@meshtastic/meshtasticjs";
import { DynamicForm } from "@components/Form/DynamicForm.js";
import type { ConfigPreset } from '@app/core/stores/appStore';
import type { DisplayValidation } from '@app/validation/config/display.js';
import {
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 => {
// 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) => {
// setWorkingConfig(
// new Protobuf.Config({
// payloadVariant: {
// case: "display",
// value: data
// }
// })
// );
};
const onSubmit = setConfig;
return (
<DynamicForm<DisplayValidation>
onSubmit={onSubmit}
defaultValues={config.display}
defaultValues={config.config.display}
enableSwitch={enableSwitch}
fieldGroups={[
{
label: "Display Settings",

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

@ -1,27 +1,49 @@
import type { LoRaValidation } from "@app/validation/config/lora.js";
import { useConfig, useDevice } from "@core/stores/deviceStore.js";
import { Protobuf } from "@meshtastic/meshtasticjs";
import { DynamicForm } from "@components/Form/DynamicForm.js";
import type { ConfigPreset } from '@app/core/stores/appStore';
import type { LoRaValidation } from '@app/validation/config/lora.js';
import {
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 => {
// 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) => {
// setWorkingConfig(
// new Protobuf.Config({
// payloadVariant: {
// case: "lora",
// value: data
// }
// })
// );
};
const onSubmit = setConfig;
return (
<DynamicForm<LoRaValidation>
onSubmit={onSubmit}
defaultValues={config.lora}
defaultValues={config.config.lora}
enableSwitch={enableSwitch}
fieldGroups={[
{
label: "Mesh Settings",

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

@ -1,32 +1,49 @@
import type { NetworkValidation } from "@app/validation/config/network.js";
import { useConfig, useDevice } from "@core/stores/deviceStore.js";
import { Protobuf } from "@meshtastic/meshtasticjs";
import { DynamicForm } from "@components/Form/DynamicForm.js";
import type { ConfigPreset } from '@app/core/stores/appStore';
import type { NetworkValidation } from '@app/validation/config/network.js';
import {
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 => {
// 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) => {
// setWorkingConfig(
// new Protobuf.Config({
// payloadVariant: {
// case: "network",
// value: {
// ...data,
// ipv4Config: new Protobuf.Config_NetworkConfig_IpV4Config(
// data.ipv4Config
// )
// }
// }
// })
// );
};
const onSubmit = setConfig;
return (
<DynamicForm<NetworkValidation>
onSubmit={onSubmit}
defaultValues={config.network}
defaultValues={config.config.network}
enableSwitch={enableSwitch}
fieldGroups={[
{
label: "WiFi Config",

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

@ -1,27 +1,49 @@
import type { PositionValidation } from "@app/validation/config/position.js";
import { useConfig, useDevice } from "@core/stores/deviceStore.js";
import { Protobuf } from "@meshtastic/meshtasticjs";
import { DynamicForm } from "@components/Form/DynamicForm.js";
import type { ConfigPreset } from '@app/core/stores/appStore';
import type { PositionValidation } from '@app/validation/config/position.js';
import {
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 => {
// 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) => {
// setWorkingConfig(
// new Protobuf.Config({
// payloadVariant: {
// case: "position",
// value: data
// }
// })
// );
};
const onSubmit = setConfig;
return (
<DynamicForm<PositionValidation>
onSubmit={onSubmit}
defaultValues={config.config.position}
enableSwitch={enableSwitch}
fieldGroups={[
{
label: "Position settings",

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

@ -1,27 +1,49 @@
import type { PowerValidation } from "@app/validation/config/power.js";
import { useConfig, useDevice } from "@core/stores/deviceStore.js";
import { Protobuf } from "@meshtastic/meshtasticjs";
import { DynamicForm } from "@components/Form/DynamicForm.js";
import type { ConfigPreset } from '@app/core/stores/appStore';
import type { PowerValidation } from '@app/validation/config/power.js';
import {
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 => {
// 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) => {
// setWorkingConfig(
// new Protobuf.Config({
// payloadVariant: {
// case: "power",
// value: data
// }
// })
// );
};
const onSubmit = setConfig;
return (
<DynamicForm<PowerValidation>
onSubmit={onSubmit}
defaultValues={config.power}
defaultValues={config.config.power}
enableSwitch={enableSwitch}
fieldGroups={[
{
label: "Power Config",

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

@ -23,29 +23,16 @@ export type accentColor =
| "pink";
export class ConfigPreset {
public children: ConfigPreset[] = [];
public count: number = 0;
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) {
// Root config should not be overridable
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() {
@ -143,6 +130,7 @@ export class ConfigPreset {
public static loadOrCreate(): ConfigPreset {
const storedConfigs = localStorage.getItem("PresetConfigs");
debugger;
if(storedConfigs !== null) {
const rootPreset = this.tryFromJson(storedConfigs);
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[] {

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

Write Preview
Loading…
Cancel
Save