-
diff --git a/src/components/generic/Tabs.tsx b/src/components/generic/Tabs.tsx
index 8b661029..131a2bef 100644
--- a/src/components/generic/Tabs.tsx
+++ b/src/components/generic/Tabs.tsx
@@ -11,76 +11,31 @@ interface TabProps extends DefaultDivProps {
}[];
}
-export const Tabs = ({ tabs }: TabProps) => {
- // let [categories] = useState({
- // Recent: [
- // {
- // id: 1,
- // title: 'Does drinking coffee make you smarter?',
- // date: '5h ago',
- // commentCount: 5,
- // shareCount: 2,
- // },
- // {
- // id: 2,
- // title: "So you've bought coffee... now what?",
- // date: '2h ago',
- // commentCount: 3,
- // shareCount: 2,
- // },
- // ],
- // Popular: [
- // {
- // id: 1,
- // title: 'Is tech making coffee better or worse?',
- // date: 'Jan 7',
- // commentCount: 29,
- // shareCount: 16,
- // },
- // {
- // id: 2,
- // title: 'The most innovative things happening in coffee',
- // date: 'Mar 19',
- // commentCount: 24,
- // shareCount: 12,
- // },
- // ],
- // Trending: [
- // {
- // id: 1,
- // title: 'Ask Me Anything: 10 answers to your questions about coffee',
- // date: '2d ago',
- // commentCount: 9,
- // shareCount: 5,
- // },
- // {
- // id: 2,
- // title: "The worst advice we've ever heard about coffee",
- // date: '4d ago',
- // commentCount: 1,
- // shareCount: 2,
- // },
- // ],
- // })
-
+export const Tabs = ({ tabs, className, ...props }: TabProps): JSX.Element => {
return (
-
-
+
+
{tabs.map((tab) => (
`w-full text-lg font-medium`}
+ className={({ selected }): string =>
+ `w-full text-lg font-medium p-2 border-b-2 ${
+ selected
+ ? 'dark:border-gray-200 border-gray-600'
+ : 'border-transparent dark:border-transparent'
+ }`
+ }
>
{tab.name}
))}
-
+
{tabs.map((tab, index) => (
{tab.body}
diff --git a/src/components/menu/MobileNav.tsx b/src/components/menu/MobileNav.tsx
index b0fc1301..4c6ffd75 100644
--- a/src/components/menu/MobileNav.tsx
+++ b/src/components/menu/MobileNav.tsx
@@ -19,7 +19,7 @@ export const MobileNav = (): JSX.Element => {
dispatch(closeMobileNav());
}}
>
-
+
diff --git a/src/components/menu/Navigation.tsx b/src/components/menu/Navigation.tsx
index c0cdec14..7bbf4513 100644
--- a/src/components/menu/Navigation.tsx
+++ b/src/components/menu/Navigation.tsx
@@ -21,7 +21,7 @@ export const Navigation = ({
const route = useRoute();
return (
diff --git a/src/components/nodes/Node.tsx b/src/components/nodes/Node.tsx
deleted file mode 100644
index 594ac8c8..00000000
--- a/src/components/nodes/Node.tsx
+++ /dev/null
@@ -1,28 +0,0 @@
-import React from 'react';
-
-import Avatar from 'boring-avatars';
-
-import type { Protobuf } from '@meshtastic/meshtasticjs';
-
-type DefaultDivProps = JSX.IntrinsicElements['div'];
-
-export interface NodeProps extends DefaultDivProps {
- node: Protobuf.NodeInfo;
-}
-
-export const Node = ({ node, ...props }: NodeProps): JSX.Element => {
- return (
-
-
-
{node.user?.longName}
-
- );
-};
diff --git a/src/components/templates/PrimaryTemplate.tsx b/src/components/templates/PrimaryTemplate.tsx
index 2911d79a..adbda160 100644
--- a/src/components/templates/PrimaryTemplate.tsx
+++ b/src/components/templates/PrimaryTemplate.tsx
@@ -17,7 +17,7 @@ export const PrimaryTemplate = ({
}: PrimaryTemplateProps): JSX.Element => {
return (
-
+
{button &&
{button}
}
@@ -32,11 +32,11 @@ export const PrimaryTemplate = ({
-
+
{children}
{footer && (
-
+
{button &&
{button}
}
{footer}
diff --git a/src/core/connection.ts b/src/core/connection.ts
index 1436b1d8..d8a76fff 100644
--- a/src/core/connection.ts
+++ b/src/core/connection.ts
@@ -1,3 +1,9 @@
-import { IHTTPConnection } from '@meshtastic/meshtasticjs';
+import {
+ IBLEConnection,
+ IHTTPConnection,
+ ISerialConnection,
+} from '@meshtastic/meshtasticjs';
export const connection = new IHTTPConnection();
+export const bleConnection = new IBLEConnection();
+export const serialConnection = new ISerialConnection();
diff --git a/src/pages/Nodes/Index.tsx b/src/pages/Nodes/Index.tsx
index 21fecac1..4c8a476c 100644
--- a/src/pages/Nodes/Index.tsx
+++ b/src/pages/Nodes/Index.tsx
@@ -46,6 +46,12 @@ export const Nodes = (): JSX.Element => {
+ {!nodes.length && (
+
+ No nodes discovered yet...
+
+ )}
+
{nodes.map((node) => (
{
diff --git a/src/pages/settings/Connection.tsx b/src/pages/settings/Connection.tsx
index 0748bdf9..e757dcb7 100644
--- a/src/pages/settings/Connection.tsx
+++ b/src/pages/settings/Connection.tsx
@@ -3,12 +3,18 @@ import React from 'react';
import { useForm } from 'react-hook-form';
import { useTranslation } from 'react-i18next';
+import { Input } from '@app/components/generic/Input';
import { Tabs } from '@app/components/generic/Tabs';
-import { connection } from '@app/core/connection';
+import { Toggle } from '@app/components/generic/Toggle';
+import {
+ bleConnection,
+ connection,
+ serialConnection,
+} from '@app/core/connection';
import { useAppSelector } from '@app/hooks/redux';
import { Button } from '@components/generic/Button';
import { PrimaryTemplate } from '@components/templates/PrimaryTemplate';
-import { MenuIcon, SaveIcon } from '@heroicons/react/outline';
+import { LinkIcon, MenuIcon, SaveIcon } from '@heroicons/react/outline';
import type { Protobuf } from '@meshtastic/meshtasticjs';
export interface ConnectionProps {
@@ -57,12 +63,71 @@ export const Connection = ({
}
>
+
+ Current connection method:
+
+ BLE
+
+
},
- { name: 'Bluetooth', body: BLE
},
- { name: 'Serial', body: SERIAL
},
+ {
+ name: 'HTTP',
+ body: (
+
+
+
+
+ ),
+ },
+ {
+ name: 'Bluetooth',
+ body: (
+
+ Devices:
+
+
+ Device Name
+
+
+
+ Device Name
+
+
+
+ ),
+ },
+ {
+ name: 'Serial',
+ body: (
+
+ Devices:
+
+
+ Device Name
+
+
+
+ Device Name
+
+
+
+ ),
+ },
]}
/>
diff --git a/src/pages/settings/Device.tsx b/src/pages/settings/Device.tsx
index b44a2673..266fe4c8 100644
--- a/src/pages/settings/Device.tsx
+++ b/src/pages/settings/Device.tsx
@@ -10,7 +10,7 @@ import { Button } from '@components/generic/Button';
import { Input } from '@components/generic/Input';
import { PrimaryTemplate } from '@components/templates/PrimaryTemplate';
import { MenuIcon, SaveIcon } from '@heroicons/react/outline';
-import type { Protobuf } from '@meshtastic/meshtasticjs';
+import { Protobuf } from '@meshtastic/meshtasticjs';
export interface DeviceProps {
navOpen: boolean;
@@ -20,13 +20,21 @@ export interface DeviceProps {
export const Device = ({ navOpen, setNavOpen }: DeviceProps): JSX.Element => {
const { t } = useTranslation();
const user = useAppSelector((state) => state.meshtastic.user);
-
- const { register, handleSubmit, formState } = useForm({
- defaultValues: user,
+ const { register, handleSubmit, formState } = useForm<{
+ isLicensed: boolean;
+ shortName: string;
+ longName: string;
+ }>({
+ defaultValues: {
+ isLicensed: user.isLicensed,
+ shortName: user.shortName,
+ longName: user.longName,
+ },
});
const onSubmit = handleSubmit((data) => {
- void connection.setOwner(data);
+ Protobuf.User.mergePartial(user, data);
+ void connection.setOwner(user);
});
return (