Fix new nodes not being added to state

package.json

@@ -22,7 +22,7 @@
   "dependencies": {
     "@emeraldpay/hashicon-react": "^0.5.2",
     "@meshtastic/eslint-config": "^1.0.6",
-    "@meshtastic/meshtasticjs": "^0.6.47",
+    "@meshtastic/meshtasticjs": "^0.6.48",
     "@reduxjs/toolkit": "^1.7.2",
     "@tippyjs/react": "^4.2.6",
     "base64-js": "^1.5.1",

pnpm-lock.yaml

@@ -4,7 +4,7 @@ specifiers:
   '@emeraldpay/hashicon-react': ^0.5.2
   '@hookform/devtools': ^4.0.2
   '@meshtastic/eslint-config': ^1.0.6
-  '@meshtastic/meshtasticjs': ^0.6.47
+  '@meshtastic/meshtasticjs': ^0.6.48
   '@reduxjs/toolkit': ^1.7.2
   '@tippyjs/react': ^4.2.6
   '@types/mapbox-gl': ^2.6.1
@@ -49,7 +49,7 @@ specifiers:
 dependencies:
   '@emeraldpay/hashicon-react': 0.5.2
   '@meshtastic/eslint-config': 1.0.6
-  '@meshtastic/meshtasticjs': 0.6.47
+  '@meshtastic/meshtasticjs': 0.6.48
   '@reduxjs/toolkit': 1.7.2_react-redux@7.2.6+react@17.0.2
   '@tippyjs/react': 4.2.6_react-dom@17.0.2+react@17.0.2
   base64-js: 1.5.1
@@ -1631,8 +1631,8 @@ packages:
       - supports-color
     dev: false
 
-  /@meshtastic/meshtasticjs/0.6.47:
+  /@meshtastic/meshtasticjs/0.6.48:
-    resolution: {integrity: sha512-WO/4o8bHFihNY8cPfmIZ8AnLv5XxduQJg2fff4mDAu8X+ydpTzmlgxlDMK5kdhqDGx22ADmK3XTDdivWFjYPVA==}
+    resolution: {integrity: sha512-ithCXUk57R49bTG+UK2MEpk0K/f0QROV+/fupVWhdJtszMHJor+BZRw9UEBU2QBdv8u2nVJbEwG9RaWnW67eqg==}
     dependencies:
       '@meshtastic/eslint-config': 1.0.6
       '@protobuf-ts/runtime': 2.2.2

src/core/slices/meshtasticSlice.ts

@@ -109,9 +109,14 @@ export const meshtasticSlice = createSlice({
           node.lastHeard = new Date(action.payload.packet.rxTime * 1000);
         }
       } else {
-        // todo: add node
+        state.nodes.push({
-        console.log('Node not in DB');
+          number: action.payload.packet.from,
-        console.log(action.payload);
+          lastHeard: new Date(),
+          snr: [action.payload.packet.rxSnr],
+          user: action.payload.data,
+          positions: [],
+          routes: [],
+        });
       }
     },
     addPosition: (state, action: PayloadAction<Types.PositionPacket>) => {
@@ -200,10 +205,12 @@ export const meshtasticSlice = createSlice({
       state.radio.preferences = action.payload;
     },
     addMessage: (state, action: PayloadAction<MessageWithAck>) => {
+      // todo: is last interraction for just channel chats or dm's to?
       state.chats[action.payload.message.packet.channel].lastInterraction =
         new Date();
 
       if (action.payload.message.packet.to === 0xffffffff) {
+        // TODO: use chatIndex
         state.chats[action.payload.message.packet.channel].messages.push(
           action.payload,
         );
@@ -220,8 +227,18 @@ export const meshtasticSlice = createSlice({
       state,
       action: PayloadAction<{ chatIndex: number; messageId: number }>,
     ) => {
+      console.log(action.payload.chatIndex);
+
+      console.log(state.chats);
+
+      console.log(state.chats[action.payload.chatIndex]);
+
       state.chats[action.payload.chatIndex].messages.map((message) => {
+        console.log('ack');
+
         if (message.message.packet.id === action.payload.messageId) {
+          console.log('acked');
+
           message.ack = true;
         }
       });

src/pages/Extensions/Debug.tsx

@@ -0,0 +1,40 @@
+import React from 'react';
+
+import { Button } from '@app/components/generic/button/Button';
+import { Card } from '@app/components/generic/Card';
+import { connection } from '@app/core/connection.js';
+import { useAppSelector } from '@hooks/useAppSelector';
+
+export const Debug = (): JSX.Element => {
+  const hardwareInfo = useAppSelector(
+    (state) => state.meshtastic.radio.hardware,
+  );
+  const node = useAppSelector((state) =>
+    state.meshtastic.nodes.find(
+      (node) => node.number === hardwareInfo.myNodeNum,
+    ),
+  );
+
+  return (
+    <div className="flex flex-col gap-4 p-4 md:flex-row">
+      <Card className="flex-grow">
+        <div className="grid grid-cols-4 gap-4">
+          <Button
+            onClick={async (): Promise<void> => {
+              await connection.configure();
+            }}
+          >
+            Configure
+          </Button>
+          <Button
+            onClick={async (): Promise<void> => {
+              await connection.getPreferences();
+            }}
+          >
+            Get Preferences
+          </Button>
+        </div>
+      </Card>
+    </div>
+  );
+};

src/pages/Extensions/Index.tsx

@@ -3,7 +3,7 @@ import React from 'react';
 import { FiFile, FiInfo } from 'react-icons/fi';
 import { MdSubject } from 'react-icons/md';
 import { RiPinDistanceFill } from 'react-icons/ri';
-import { VscExtensions } from 'react-icons/vsc';
+import { VscDebug, VscExtensions } from 'react-icons/vsc';
 
 import { ExternalSection } from '@components/generic/Sidebar/ExternalSection';
 import { Layout } from '@components/layout';
@@ -11,9 +11,11 @@ import { FileBrowser } from '@pages/Extensions/FileBrowser';
 import { Info } from '@pages/Extensions/Info';
 import { Logs } from '@pages/Extensions/Logs';
 
+import { Debug } from './Debug';
+
 export const Extensions = (): JSX.Element => {
   const [selectedExtension, setSelectedExtension] = React.useState<
-    'info' | 'logs' | 'fileBrowser' | 'rangeTest'
+    'info' | 'logs' | 'fileBrowser' | 'rangeTest' | 'debug'
   >('info');
 
   return (
@@ -50,6 +52,13 @@ export const Extensions = (): JSX.Element => {
             icon={<RiPinDistanceFill />}
             title="Range Test"
           />
+          <ExternalSection
+            onClick={(): void => {
+              setSelectedExtension('debug');
+            }}
+            icon={<VscDebug />}
+            title="Debug"
+          />
         </div>
       }
     >
@@ -59,6 +68,8 @@ export const Extensions = (): JSX.Element => {
         {selectedExtension === 'logs' && <Logs />}
 
         {selectedExtension === 'fileBrowser' && <FileBrowser />}
+
+        {selectedExtension === 'debug' && <Debug />}
       </div>
     </Layout>
   );