Add fetch metadata buttons on peers page

This commit is contained in:
Sacha Weatherstone
2022-10-08 21:30:44 +10:30
parent 6c21514e13
commit c6bd178f20
3 changed files with 44 additions and 7 deletions

View File

@@ -25,7 +25,7 @@
"@heroicons/react": "^2.0.12",
"@hookform/resolvers": "^2.9.8",
"@meshtastic/eslint-config": "^1.0.8",
"@meshtastic/meshtasticjs": "^0.6.104",
"@meshtastic/meshtasticjs": "^0.6.105",
"@tailwindcss/line-clamp": "^0.4.2",
"@tailwindcss/typography": "^0.5.7",
"base64-js": "^1.5.1",

8
pnpm-lock.yaml generated
View File

@@ -6,7 +6,7 @@ specifiers:
'@heroicons/react': ^2.0.12
'@hookform/resolvers': ^2.9.8
'@meshtastic/eslint-config': ^1.0.8
'@meshtastic/meshtasticjs': ^0.6.104
'@meshtastic/meshtasticjs': ^0.6.105
'@tailwindcss/forms': ^0.5.3
'@tailwindcss/line-clamp': ^0.4.2
'@tailwindcss/typography': ^0.5.7
@@ -56,7 +56,7 @@ dependencies:
'@heroicons/react': 2.0.12_react@18.2.0
'@hookform/resolvers': 2.9.8_react-hook-form@7.37.0
'@meshtastic/eslint-config': 1.0.8
'@meshtastic/meshtasticjs': 0.6.104
'@meshtastic/meshtasticjs': 0.6.105
'@tailwindcss/line-clamp': 0.4.2_tailwindcss@3.1.8
'@tailwindcss/typography': 0.5.7_tailwindcss@3.1.8
base64-js: 1.5.1
@@ -619,8 +619,8 @@ packages:
- supports-color
dev: false
/@meshtastic/meshtasticjs/0.6.104:
resolution: {integrity: sha512-LFDbxbaKJeKXMeh1KdX1ALrd73CV9WSoZljL8W7egidT3iFu3nrDHfv4WwTJ93YOhZllPIojuL+MzlXwi0IiXA==}
/@meshtastic/meshtasticjs/0.6.105:
resolution: {integrity: sha512-A9e3aNGA5XiKmOt3QhnKINT5s1sUcUta9C7VhfYdXThHbpaEZheQLFaITDDWU+NUcGRzE0J9eZBw6mZdbcw82Q==}
dependencies:
'@protobuf-ts/runtime': 2.8.1
'@serialport/stream': 10.3.0

View File

@@ -1,16 +1,20 @@
import type React from "react";
import toast from "react-hot-toast";
import { base16 } from "rfc4648";
import { IconButton } from "@app/components/IconButton.js";
import { Mono } from "@app/components/Mono.js";
import { useDevice } from "@core/providers/useDevice.js";
import { Hashicon } from "@emeraldpay/hashicon-react";
import { EllipsisHorizontalIcon } from "@heroicons/react/24/outline";
import {
ArrowPathRoundedSquareIcon,
EllipsisHorizontalIcon,
} from "@heroicons/react/24/outline";
import { Protobuf } from "@meshtastic/meshtasticjs";
export const PeersPage = (): JSX.Element => {
const { hardware, nodes } = useDevice();
const { connection, nodes } = useDevice();
return (
<div className="w-full overflow-y-auto">
@@ -36,6 +40,12 @@ export const PeersPage = (): JSX.Element => {
>
MAC Address
</th>
<th
scope="col"
className="py-3.5 text-left text-sm font-semibold text-gray-900"
>
Versions
</th>
<th
scope="col"
className="py-3.5 text-left text-sm font-semibold text-gray-900"
@@ -78,6 +88,33 @@ export const PeersPage = (): JSX.Element => {
?.join(":") ?? ""}
</Mono>
</td>
<td className="whitespace-nowrap py-2 text-sm text-gray-500">
{node.metadata ? (
<>
<Mono>{node.metadata.firmwareVersion}</Mono>
<span className="text-black">/</span>
<Mono>{node.metadata.deviceStateVersion}</Mono>
</>
) : (
<IconButton
size="sm"
variant="secondary"
onClick={() => {
if (connection) {
void toast.promise(
connection.getMetadata(node.data.num),
{
loading: "Requesting Metadata...",
success: "Recieved Metadata",
error: "No response received",
}
);
}
}}
icon={<ArrowPathRoundedSquareIcon className="h-4" />}
/>
)}
</td>
<td className="whitespace-nowrap py-2 text-sm text-gray-500">
{new Date(node.data.lastHeard).toLocaleTimeString()}
</td>