Merge pull request #449 from meshtastic/graph/refactor-ui-handlers

Simplified UI data management infra

package.json

@@ -67,7 +67,6 @@
     "react-tsparticles": "^2.7.1",
     "react-use": "^17.4.0",
     "redux-logger": "^3.0.6",
-    "redux-saga": "^1.2.1",
     "tailwindcss-radix": "^2.8.0",
     "tauri-plugin-store-api": "github:tauri-apps/tauri-plugin-store#v1",
     "timeago-react": "^3.0.5",

src-tauri/src/ipc/commands/radio.rs

@@ -58,6 +58,7 @@ pub async fn update_device_user(
     Ok(())
 }
 
+// UNUSED
 #[tauri::command]
 pub async fn start_configuration_transaction(
     device_key: DeviceKey,

src/api/connection.ts

@@ -0,0 +1,65 @@
+import { invoke } from "@tauri-apps/api";
+import { app_ipc_DeviceBulkConfig } from "@bindings/index";
+import { DeviceKey } from "@utils/connections";
+
+export const updateDeviceConfigBulk = async (
+  deviceKey: DeviceKey,
+  config: app_ipc_DeviceBulkConfig,
+) => {
+  const response = (await invoke("update_device_config_bulk", {
+    deviceKey: deviceKey,
+    config: config,
+  })) as undefined;
+
+  return response;
+};
+
+export const requestAutoConnectPort = async () => {
+  const response = (await invoke("request_autoconnect_port")) as string;
+
+  return response;
+};
+
+export const getAllSerialPorts = async () => {
+  const response = (await invoke("get_all_serial_ports")) as string[];
+
+  return response;
+};
+
+export const connectToSerialPort = async (
+  portName: string,
+  baudRate?: number,
+  dtr?: boolean,
+  rts?: boolean,
+) => {
+  const response = (await invoke("connect_to_serial_port", {
+    portName,
+    baudRate,
+    dtr,
+    rts,
+  })) as undefined;
+
+  return response;
+};
+
+export const connectToTcpPort = async (socketAddress: string) => {
+  const response = (await invoke("connect_to_tcp_port", {
+    address: socketAddress,
+  })) as undefined;
+
+  return response;
+};
+
+export const dropDeviceConnection = async (deviceKey: DeviceKey) => {
+  const response = (await invoke("drop_device_connection", {
+    deviceKey,
+  })) as undefined;
+
+  return response;
+};
+
+export const dropAllDeviceConnections = async () => {
+  const response = (await invoke("drop_all_device_connections")) as undefined;
+
+  return response;
+};

src/api/events.ts

@@ -0,0 +1,100 @@
+import { listen } from "@tauri-apps/api/event";
+import { useDispatch } from "react-redux";
+
+import { app_device_MeshDevice } from "@bindings/index";
+
+import { connectionSliceActions } from "@features/connection/slice";
+import { deviceSliceActions } from "@features/device/slice";
+import { useDeviceApi } from "@features/device/api";
+
+import { DeviceKey } from "@utils/connections";
+
+export const useCreateDeviceUpdateChannel = () => {
+  const dispatch = useDispatch();
+
+  const createChannel = async () => {
+    const unlisten = await listen<app_device_MeshDevice>(
+      "device_update",
+      (event) => {
+        const updatedDevice = event.payload;
+        dispatch(deviceSliceActions.setDevice(updatedDevice));
+      },
+    );
+
+    return unlisten;
+  };
+
+  return createChannel;
+};
+
+export const useCreateDeviceDisconnectChannel = () => {
+  const deviceApi = useDeviceApi();
+
+  const createChannel = async () => {
+    const unlisten = await listen<string>("device_disconnect", (event) => {
+      const deviceKey = event.payload;
+      deviceApi.disconnectFromDevice(deviceKey);
+      window.location.reload();
+    });
+
+    return unlisten;
+  };
+
+  return createChannel;
+};
+
+export const useCreateConfigStatusChannel = () => {
+  const dispatch = useDispatch();
+  const deviceApi = useDeviceApi();
+
+  const createChannel = async () => {
+    const unlisten = await listen<{
+      deviceKey: DeviceKey;
+      successful: boolean;
+      message: string | null;
+    }>("configuration_status", (event) => {
+      const {
+        successful,
+        deviceKey,
+        message,
+      }: {
+        successful: boolean;
+        deviceKey: DeviceKey;
+        message: string | null;
+      } = event.payload;
+
+      if (!successful) {
+        deviceApi.disconnectFromDevice(deviceKey);
+      }
+
+      dispatch(
+        connectionSliceActions.setConnectionState({
+          deviceKey: deviceKey,
+          status: successful
+            ? { status: "SUCCESSFUL" }
+            : { status: "FAILED", message: message ?? "" },
+        }),
+      );
+    });
+
+    return unlisten;
+  };
+
+  return createChannel;
+};
+
+export const useCreateRebootChannel = () => {
+  const createChannel = async () => {
+    const unlisten = await listen<number>("reboot", (event) => {
+      const rebootTimestampSec = event.payload;
+
+      const reboot_time = new Date(rebootTimestampSec * 1000);
+      console.warn("Rebooting at", reboot_time);
+      window.location.reload();
+    });
+
+    return unlisten;
+  };
+
+  return createChannel;
+};

src/api/mesh.ts

@@ -0,0 +1,43 @@
+import { invoke } from "@tauri-apps/api";
+import { app_device_NormalizedWaypoint } from "@bindings/index";
+import { DeviceKey } from "@utils/connections";
+
+export const sendText = async (
+  deviceKey: DeviceKey,
+  deviceChannel: number,
+  text: string,
+) => {
+  const response = (await invoke("send_text", {
+    deviceKey: deviceKey,
+    channel: deviceChannel,
+    text: text,
+  })) as undefined;
+
+  return response;
+};
+
+export const sendWaypoint = async (
+  deviceKey: DeviceKey,
+  deviceChannel: number,
+  waypoint: app_device_NormalizedWaypoint,
+) => {
+  const response = (await invoke("send_waypoint", {
+    deviceKey: deviceKey,
+    channel: deviceChannel,
+    waypoint: waypoint,
+  })) as undefined;
+
+  return response;
+};
+
+export const deleteWaypoint = async (
+  deviceKey: DeviceKey,
+  waypointId: number,
+) => {
+  const response = (await invoke("delete_waypoint", {
+    deviceKey: deviceKey,
+    waypointId: waypointId,
+  })) as undefined;
+
+  return response;
+};

src/api/radio.ts

@@ -0,0 +1,60 @@
+import { invoke } from "@tauri-apps/api";
+
+import {
+  app_ipc_DeviceBulkConfig,
+  meshtastic_protobufs_Config,
+  meshtastic_protobufs_User,
+} from "@bindings/index";
+import { DeviceKey } from "@utils/connections";
+
+export const updateDeviceConfig = async (
+  deviceKey: DeviceKey,
+  config: meshtastic_protobufs_Config,
+) => {
+  const response = (await invoke("update_device_config", {
+    deviceKey: deviceKey,
+    config: config,
+  })) as undefined;
+
+  return response;
+};
+
+export const updateDeviceUser = async (
+  deviceKey: DeviceKey,
+  user: meshtastic_protobufs_User,
+) => {
+  const response = (await invoke("update_device_user", {
+    deviceKey: deviceKey,
+    user: user,
+  })) as undefined;
+
+  return response;
+};
+
+export const startConfigurationTransaction = async (deviceKey: DeviceKey) => {
+  const response = (await invoke("start_configuration_transaction", {
+    deviceKey: deviceKey,
+  })) as undefined;
+
+  return response;
+};
+
+export const commitConfigurationTransaction = async (deviceKey: DeviceKey) => {
+  const response = (await invoke("commit_configuration_transaction", {
+    deviceKey: deviceKey,
+  })) as undefined;
+
+  return response;
+};
+
+export const updateDeviceConfigBulk = async (
+  deviceKey: DeviceKey,
+  config: app_ipc_DeviceBulkConfig,
+) => {
+  const response = (await invoke("update_device_config_bulk", {
+    deviceKey: deviceKey,
+    config: config,
+  })) as undefined;
+
+  return response;
+};