Persistent nodedb (#780)

* Refactor  and consolitdate store imports

- Created a new index file in the core stores directory to export all stores from a single module.
- Updated imports to use consolidated store exports.

* Remove unnecessary import

* Update imports

* First steps to persist nodeDB

* Use named exports

* Change store import after merge

* Persistent nodeDB initial work

* Key mishmatch warning, new serialization handler

* Minor copilot changes

* Add NODEDB_RETENTION_NUM

* Updated tests

* Refactor PKI mismatch logic

* Clear persisted db on reset

* Only persist on featureFlag

* Mock featureFlag in tests

---------

Co-authored-by: philon- <philon-@users.noreply.github.com>

packages/web/src/pages/Dashboard/index.tsx

@@ -3,7 +3,7 @@ import { Button } from "@components/UI/Button.tsx";
 import { Separator } from "@components/UI/Seperator.tsx";
 import { Heading } from "@components/UI/Typography/Heading.tsx";
 import { Subtle } from "@components/UI/Typography/Subtle.tsx";
-import { useAppStore, useDeviceStore } from "@core/stores";
+import { useAppStore, useDeviceStore, useNodeDBStore } from "@core/stores";
 import { ListPlusIcon, PlusIcon, UsersIcon } from "lucide-react";
 import { useMemo } from "react";
 import { useTranslation } from "react-i18next";
@@ -12,6 +12,7 @@ export const Dashboard = () => {
   const { t } = useTranslation("dashboard");
   const { setConnectDialogOpen, setSelectedDevice } = useAppStore();
   const { getDevices } = useDeviceStore();
+  const { getNodeDB } = useNodeDBStore();
 
   const devices = useMemo(() => getDevices(), [getDevices]);
 
@@ -31,6 +32,11 @@ export const Dashboard = () => {
         {devices.length ? (
           <ul className="grow divide-y divide-slate-200">
             {devices.map((device) => {
+              const nodeDB = getNodeDB(device.id);
+              if (!nodeDB) {
+                return;
+              }
+
               return (
                 <li key={device.id}>
                   <button
@@ -42,7 +48,7 @@ export const Dashboard = () => {
                   >
                     <div className="flex items-center justify-between">
                       <p className="truncate text-sm font-medium text-accent">
-                        {device.getNode(device.hardware.myNodeNum)?.user
+                        {nodeDB.getNode(device.hardware.myNodeNum)?.user
                           ?.longName ?? t("unknown.shortName")}
                       </p>
                       <div className="mt-2 sm:flex sm:justify-between">
@@ -52,9 +58,9 @@ export const Dashboard = () => {
                             className="text-slate-400"
                             aria-hidden="true"
                           />
-                          {device.getNodesLength() === 0
+                          {nodeDB.getNodesLength() === 0
                             ? 0
-                            : device.getNodesLength() - 1}
+                            : nodeDB.getNodesLength() - 1}
                         </div>
                       </div>
                     </div>

packages/web/src/pages/Map/index.tsx

@@ -6,7 +6,7 @@ import {
 import { BaseMap } from "@components/Map.tsx";
 import { PageLayout } from "@components/PageLayout.tsx";
 import { Sidebar } from "@components/Sidebar.tsx";
-import { useDevice } from "@core/stores";
+import { useDevice, useNodeDB } from "@core/stores";
 import { cn } from "@core/utils/cn.ts";
 import type { Protobuf } from "@meshtastic/core";
 import { bbox, lineString } from "@turf/turf";
@@ -30,7 +30,8 @@ const convertToLatLng = (position?: {
 });
 
 const MapPage = () => {
-  const { getNodes, waypoints, hasNodeError } = useDevice();
+  const { waypoints } = useDevice();
+  const { getNodes, hasNodeError } = useNodeDB();
   const { nodeFilter, defaultFilterValues, isFilterDirty } = useFilterNode();
 
   const { default: map } = useMap();
@@ -79,7 +80,7 @@ const MapPage = () => {
       return;
     }
 
-    if (validNodes.length === 1) {
+    if (validNodes.length === 1 && validNodes[0]) {
       map.easeTo({
         zoom: map.getZoom(),
         center: [

packages/web/src/pages/Messages.tsx

@@ -13,6 +13,7 @@ import {
   MessageType,
   useDevice,
   useMessageStore,
+  useNodeDB,
   useSidebar,
 } from "@core/stores";
 import { cn } from "@core/utils/cn.ts";
@@ -42,15 +43,9 @@ function SelectMessageChat() {
 }
 
 export const MessagesPage = () => {
-  const {
-    channels,
-    getNodes,
-    getNode,
-    hasNodeError,
-    getUnreadCount,
-    resetUnread,
-    connection,
-  } = useDevice();
+  const { channels, getUnreadCount, resetUnread, connection } = useDevice();
+  const { getNodes, getNode, hasNodeError } = useNodeDB();
+
   const { getMyNodeNum, getMessages, setMessageState } = useMessageStore();
 
   const { type, chatId } = useParams({ from: messagesWithParamsRoute.id });

packages/web/src/pages/Nodes/index.tsx

@@ -17,7 +17,7 @@ import { Sidebar } from "@components/Sidebar.tsx";
 import { Avatar } from "@components/UI/Avatar.tsx";
 import { Input } from "@components/UI/Input.tsx";
 import useLang from "@core/hooks/useLang.ts";
-import { useAppStore, useDevice } from "@core/stores";
+import { useAppStore, useDevice, useNodeDB } from "@core/stores";
 import { Protobuf, type Types } from "@meshtastic/core";
 import { numberToHexUnpadded } from "@noble/curves/abstract/utils";
 import { LockIcon, LockOpenIcon } from "lucide-react";
@@ -40,8 +40,8 @@ export interface DeleteNoteDialogProps {
 const NodesPage = (): JSX.Element => {
   const { t } = useTranslation("nodes");
   const { currentLanguage } = useLang();
-  const { getNodes, hardware, connection, hasNodeError, setDialogOpen } =
-    useDevice();
+  const { hardware, connection, setDialogOpen } = useDevice();
+  const { getNodes, hasNodeError } = useNodeDB();
   const { setNodeNumDetails } = useAppStore();
   const { nodeFilter, defaultFilterValues, isFilterDirty } = useFilterNode();