Updated relief valve UI to tgui-next

tgui-next/packages/tgui/interfaces/AtmosRelief.js

@@ -0,0 +1,54 @@
+import { useBackend } from '../backend';
+import { Button, LabeledList, NumberInput, Section } from '../components';
+
+export const AtmosRelief = props => {
+  const { act, data } = useBackend(props);
+  return (
+    <Section>
+      <LabeledList>
+        <LabeledList.Item label="Open Pressure">
+          <NumberInput
+            animated
+            value={parseFloat(data.open_pressure)}
+            unit="kPa"
+            width="75px"
+            minValue={0}
+            maxValue={4500}
+            step={10}
+            onChange={(e, value) => act('open_pressure', {
+              open_pressure: value,
+            })} />
+          <Button
+            ml={1}
+            icon="plus"
+            content="Max"
+            disabled={data.open_pressure === data.max_pressure}
+            onClick={() => act('open_pressure', {
+              open_pressure: 'max',
+            })} />
+        </LabeledList.Item>
+        <LabeledList.Item label="Close Pressure">
+          <NumberInput
+            animated
+            value={parseFloat(data.close_pressure)}
+            unit="kPa"
+            width="75px"
+            minValue={0}
+            maxValue={data.open_pressure}
+            step={10}
+            onChange={(e, value) => act('close_pressure', {
+              close_pressure: value,
+            })} />
+          <Button
+            ml={1}
+            icon="plus"
+            content="Max"
+            disabled={data.close_pressure === data.open_pressure}
+            onClick={() => act('close_pressure', {
+              close_pressure: 'max',
+            })} />
+        </LabeledList.Item>
+      </LabeledList>
+    </Section>
+  );
+};

tgui-next/packages/tgui/routes.js

@@ -87,6 +87,7 @@ import { ThermoMachine } from './interfaces/ThermoMachine';
 import { TurbineComputer } from './interfaces/TurbineComputer';
 import { VaultController } from './interfaces/VaultController';
 import { Wires } from './interfaces/Wires';
+import { AtmosRelief } from './interfaces/AtmosRelief';
 
 const ROUTES = {
   achievements: {
@@ -129,6 +130,10 @@ const ROUTES = {
     component: () => AtmosPump,
     scrollable: false,
   },
+  atmos_relief: {
+    component: () => AtmosRelief,
+    scrollable: false,
+  },
   bepis: {
     component: () => Bepis,
     scrollable: false,