Use new js lib version

package.json

@@ -9,8 +9,8 @@
     "build": "tsc && vite build",
     "preview": "vite preview",
     "package": "gzipper c -i html,js,css,png,ico,svg,webmanifest,txt dist dist/output && tar -cvf dist/build.tar -C ./dist/output/ $(ls ./dist/output/)",
-    "format:check": "prettier --check . && eslint src/**/*.{ts,tsx}",
+    "format:check": "prettier --check . && eslint",
-    "format:fix": "prettier --write . && eslint --fix src/**/*.{ts,tsx}",
+    "format:fix": "prettier --write . && eslint --fix",
     "check:unimported": "unimported"
   },
   "repository": {
@@ -27,7 +27,7 @@
     "@heroicons/react": "^2.0.13",
     "@hookform/error-message": "^2.0.1",
     "@hookform/resolvers": "^2.9.10",
-    "@meshtastic/meshtasticjs": "^0.7.5",
+    "@meshtastic/meshtasticjs": "^0.9.1",
     "@tailwindcss/line-clamp": "^0.4.2",
     "@tailwindcss/typography": "^0.5.8",
     "@turf/turf": "^6.5.0",
@@ -48,7 +48,6 @@
     "react-hook-form": "^7.41.2",
     "react-hot-toast": "^2.4.0",
     "react-icons": "^4.7.1",
-    "react-json-pretty": "^2.2.0",
     "react-json-tree": "^0.17.0",
     "react-map-gl": "^7.0.20",
     "react-qrcode-logo": "^2.8.0",
@@ -78,7 +77,7 @@
     "postcss": "^8.4.20",
     "prettier": "^2.8.1",
     "prettier-plugin-tailwindcss": "^0.2.1",
-    "rollup-plugin-visualizer": "^5.8.3",
+    "rollup-plugin-visualizer": "^5.9.0",
     "tailwindcss": "^3.2.4",
     "tar": "^6.1.13",
     "tslib": "^2.4.1",

pnpm-lock.yaml

@@ -6,7 +6,7 @@ specifiers:
   '@heroicons/react': ^2.0.13
   '@hookform/error-message': ^2.0.1
   '@hookform/resolvers': ^2.9.10
-  '@meshtastic/meshtasticjs': ^0.7.5
+  '@meshtastic/meshtasticjs': ^0.9.1
   '@tailwindcss/forms': ^0.5.3
   '@tailwindcss/line-clamp': ^0.4.2
   '@tailwindcss/typography': ^0.5.8
@@ -49,12 +49,11 @@ specifiers:
   react-hook-form: ^7.41.2
   react-hot-toast: ^2.4.0
   react-icons: ^4.7.1
-  react-json-pretty: ^2.2.0
   react-json-tree: ^0.17.0
   react-map-gl: ^7.0.20
   react-qrcode-logo: ^2.8.0
   rfc4648: ^1.5.2
-  rollup-plugin-visualizer: ^5.8.3
+  rollup-plugin-visualizer: ^5.9.0
   tailwindcss: ^3.2.4
   tar: ^6.1.13
   tslib: ^2.4.1
@@ -71,7 +70,7 @@ dependencies:
   '@heroicons/react': 2.0[email protected]
   '@hookform/error-message': 2.0.1_33unso2ocv5y5ix74fsplqd6ny
   '@hookform/resolvers': 2.9[email protected]
-  '@meshtastic/meshtasticjs': 0.7.5
+  '@meshtastic/meshtasticjs': 0.9.1
   '@tailwindcss/line-clamp': 0.4[email protected]
   '@tailwindcss/typography': 0.5[email protected]
   '@turf/turf': 6.5.0
@@ -92,7 +91,6 @@ dependencies:
   react-hook-form: 7.41[email protected]
   react-hot-toast: 2.4.0_biqbaboplfbrettd7655fr4n2y
   react-icons: 4.7[email protected]
-  react-json-pretty: 2.2.0_biqbaboplfbrettd7655fr4n2y
   react-json-tree: 0.17.0_kzbn2opkn2327fwg5yzwzya5o4
   react-map-gl: 7.0.20_6eczaga5xxiwzxtfiyk6fioasq
   react-qrcode-logo: 2.8.0_biqbaboplfbrettd7655fr4n2y
@@ -122,7 +120,7 @@ devDependencies:
   postcss: 8.4.20
   prettier: 2.8.1
   prettier-plugin-tailwindcss: 0.2[email protected]
-  rollup-plugin-visualizer: 5.8.3
+  rollup-plugin-visualizer: 5.9.0
   tailwindcss: 3.2[email protected]
   tar: 6.1.13
   tslib: 2.4.1
@@ -1252,7 +1250,7 @@ packages:
       babel-plugin-polyfill-corejs2: 0.3.3_@[email protected]
       babel-plugin-polyfill-corejs3: 0.6.0_@[email protected]
       babel-plugin-polyfill-regenerator: 0.4.1_@[email protected]
-      core-js-compat: 3.27.0
+      core-js-compat: 3.27.1
       semver: 6.3.0
     transitivePeerDependencies:
       - supports-color
@@ -1712,8 +1710,8 @@ packages:
     engines: {node: '>=6.0.0'}
     dev: false
 
-  /@meshtastic/meshtasticjs/0.7.5:
+  /@meshtastic/meshtasticjs/0.9.1:
-    resolution: {integrity: sha512-t4Yk/uf84WI3oia+ktZy35hlBZXKVQHm2suqGIlwewl6eFcRqi0dYHzSVugyYqs4vjOEmT5vZVpy9UZbyb/DTQ==}
+    resolution: {integrity: sha512-BYTqcH/ArIr82EpYW23Y2cwvkWoKgNJAdjU21L8SUt9HjuVUNzeJOxieASINqLEWLFbcnOf7G5owmN2rKCSkLA==}
     dependencies:
       '@protobuf-ts/runtime': 2.8.2
       glob: 8.0.3
@@ -3386,7 +3384,7 @@ packages:
     dependencies:
       '@babel/core': 7.20.7
       '@babel/helper-define-polyfill-provider': 0.3.3_@[email protected]
-      core-js-compat: 3.27.0
+      core-js-compat: 3.27.1
     transitivePeerDependencies:
       - supports-color
     dev: true
@@ -3653,8 +3651,8 @@ packages:
     resolution: {integrity: sha512-ASFBup0Mz1uyiIjANan1jzLQami9z1PoYSZCiiYW2FczPbenXc45FZdBZLzOT+r6+iciuEModtmCti+hjaAk0A==}
     dev: true
 
-  /core-js-compat/3.27.0:
+  /core-js-compat/3.27.1:
-    resolution: {integrity: sha512-spN2H4E/wocMML7XtbKuqttHHM+zbF3bAdl9mT4/iyFaF33bowQGjxiWNWyvUJGH9F+hTgnhWziiLtwu3oC/Qg==}
+    resolution: {integrity: sha512-Dg91JFeCDA17FKnneN7oCMz4BkQ4TcffkgHP4OWwp9yx3pi7ubqMDXXSacfNak1PQqjc95skyt+YBLHQJnkJwA==}
     dependencies:
       browserslist: 4.21.4
     dev: true
@@ -5755,17 +5753,6 @@ packages:
   /react-is/16.13.1:
     resolution: {integrity: sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ==}
 
-  /react-json-pretty/2.2.0_biqbaboplfbrettd7655fr4n2y:
-    resolution: {integrity: sha512-3UMzlAXkJ4R8S4vmkRKtvJHTewG4/rn1Q18n0zqdu/ipZbUPLVZD+QwC7uVcD/IAY3s8iNVHlgR2dMzIUS0n1A==}
-    peerDependencies:
-      react: '>=15.0'
-      react-dom: '>=15.0'
-    dependencies:
-      prop-types: 15.8.1
-      react: 18.2.0
-      react-dom: 18.2[email protected]
-    dev: false
-
   /react-json-tree/0.17.0_kzbn2opkn2327fwg5yzwzya5o4:
     resolution: {integrity: sha512-hcWjibI/fAvsKnfYk+lka5OrE1Lvb1jH5pSnFhIU5T8cCCxB85r6h/NOzDPggSSgErjmx4rl3+2EkeclIKBOhg==}
     peerDependencies:
@@ -6010,8 +5997,8 @@ packages:
       terser: 5.16.1
     dev: true
 
-  /rollup-plugin-visualizer/5.8.3:
+  /rollup-plugin-visualizer/5.9.0:
-    resolution: {integrity: sha512-QGJk4Bqe4AOat5AjipOh8esZH1nck5X2KFpf4VytUdSUuuuSwvIQZjMGgjcxe/zXexltqaXp5Vx1V3LmnQH15Q==}
+    resolution: {integrity: sha512-bbDOv47+Bw4C/cgs0czZqfm8L82xOZssk4ayZjG40y9zbXclNk7YikrZTDao6p7+HDiGxrN0b65SgZiVm9k1Cg==}
     engines: {node: '>=14'}
     hasBin: true
     peerDependencies:
@@ -6021,6 +6008,7 @@ packages:
         optional: true
     dependencies:
       open: 8.4.0
+      picomatch: 2.3.1
       source-map: 0.7.4
       yargs: 17.6.2
     dev: true

src/components/CommandPalette/Index.tsx

@@ -214,7 +214,7 @@ export const CommandPalette = (): JSX.Element => {
           icon: TrashIcon,
           action() {
             if (connection) {
-              void toast.promise(connection.resetPeers({}), {
+              void toast.promise(connection.resetPeers(), {
                 loading: "Resetting...",
                 success: "Succesfully reset peers",
                 error: "No response received"

src/components/Dialog/RebootDialog.tsx

@@ -36,13 +36,11 @@ export const RebootDialog = ({
           action={{
             icon: <ClockIcon className="w-4" />,
             action() {
-              connection?.reboot({
+              connection
-                time: time * 60,
+                ?.reboot({
-                callback: async () => {
+                  time: time * 60
-                  setRebootDialogOpen(false);
+                })
-                  await Promise.resolve();
+                .then(() => setRebootDialogOpen(false));
-                }
-              });
             }
           }}
         />
@@ -50,13 +48,11 @@ export const RebootDialog = ({
           className="w-24"
           iconBefore={<ArrowPathIcon className="w-4" />}
           onClick={() => {
-            connection?.reboot({
+            connection
-              time: 0,
+              ?.reboot({
-              callback: async () => {
+                time: 0
-                setRebootDialogOpen(false);
+              })
-                await Promise.resolve();
+              .then(() => setRebootDialogOpen(false));
-              }
-            });
           }}
         >
           Now

src/components/Dialog/ShutdownDialog.tsx

@@ -36,13 +36,11 @@ export const ShutdownDialog = ({
           action={{
             icon: <ClockIcon className="w-4" />,
             action() {
-              connection?.shutdown({
+              connection
-                time: time * 60,
+                ?.shutdown({
-                callback: async () => {
+                  time: time * 60
-                  setShutdownDialogOpen(false);
+                })
-                  await Promise.resolve();
+                .then(() => setShutdownDialogOpen(false));
-                }
-              });
             }
           }}
         />
@@ -50,13 +48,11 @@ export const ShutdownDialog = ({
           className="w-24"
           iconBefore={<PowerIcon className="w-4" />}
           onClick={() => {
-            connection?.shutdown({
+            connection
-              time: 0,
+              ?.shutdown({
-              callback: async () => {
+                time: 0
-                setShutdownDialogOpen(false);
+              })
-                await Promise.resolve();
+              .then(() => setShutdownDialogOpen(false));
-              }
-            });
           }}
         >
           Now

src/components/PageComponents/Channel.tsx

@@ -65,25 +65,23 @@ export const Channel = ({ channel }: SettingsPanelProps): JSX.Element => {
   const onSubmit = handleSubmit((data) => {
     if (connection) {
       void toast.promise(
-        connection.setChannel({
+        connection
-          channel: {
+          .setChannel({
-            role:
+            channel: {
-              channel?.role === Protobuf.Channel_Role.PRIMARY
+              role:
-                ? Protobuf.Channel_Role.PRIMARY
+                channel?.role === Protobuf.Channel_Role.PRIMARY
-                : data.enabled
+                  ? Protobuf.Channel_Role.PRIMARY
-                ? Protobuf.Channel_Role.SECONDARY
+                  : data.enabled
-                : Protobuf.Channel_Role.DISABLED,
+                  ? Protobuf.Channel_Role.SECONDARY
-            index: channel?.index,
+                  : Protobuf.Channel_Role.DISABLED,
-            settings: {
+              index: channel?.index,
-              ...data,
+              settings: {
-              psk: toByteArray(data.psk ?? "")
+                ...data,
+                psk: toByteArray(data.psk ?? "")
+              }
             }
-          },
+          })
-          callback: (): Promise<void> => {
+          .then(() => reset({ ...data })),
-            reset({ ...data });
-            return Promise.resolve();
-          }
-        }),
         {
           loading: "Saving...",
           success: "Saved Channel",

src/components/PageComponents/Config/Bluetooth.tsx

@@ -35,18 +35,16 @@ export const Bluetooth = (): JSX.Element => {
   const onSubmit = handleSubmit((data) => {
     if (connection) {
       void toast.promise(
-        connection.setConfig({
+        connection
-          config: {
+          .setConfig({
-            payloadVariant: {
+            config: {
-              oneofKind: "bluetooth",
+              payloadVariant: {
-              bluetooth: data
+                oneofKind: "bluetooth",
+                bluetooth: data
+              }
             }
-          },
+          })
-          callback: async () => {
+          .then(() => reset({ ...data })),
-            reset({ ...data });
-            await Promise.resolve();
-          }
-        }),
         {
           loading: "Saving...",
           success: "Saved Bluetooth Config, Restarting Node",

src/components/PageComponents/Config/Device.tsx

@@ -34,18 +34,16 @@ export const Device = (): JSX.Element => {
   const onSubmit = handleSubmit((data) => {
     if (connection) {
       void toast.promise(
-        connection.setConfig({
+        connection
-          config: {
+          .setConfig({
-            payloadVariant: {
+            config: {
-              oneofKind: "device",
+              payloadVariant: {
-              device: data
+                oneofKind: "device",
+                device: data
+              }
             }
-          },
+          })
-          callback: async () => {
+          .then(() => reset({ ...data })),
-            reset({ ...data });
-            await Promise.resolve();
-          }
-        }),
         {
           loading: "Saving...",
           success: "Saved Device Config, Restarting Node",

src/components/PageComponents/Config/Display.tsx

@@ -34,18 +34,16 @@ export const Display = (): JSX.Element => {
   const onSubmit = handleSubmit((data) => {
     if (connection) {
       void toast.promise(
-        connection.setConfig({
+        connection
-          config: {
+          .setConfig({
-            payloadVariant: {
+            config: {
-              oneofKind: "display",
+              payloadVariant: {
-              display: data
+                oneofKind: "display",
+                display: data
+              }
             }
-          },
+          })
-          callback: async () => {
+          .then(() => reset({ ...data })),
-            reset({ ...data });
-            await Promise.resolve();
-          }
-        }),
         {
           loading: "Saving...",
           success: "Saved Display Config, Restarting Node",

src/components/PageComponents/Config/LoRa.tsx

@@ -42,18 +42,16 @@ export const LoRa = (): JSX.Element => {
   const onSubmit = handleSubmit((data) => {
     if (connection) {
       void toast.promise(
-        connection.setConfig({
+        connection
-          config: {
+          .setConfig({
-            payloadVariant: {
+            config: {
-              oneofKind: "lora",
+              payloadVariant: {
-              lora: data
+                oneofKind: "lora",
+                lora: data
+              }
             }
-          },
+          })
-          callback: async () => {
+          .then(() => reset({ ...data })),
-            reset({ ...data });
-            await Promise.resolve();
-          }
-        }),
         {
           loading: "Saving...",
           success: "Saved LoRa Config, Restarting Node",

src/components/PageComponents/Config/Network.tsx

@@ -63,13 +63,9 @@ export const Network = (): JSX.Element => {
                 oneofKind: "network",
                 network: Protobuf.Config_NetworkConfig.create(data)
               }
-            },
-            callback: async () => {
-              reset({ ...data });
-              await Promise.resolve();
             }
           })
-          .catch((e) => console.log(e)),
+          .then(() => reset({ ...data })),
         {
           loading: "Saving...",
           success: "Saved Network Config, Restarting Node",

src/components/PageComponents/Config/Position.tsx

@@ -60,17 +60,15 @@ export const Position = (): JSX.Element => {
 
     if (connection) {
       void toast.promise(
-        connection.setPosition({
+        connection
-          position: Protobuf.Position.create({
+          .setPosition({
-            altitude: fixedAlt,
+            position: Protobuf.Position.create({
-            latitudeI: fixedLat * 1e7,
+              altitude: fixedAlt,
-            longitudeI: fixedLng * 1e7
+              latitudeI: fixedLat * 1e7,
-          }),
+              longitudeI: fixedLng * 1e7
-          callback: async () => {
+            })
-            reset({ ...data });
+          })
-            await Promise.resolve();
+          .then(() => reset({ ...data })),
-          }
-        }),
         {
           loading: "Saving...",
           success: "Saved Position Config, Restarting Node",
@@ -79,18 +77,16 @@ export const Position = (): JSX.Element => {
       );
       if (configHasChanged) {
         void toast.promise(
-          connection.setConfig({
+          connection
-            config: {
+            .setConfig({
-              payloadVariant: {
+              config: {
-                oneofKind: "position",
+                payloadVariant: {
-                position: rest
+                  oneofKind: "position",
+                  position: rest
+                }
               }
-            },
+            })
-            callback: async () => {
+            .then(() => reset({ ...data })),
-              reset({ ...data });
-              await Promise.resolve();
-            }
-          }),
           {
             loading: "Saving...",
             success: "Saved Position Config, Restarting Node",

src/components/PageComponents/Config/Power.tsx

@@ -32,18 +32,16 @@ export const Power = (): JSX.Element => {
   const onSubmit = handleSubmit((data) => {
     if (connection) {
       void toast.promise(
-        connection.setConfig({
+        connection
-          config: {
+          .setConfig({
-            payloadVariant: {
+            config: {
-              oneofKind: "power",
+              payloadVariant: {
-              power: data
+                oneofKind: "power",
+                power: data
+              }
             }
-          },
+          })
-          callback: async () => {
+          .then(() => reset({ ...data })),
-            reset({ ...data });
-            await Promise.resolve();
-          }
-        }),
         {
           loading: "Saving...",
           success: "Saved Power Config, Restarting Node",

src/components/PageComponents/Config/User.tsx

@@ -42,13 +42,11 @@ export const User = (): JSX.Element => {
   const onSubmit = handleSubmit((data) => {
     if (connection && myNode?.data.user) {
       void toast.promise(
-        connection.setOwner({
+        connection
-          owner: { ...myNode.data.user, ...data },
+          .setOwner({
-          callback: async () => {
+            owner: { ...myNode.data.user, ...data }
-            reset({ ...data });
+          })
-            await Promise.resolve();
+          .then(() => reset({ ...data })),
-          }
-        }),
         {
           loading: "Saving...",
           success: "Saved User, Restarting Node",

src/components/PageComponents/Messages/Message.tsx

@@ -31,17 +31,19 @@ export const Message = ({
 
   return lastMsgSameUser ? (
     <div className="ml-4 flex">
-      {message.ack ? (
+      {message.state === "ack" ? (
         <CheckCircleIcon className="my-auto h-4 text-textSecondary" />
-      ) : (
+      ) : message.state === "waiting" ? (
         <EllipsisHorizontalCircleIcon className="my-auto h-4 text-textSecondary" />
+      ) : (
+        <ExclamationCircleIcon className="my-auto h-4 text-textSecondary" />
       )}
       {"waypointID" in message ? (
         <WaypointMessage waypointID={message.waypointID} />
       ) : (
         <span
           className={`ml-4 border-l-2 border-l-backgroundPrimary pl-2 ${
-            message.ack ? "text-textPrimary" : "text-textSecondary"
+            message.state === "ack" ? "text-textPrimary" : "text-textSecondary"
           }`}
         >
           {message.text}
@@ -69,17 +71,21 @@ export const Message = ({
       </div>
       <div className="flex">
         {/* <ExclamationCircleIcon /> */}
-        {message.ack ? (
+        {message.state === "ack" ? (
           <CheckCircleIcon className="my-auto h-4 text-textSecondary" />
-        ) : (
+        ) : message.state === "waiting" ? (
           <EllipsisHorizontalCircleIcon className="my-auto h-4 text-textSecondary" />
+        ) : (
+          <ExclamationCircleIcon className="my-auto h-4 text-textSecondary" />
         )}
         {"waypointID" in message ? (
           <WaypointMessage waypointID={message.waypointID} />
         ) : (
           <span
             className={`ml-4 border-l-2 border-l-backgroundPrimary pl-2 ${
-              message.ack ? "text-textPrimary" : "text-textSecondary"
+              message.state === "ack"
+                ? "text-textPrimary"
+                : "text-textSecondary"
             }`}
           >
             {message.text}

src/components/PageComponents/Messages/MessageInput.tsx

@@ -14,7 +14,7 @@ export interface MessageInputProps {
 }
 
 export const MessageInput = ({ channel }: MessageInputProps): JSX.Element => {
-  const { connection, ackMessage } = useDevice();
+  const { connection, setMessageState } = useDevice();
 
   const { register, handleSubmit } = useForm<{
     message: string;
@@ -24,16 +24,17 @@ export const MessageInput = ({ channel }: MessageInputProps): JSX.Element => {
     }
   });
 
-  const onSubmit = handleSubmit((data) => {
+  const onSubmit = handleSubmit(async (data) => {
-    void connection?.sendText({
+    await connection
-      text: data.message,
+      ?.sendText({
-      wantAck: true,
+        text: data.message,
-      channel: channel.config.index as Types.ChannelNumber,
+        wantAck: true,
-      callback: (id) => {
+        channel: channel.config.index as Types.ChannelNumber
-        ackMessage(channel.config.index, id);
+      })
-        return Promise.resolve();
+      .then((id) => setMessageState(channel.config.index, id, "ack"))
-      }
+      .catch((e: Types.PacketError) =>
-    });
+        setMessageState(channel.config.index, e.id, e.error)
+      );
   });
 
   return (

src/components/PageComponents/ModuleConfig/CannedMessage.tsx

@@ -40,18 +40,16 @@ export const CannedMessage = (): JSX.Element => {
   const onSubmit = handleSubmit((data) => {
     if (connection) {
       void toast.promise(
-        connection.setModuleConfig({
+        connection
-          moduleConfig: {
+          .setModuleConfig({
-            payloadVariant: {
+            moduleConfig: {
-              oneofKind: "cannedMessage",
+              payloadVariant: {
-              cannedMessage: data
+                oneofKind: "cannedMessage",
+                cannedMessage: data
+              }
             }
-          },
+          })
-          callback: async () => {
+          .then(() => reset({ ...data })),
-            reset({ ...data });
-            await Promise.resolve();
-          }
-        }),
         {
           loading: "Saving...",
           success: "Saved Canned Message Config, Restarting Node",

src/components/PageComponents/ModuleConfig/ExternalNotification.tsx

@@ -30,18 +30,16 @@ export const ExternalNotification = (): JSX.Element => {
   const onSubmit = handleSubmit((data) => {
     if (connection) {
       void toast.promise(
-        connection.setModuleConfig({
+        connection
-          moduleConfig: {
+          .setModuleConfig({
-            payloadVariant: {
+            moduleConfig: {
-              oneofKind: "externalNotification",
+              payloadVariant: {
-              externalNotification: data
+                oneofKind: "externalNotification",
+                externalNotification: data
+              }
             }
-          },
+          })
-          callback: async () => {
+          .then(() => reset({ ...data })),
-            reset({ ...data });
-            await Promise.resolve();
-          }
-        }),
         {
           loading: "Saving...",
           success: "Saved External Notification Config, Restarting Node",

src/components/PageComponents/ModuleConfig/MQTT.tsx

@@ -37,18 +37,16 @@ export const MQTT = (): JSX.Element => {
   const onSubmit = handleSubmit((data) => {
     if (connection) {
       void toast.promise(
-        connection.setModuleConfig({
+        connection
-          moduleConfig: {
+          .setModuleConfig({
-            payloadVariant: {
+            moduleConfig: {
-              oneofKind: "mqtt",
+              payloadVariant: {
-              mqtt: data
+                oneofKind: "mqtt",
+                mqtt: data
+              }
             }
-          },
+          })
-          callback: async () => {
+          .then(() => reset({ ...data })),
-            reset({ ...data });
-            await Promise.resolve();
-          }
-        }),
         {
           loading: "Saving...",
           success: "Saved MQTT Config, Restarting Node",

src/components/PageComponents/ModuleConfig/RangeTest.tsx

@@ -31,18 +31,16 @@ export const RangeTest = (): JSX.Element => {
   const onSubmit = handleSubmit((data) => {
     if (connection) {
       void toast.promise(
-        connection.setModuleConfig({
+        connection
-          moduleConfig: {
+          .setModuleConfig({
-            payloadVariant: {
+            moduleConfig: {
-              oneofKind: "rangeTest",
+              payloadVariant: {
-              rangeTest: data
+                oneofKind: "rangeTest",
+                rangeTest: data
+              }
             }
-          },
+          })
-          callback: async () => {
+          .then(() => reset({ ...data })),
-            reset({ ...data });
-            await Promise.resolve();
-          }
-        }),
         {
           loading: "Saving...",
           success: "Saved Range Test Config, Restarting Node",

src/components/PageComponents/ModuleConfig/Serial.tsx

@@ -31,18 +31,16 @@ export const Serial = (): JSX.Element => {
   const onSubmit = handleSubmit((data) => {
     if (connection) {
       void toast.promise(
-        connection.setModuleConfig({
+        connection
-          moduleConfig: {
+          .setModuleConfig({
-            payloadVariant: {
+            moduleConfig: {
-              oneofKind: "serial",
+              payloadVariant: {
-              serial: data
+                oneofKind: "serial",
+                serial: data
+              }
             }
-          },
+          })
-          callback: async () => {
+          .then(() => reset({ ...data })),
-            reset({ ...data });
-            await Promise.resolve();
-          }
-        }),
         {
           loading: "Saving...",
           success: "Saved Serial Config, Restarting Node",

src/components/PageComponents/ModuleConfig/StoreForward.tsx

@@ -31,18 +31,16 @@ export const StoreForward = (): JSX.Element => {
   const onSubmit = handleSubmit((data) => {
     if (connection) {
       void toast.promise(
-        connection.setModuleConfig({
+        connection
-          moduleConfig: {
+          .setModuleConfig({
-            payloadVariant: {
+            moduleConfig: {
-              oneofKind: "storeForward",
+              payloadVariant: {
-              storeForward: data
+                oneofKind: "storeForward",
+                storeForward: data
+              }
             }
-          },
+          })
-          callback: async () => {
+          .then(() => reset({ ...data })),
-            reset({ ...data });
-            await Promise.resolve();
-          }
-        }),
         {
           loading: "Saving...",
           success: "Saved Store & Forward Config, Restarting Node",

src/components/PageComponents/ModuleConfig/Telemetry.tsx

@@ -31,18 +31,19 @@ export const Telemetry = (): JSX.Element => {
   const onSubmit = handleSubmit((data) => {
     if (connection) {
       void toast.promise(
-        connection.setModuleConfig({
+        connection
-          moduleConfig: {
+          .setModuleConfig({
-            payloadVariant: {
+            moduleConfig: {
-              oneofKind: "telemetry",
+              payloadVariant: {
-              telemetry: data
+                oneofKind: "telemetry",
+                telemetry: data
+              }
             }
-          },
+          })
-          callback: async () => {
+          .then(async () => {
             reset({ ...data });
             await Promise.resolve();
-          }
+          }),
-        }),
         {
           loading: "Saving...",
           success: "Saved Telemetry Config, Restarting Node",

src/core/stores/deviceStore.ts

@@ -15,16 +15,19 @@ export type Page =
   | "info"
   | "logs";
 
-export interface MessageWithAck extends Types.MessagePacket {
+export interface MessageWithState extends Types.MessagePacket {
-  ack: boolean;
+  state: MessageState;
 }
 
-export interface WaypointIDWithAck extends Omit<Types.WaypointPacket, "data"> {
+export interface WaypointIDWithState
+  extends Omit<Types.WaypointPacket, "data"> {
   waypointID: number;
-  ack: boolean;
+  state: MessageState;
 }
 
-export type AllMessageTypes = MessageWithAck | WaypointIDWithAck;
+export type AllMessageTypes = MessageWithState | WaypointIDWithState;
+
+export type MessageState = "ack" | "waiting" | Protobuf.Routing_Error;
 
 export interface Channel {
   config: Protobuf.Channel;
@@ -77,10 +80,14 @@ export interface Device {
   addUser: (user: Types.UserPacket) => void;
   addPosition: (position: Types.PositionPacket) => void;
   addConnection: (connection: Types.ConnectionType) => void;
-  addMessage: (message: MessageWithAck) => void;
+  addMessage: (message: MessageWithState) => void;
-  addWaypointMessage: (message: WaypointIDWithAck) => void;
+  addWaypointMessage: (message: WaypointIDWithState) => void;
   addDeviceMetadataMessage: (metadata: Types.DeviceMetadataPacket) => void;
-  ackMessage: (channelIndex: number, messageId: number) => void;
+  setMessageState: (
+    channelIndex: number,
+    messageId: number,
+    state: MessageState
+  ) => void;
   setImportDialogOpen: (open: boolean) => void;
   setQRDialogOpen: (open: boolean) => void;
   setShutdownDialogOpen: (open: boolean) => void;
@@ -517,7 +524,11 @@ export const useDeviceStore = create<DeviceState>((set, get) => ({
               })
             );
           },
-          ackMessage: (channelIndex: number, messageId: number) => {
+          setMessageState: (
+            channelIndex: number,
+            messageId: number,
+            state: MessageState
+          ) => {
             set(
               produce<DeviceState>((draft) => {
                 const device = draft.devices.get(id);
@@ -529,7 +540,7 @@ export const useDeviceStore = create<DeviceState>((set, get) => ({
                   (msg) => msg.packet.id === messageId
                 );
                 if (message) {
-                  message.ack = true;
+                  message.state = state;
                 }
               })
             );

src/core/subscriptions.ts

@@ -65,7 +65,7 @@ export const subscribeAll = (
     device.addWaypoint(data);
     device.addWaypointMessage({
       waypointID: data.id,
-      ack: rest.packet.from !== myNodeNum,
+      state: rest.packet.from !== myNodeNum ? "ack" : "waiting",
       ...rest
     });
   });
@@ -107,7 +107,7 @@ export const subscribeAll = (
   connection.events.onMessagePacket.subscribe((messagePacket) => {
     device.addMessage({
       ...messagePacket,
-      ack: messagePacket.packet.from !== myNodeNum
+      state: messagePacket.packet.from !== myNodeNum ? "ack" : "waiting"
     });
   });
 

vite.config.ts

@@ -20,13 +20,13 @@ export default defineConfig({
     react(),
     EnvironmentPlugin({
       COMMIT_HASH: hash
-    }),
-    VitePWA({
-      registerType: "autoUpdate",
-      devOptions: {
-        enabled: true
-      }
     })
+    // VitePWA({
+    //   registerType: "autoUpdate",
+    //   devOptions: {
+    //     enabled: true
+    //   }
+    // })
   ],
   build: {
     target: "esnext",