web: add notification about DUT power failures

The DUT powering off due to one of the possible errors may come as a surprise
to the user. Help them troubleshoot by displaying a prominent error message.

Signed-off-by: Leonard Göhrs <l.goehrs@pengutronix.de>

Author: hnez

web/src/App.tsx

@@ -34,6 +34,7 @@ import {
   IOBusFaultNotification,
   RebootNotification,
   UpdateNotification,
+  PowerFailNotification,
   ProgressNotification,
   LocatorNotification,
   OverTemperatureNotification,
@@ -161,6 +162,7 @@ function Notifications() {
       <OverTemperatureNotification />
       <ProgressNotification />
       <UsbOverloadNotification />
+      <PowerFailNotification />
       <UpdateNotification />
       <LocatorNotification />
       <IOBusFaultNotification />

web/src/TacComponents.tsx

@@ -96,6 +96,17 @@ enum UsbOverload {
   Port3 = "Port3",
 }
 
+enum OutputState {
+  On = "On",
+  Off = "Off",
+  OffFloating = "OffFloating",
+  Changing = "Changing",
+  InvertedPolarity = "InvertedPolarity",
+  OverCurrent = "OverCurrent",
+  OverVoltage = "OverVoltage",
+  RealtimeViolation = "RealtimeViolation",
+}
+
 type Duration = {
   secs: number;
   nanos: number;
@@ -563,3 +574,48 @@ export function UsbOverloadNotification() {
     </Alert>
   );
 }
+
+export function PowerFailNotification() {
+  const state = useMqttSubscription<OutputState>("/v1/dut/powered");
+
+  let reason = null;
+
+  switch (state) {
+    case OutputState.InvertedPolarity:
+      reason = "an inverted polarity event";
+      break;
+    case OutputState.OverCurrent:
+      reason = "an overcurrent event";
+      break;
+    case OutputState.OverVoltage:
+      reason = "an overvoltage event";
+      break;
+    case OutputState.RealtimeViolation:
+      reason = "a realtime violation";
+      break;
+  }
+
+  return (
+    <Alert
+      statusIconAriaLabel="Info"
+      visible={reason !== null}
+      action={
+        <SpaceBetween size="xs">
+          <MqttButton iconName="refresh" topic="/v1/dut/powered" send={"On"}>
+            Turn DUT back on
+          </MqttButton>
+          <MqttButton
+            iconName="status-stopped"
+            topic="/v1/dut/powered"
+            send={"Off"}
+          >
+            Keep DUT powered off
+          </MqttButton>
+        </SpaceBetween>
+      }
+      header="DUT powered off"
+    >
+      The DUT was powered off due to {reason}.
+    </Alert>
+  );
+}