feat: selector updates

src/lib/shared/hooks/interfaces/useIRunRouteAction.ts

@@ -5,16 +5,20 @@ import { useWebsocketContext } from 'src/lib/utils/useWebsocketContext';
 export function useIRunRouteAction(key: string): IRunRouteActionProps | undefined {
   const { sendMessage } = useWebsocketContext();
   const routingState = useGetDevice<RoutingState>(key);
-  if (!routingState) return undefined;
 
-  const runRoute = (sourceListkey: string) => {
-    sendMessage(`/device/${key}/source`, { sourceListkey });
+  const runRoute = (request: RouteRequest) => {
+    sendMessage(`/room/${key}/source`, request);
   };
 
   return { routingState, runRoute };
 }
 
 export interface IRunRouteActionProps {
-  routingState: RoutingState;
-  runRoute: (sourceListkey: string) => void;
+  routingState: RoutingState | undefined;
+  runRoute: (request: RouteRequest) => void;
+}
+
+export interface RouteRequest {
+  sourceListItemKey: string;
+  sourceListKey?: string;
 }

src/lib/store/devices/devicesSelectors.ts

@@ -1,19 +1,14 @@
-import { createSelector } from '@reduxjs/toolkit';
 import { useAppSelector } from '../hooks';
-import store, { RootState } from '../rootReducer';
+
 
 /**
- * Memoized selector to get all devices
- * @returns all devices
+ * Selector for all devices
+ * @returns Record<string, DeviceState>
  */
 export const useGetAllDevices = () => {
-  return createSelector(
-      [(state: RootState) => state.devices],
-      (devicesRecord) => devicesRecord ? Object.values(devicesRecord) : undefined  
-  )(store.getState())
+  return useAppSelector((state) => state.devices);
 }
 
-
 // TODO: Make this generic to take a type to cast the return as
 /**
  * Selector for a single device
@@ -22,4 +17,5 @@ export const useGetAllDevices = () => {
  */
 export function useGetDevice<T>(deviceKey: string): T | undefined {
   return useAppSelector((state) => state.devices[deviceKey] ? state.devices[deviceKey] : undefined) as T | undefined;
-}
+}
+

src/lib/store/rooms/roomsSelectors.ts

@@ -1,6 +1,9 @@
+import { createSelector } from '@reduxjs/toolkit';
 import { RoomVolumeType, Volume } from 'src/lib/types';
 import { DisplayState } from "src/lib/types/state/state";
+import { useGetAllDevices } from '../devices/devicesSelectors';
 import { useAppSelector } from "../hooks";
+import store, { RootState } from '../rootReducer';
 
 export const useRoomConfiguration = (roomKey: string) =>
   useAppSelector((state) =>
@@ -89,30 +92,27 @@ export const useRoomShareState = (roomKey: string) =>
  * @param roomKey
  * @returns the display states for the room's displays
  */
-export const useGetRoomDisplayStates = (roomKey: string) =>
-  useAppSelector((state) => {
-    const destinations = Object.entries(state.rooms[roomKey]?.configuration?.destinations ?? {});
-
-    if(!destinations) return undefined;
-
-    const displayKeys = destinations.filter(([key]) => key !== "programAudio" && key !== "codecContent");
-
-    console.log("displayKeys", displayKeys);
-
-    // filter state.devices to only include the values in displayKeys
-
-    const devices = Object.values(state.devices);
-
-    const displays = devices.filter((device) =>
-      Object.values(displayKeys).includes(device.key)
-    );
-
-    // const displays = Object.entries(state.devices).filter(([key,]) =>
-    //   displayKeys.includes(key)
-    // );
-
-    return (displays as DisplayState[]) || undefined;
-  });
+export const useGetRoomDisplayStates = (roomKey: string) => {
+  return createSelector(
+    [
+      (_state, roomKey: string) => roomKey,
+      useGetAllDevices,
+      (state: RootState) => state.rooms[roomKey]?.configuration?.destinations,     
+    ],
+    (roomKey, deviceStates, destinations) => {
+      console.log("roomKey", roomKey);
+      console.log("devices", deviceStates);
+      console.log("destinations", destinations);
+      if (!destinations) return undefined;
+
+      const displayKeys = Object.entries(destinations).filter(([key]) => key !== "programAudio" && key !== "codecContent").map(([,value]) => value);
+
+      const displayStates = Object.values(deviceStates).filter((device) => Object.values(displayKeys).includes(device.key));
+
+      return displayStates as DisplayState[];
+    }
+  )(store.getState(), roomKey);
+};
 
 export const useGetZoomRoomControllerKey = (roomKey: string) =>
   useAppSelector((state) =>

src/lib/types/state/state/DeviceInfoState.ts

@@ -0,0 +1,11 @@
+export interface DeviceInfoState {
+    HostName: string;
+
+    IpAddress: string;
+
+    MacAddress: string;
+
+    SerialNumber: string;
+
+    FirmwareVersion: string;
+}