From 842d8aa31d5952fec7e71f684957c3a153790982 Mon Sep 17 00:00:00 2001 From: Sacha Weatherstone Date: Wed, 16 Jun 2021 12:28:14 +1000 Subject: [PATCH] Fix changing settings. --- package.json | 1 - src/Main.tsx | 1 + src/components/Sidebar.tsx | 9 ++++++++- src/components/Sidebar/Device/Index.tsx | 13 ++++++++++-- src/components/Sidebar/Device/Settings.tsx | 23 +++++++++++++++++----- yarn.lock | 9 +-------- 6 files changed, 39 insertions(+), 17 deletions(-) diff --git a/package.json b/package.json index 20a1ab70..1acd0d04 100644 --- a/package.json +++ b/package.json @@ -20,7 +20,6 @@ "react-dom": "^18.0.0-alpha-dbe3363cc", "react-flags-select": "^2.1.2", "react-hook-form": "^7.8.6", - "react-json-pretty": "^2.2.0", "rxjs": "^7.1.0" }, "devDependencies": { diff --git a/src/Main.tsx b/src/Main.tsx index 49312b92..c413c2bd 100644 --- a/src/Main.tsx +++ b/src/Main.tsx @@ -95,6 +95,7 @@ const Main = (props: MainProps): JSX.Element => { sidebarOpen={sidebarOpen} darkmode={props.darkmode} setDarkmode={props.setDarkmode} + connection={props.connection} /> diff --git a/src/components/Sidebar.tsx b/src/components/Sidebar.tsx index e4a1a4f0..eaf83a43 100644 --- a/src/components/Sidebar.tsx +++ b/src/components/Sidebar.tsx @@ -1,5 +1,11 @@ import React from 'react'; +import type { + IBLEConnection, + IHTTPConnection, + ISerialConnection, +} from '@meshtastic/meshtasticjs'; + import Channels from './Sidebar/Channels/Index'; import Device from './Sidebar/Device/Index'; import Nodes from './Sidebar/Nodes/Index'; @@ -10,6 +16,7 @@ interface SidebarProps { sidebarOpen: boolean; darkmode: boolean; setDarkmode: React.Dispatch>; + connection: ISerialConnection | IHTTPConnection | IBLEConnection; } const Sidebar = (props: SidebarProps): JSX.Element => { @@ -20,7 +27,7 @@ const Sidebar = (props: SidebarProps): JSX.Element => { } flex-col rounded-md md:ml-0 shadow-md border w-full max-w-sm`} > - +
diff --git a/src/components/Sidebar/Device/Index.tsx b/src/components/Sidebar/Device/Index.tsx index 0890b73a..f4f1d549 100644 --- a/src/components/Sidebar/Device/Index.tsx +++ b/src/components/Sidebar/Device/Index.tsx @@ -6,11 +6,20 @@ import { ChevronDownIcon, ChevronRightIcon, } from '@heroicons/react/outline'; +import type { + IBLEConnection, + IHTTPConnection, + ISerialConnection, +} from '@meshtastic/meshtasticjs'; import { TranslationsContext } from '../../../translations/TranslationsContext'; import Settings from './Settings'; -const Device = (): JSX.Element => { +interface DeviceProps { + connection: ISerialConnection | IHTTPConnection | IBLEConnection; +} + +const Device = (props: DeviceProps): JSX.Element => { const { translations } = React.useContext(TranslationsContext); return ( @@ -36,7 +45,7 @@ const Device = (): JSX.Element => { } > - + diff --git a/src/components/Sidebar/Device/Settings.tsx b/src/components/Sidebar/Device/Settings.tsx index 7500494b..d1fa9cd7 100644 --- a/src/components/Sidebar/Device/Settings.tsx +++ b/src/components/Sidebar/Device/Settings.tsx @@ -2,15 +2,23 @@ import React from 'react'; import { useObservableSuspense } from 'observable-hooks'; import { useForm } from 'react-hook-form'; -import JSONPretty from 'react-json-pretty'; import { SaveIcon } from '@heroicons/react/outline'; +import type { + IBLEConnection, + IHTTPConnection, + ISerialConnection, +} from '@meshtastic/meshtasticjs'; import { Protobuf } from '@meshtastic/meshtasticjs'; import { preferencesResource } from '../../../streams'; import { TranslationsContext } from '../../../translations/TranslationsContext'; -const Settings = (): JSX.Element => { +interface SettingsProps { + connection: ISerialConnection | IHTTPConnection | IBLEConnection; +} + +const Settings = (props: SettingsProps): JSX.Element => { const { translations } = React.useContext(TranslationsContext); const preferences = useObservableSuspense(preferencesResource); @@ -19,13 +27,19 @@ const Settings = (): JSX.Element => { defaultValues: preferences, }); - const onSubmit = handleSubmit((data) => console.log(data)); + const onSubmit = handleSubmit((data) => + props.connection.setPreferences(data), + ); return (
{translations.device_region_title}
- @@ -77,7 +91,6 @@ const Settings = (): JSX.Element => { {translations.save_changes_button}
- ); }; diff --git a/yarn.lock b/yarn.lock index e63ffa44..a5fbad1a 100644 --- a/yarn.lock +++ b/yarn.lock @@ -3242,7 +3242,7 @@ promise-retry@^2.0.1: err-code "^2.0.2" retry "^0.12.0" -prop-types@^15.6.2, prop-types@^15.7.2: +prop-types@^15.7.2: version "15.7.2" resolved "https://registry.yarnpkg.com/prop-types/-/prop-types-15.7.2.tgz#52c41e75b8c87e72b9d9360e0206b99dcbffa6c5" integrity sha512-8QQikdH7//R2vurIJSutZ1smHYTcLpRWEOlHnzcWHmBYrOGUysKwSsrC89BCiFj3CbrfJ/nXFdJepOVrY1GCHQ== @@ -3312,13 +3312,6 @@ react-is@^16.8.1: resolved "https://registry.yarnpkg.com/react-is/-/react-is-16.13.1.tgz#789729a4dc36de2999dc156dd6c1d9c18cea56a4" integrity sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ== -react-json-pretty@^2.2.0: - version "2.2.0" - resolved "https://registry.yarnpkg.com/react-json-pretty/-/react-json-pretty-2.2.0.tgz#9ba907d2b08d87e90456d87b6025feeceb8f63cf" - integrity sha512-3UMzlAXkJ4R8S4vmkRKtvJHTewG4/rn1Q18n0zqdu/ipZbUPLVZD+QwC7uVcD/IAY3s8iNVHlgR2dMzIUS0n1A== - dependencies: - prop-types "^15.6.2" - react-refresh@^0.9.0: version "0.9.0" resolved "https://registry.yarnpkg.com/react-refresh/-/react-refresh-0.9.0.tgz#71863337adc3e5c2f8a6bfddd12ae3bfe32aafbf"