diff --git a/app/types.ts b/app/types.ts index 8ac765f..1ebe9c5 100644 --- a/app/types.ts +++ b/app/types.ts @@ -141,3 +141,8 @@ export interface ConfigOutputIocMacro { name: string; value: string; } + +export interface targetStation { + targetStation: string; + instruments: Array; +} diff --git a/app/wall/components/ShowHideBeamInfo.tsx b/app/wall/components/ShowHideBeamInfo.tsx index d92012d..c728de2 100644 --- a/app/wall/components/ShowHideBeamInfo.tsx +++ b/app/wall/components/ShowHideBeamInfo.tsx @@ -23,8 +23,9 @@ export default function ShowHideBeamInfo() { beam info diff --git a/app/wall/page.tsx b/app/wall/page.tsx index 92ad0dd..00cb552 100644 --- a/app/wall/page.tsx +++ b/app/wall/page.tsx @@ -1,104 +1,102 @@ "use client"; -import { Inter } from "next/font/google"; -import { useState, useEffect } from "react"; +import { useEffect, useState } from "react"; import useWebSocket from "react-use-websocket"; import { dehex_and_decompress } from "../components/dehex_and_decompress"; import InstrumentGroup from "./components/InstrumentGroup"; import ShowHideBeamInfo from "./components/ShowHideBeamInfo"; import JenkinsJobIframe from "./components/JenkinsJobsIframe"; -import { - IfcInstrumentStatus, - IfcPVWSMessage, - IfcPVWSRequest, -} from "@/app/types"; - -const inter = Inter({ subsets: ["latin"] }); +import { IfcPVWSMessage, IfcPVWSRequest, targetStation } from "@/app/types"; export default function WallDisplay() { const runstatePV = "DAE:RUNSTATE_STR"; const instListPV = "CS:INSTLIST"; - const [TS1Data] = useState>( - [ - { name: "ALF" }, - { name: "CRISP" }, - { name: "EMMA-A" }, - { name: "EMU" }, - { name: "ENGINX" }, - { name: "GEM" }, - { - name: "HIFI-CRYOMAG", - }, - { name: "HRPD" }, - { name: "INES" }, - { name: "IRIS" }, - { name: "LOQ" }, - { name: "MAPS" }, - { name: "MARI" }, - { name: "MERLIN" }, - { name: "MUONFE" }, - { name: "MUSR" }, - { name: "OSIRIS" }, - { name: "PEARL" }, - { name: "POLARIS" }, - { name: "RIKENFE" }, - { name: "SANDALS" }, - { name: "SCIDEMO" }, - { name: "SURF" }, - { name: "SXD" }, - { name: "TOSCA" }, - { name: "VESUVIO" }, - ].sort((a, b) => a.name.localeCompare(b.name)), - ); - const [TS2Data] = useState>( - [ - { name: "CHIPIR" }, - { name: "IMAT" }, - { name: "INTER" }, - { name: "LARMOR" }, - { name: "LET" }, - { name: "NIMROD" }, - { name: "OFFSPEC" }, - { name: "POLREF" }, - { name: "SANS2D" }, - { name: "WISH" }, - { name: "ZOOM" }, - ].sort((a, b) => a.name.localeCompare(b.name)), - ); - const [miscData] = useState>( - [ - { name: "ARGUS" }, - { name: "CHRONUS" }, - { - name: "CRYOLAB_R80", - }, - { name: "DCLAB" }, - { name: "DEMO" }, - { name: "DETMON" }, - { - name: "ENGINX_SETUP", - }, - { name: "HIFI" }, - { - name: "HRPD_SETUP", - }, - { - name: "IBEXGUITEST", - }, - { - name: "IRIS_SETUP", - }, - { name: "MOTION" }, - { - name: "PEARL_SETUP", - }, - { name: "SELAB" }, - { name: "SOFTMAT" }, - { - name: "WISH_SETUP", - }, - ].sort((a, b) => a.name.localeCompare(b.name)), - ); + const [data, setData] = useState>([ + { + targetStation: "Target Station 1", + instruments: [ + { name: "ALF" }, + { name: "CRISP" }, + { name: "EMMA-A" }, + { name: "EMU" }, + { name: "ENGINX" }, + { name: "GEM" }, + { + name: "HIFI-CRYOMAG", + }, + { name: "HRPD" }, + { name: "INES" }, + { name: "IRIS" }, + { name: "LOQ" }, + { name: "MAPS" }, + { name: "MARI" }, + { name: "MERLIN" }, + { name: "MUONFE" }, + { name: "MUSR" }, + { name: "OSIRIS" }, + { name: "PEARL" }, + { name: "POLARIS" }, + { name: "RIKENFE" }, + { name: "SANDALS" }, + { name: "SCIDEMO" }, + { name: "SURF" }, + { name: "SXD" }, + { name: "TOSCA" }, + { name: "VESUVIO" }, + ].sort((a, b) => a.name.localeCompare(b.name)), + }, + { + targetStation: "Target Station 2", + instruments: [ + { name: "CHIPIR" }, + { name: "IMAT" }, + { name: "INTER" }, + { name: "LARMOR" }, + { name: "LET" }, + { name: "NIMROD" }, + { name: "OFFSPEC" }, + { name: "POLREF" }, + { name: "SANS2D" }, + { name: "WISH" }, + { name: "ZOOM" }, + ].sort((a, b) => a.name.localeCompare(b.name)), + }, + { + targetStation: "Miscellaneous", + instruments: [ + { name: "ARGUS" }, + { name: "CHRONUS" }, + { + name: "CRYOLAB_R80", + }, + { name: "DCLAB" }, + { name: "DEMO" }, + { name: "DETMON" }, + { + name: "ENGINX_SETUP", + }, + { name: "HIFI" }, + { + name: "HRPD_SETUP", + }, + { + name: "IBEXGUITEST", + }, + { + name: "IRIS_SETUP", + }, + { name: "MOTION" }, + { + name: "PEARL_SETUP", + }, + { name: "SELAB" }, + { name: "SOFTMAT" }, + { + name: "WISH_SETUP", + }, + ].sort((a, b) => a.name.localeCompare(b.name)), + }, + ]); const socketURL = process.env.NEXT_PUBLIC_WS_URL!; @@ -140,32 +138,45 @@ export default function WallDisplay() { // Iterate through the instlist, find their associated object in the ts1data, ts2data or miscData arrays, get the runstate PV and subscribe const instName = item["name"]; const instPrefix = item["pvPrefix"]; - const foundInstrument = [...TS1Data, ...TS2Data, ...miscData].find( - (instrument) => instrument.name === instName, - ); - if (foundInstrument) { - // Subscribe to the instrument's runstate PV - foundInstrument.pv = instPrefix + runstatePV; - sendJsonMessage({ type: "subscribe", pvs: [foundInstrument.pv] }); - } + setData((prev) => { + const newData: Array = [...prev]; + newData.map((targetStation) => { + const foundInstrument = targetStation.instruments.find( + (instrument) => instrument.name === instName, + ); + if (foundInstrument) { + // Subscribe to the instrument's runstate PV + foundInstrument.pv = instPrefix + runstatePV; + sendJsonMessage({ + type: "subscribe", + pvs: [foundInstrument.pv], + }); + } + }); + return newData; + }); } } - } else { - // An instrument's runstate has changed. Find the instrument and update its status (if there is one!). - const foundInstrument = [...TS1Data, ...TS2Data, ...miscData].find( - (instrument) => instrument.pv === updatedPVName, - ); - if (updatedPVvalue && foundInstrument) { - foundInstrument.status = updatedPVvalue; - } + } else if (updatedPVvalue) { + setData((prev) => { + const newData: Array = [...prev]; + newData.map((targetStation) => { + const foundInstrument = targetStation.instruments.findIndex( + (instrument) => instrument.pv === updatedPVName, + ); + if (foundInstrument >= 0) + targetStation.instruments[foundInstrument].status = updatedPVvalue; + }); + return newData; + }); } - }, [lastJsonMessage, TS1Data, TS2Data, miscData, sendJsonMessage]); + }, [lastJsonMessage, sendJsonMessage]); return (
-
+
@@ -176,18 +187,16 @@ export default function WallDisplay() {

Instrument Status:

- - - + + {data.map((targetStation) => { + return ( + + ); + })}