Bundle Copy

tgui/packages/tgui_ch/interfaces/OvermapNavigation.tsx

@@ -0,0 +1,51 @@
+import { BooleanLike } from 'common/react';
+import { Fragment } from 'inferno';
+import { useBackend } from '../backend';
+import { Button, LabeledList, Section } from '../components';
+import { Window } from '../layouts';
+import { OvermapFlightData } from './common/Overmap';
+
+export const OvermapNavigation = () => {
+  return (
+    <Window width={380} height={530} resizable>
+      <Window.Content>
+        <OvermapNavigationContent />
+      </Window.Content>
+    </Window>
+  );
+};
+
+type Data = {
+  sector: string;
+  s_x: number;
+  s_y: number;
+  sector_info: string;
+  viewing: BooleanLike;
+};
+
+export const OvermapNavigationContent = (props, context) => {
+  const { act, data } = useBackend<Data>(context);
+  const { sector, s_x, s_y, sector_info, viewing } = data;
+  return (
+    <Fragment>
+      <Section
+        title="Current Location"
+        buttons={
+          <Button icon="eye" selected={viewing} onClick={() => act('viewing')}>
+            Map View
+          </Button>
+        }>
+        <LabeledList>
+          <LabeledList.Item label="Current Location">{sector}</LabeledList.Item>
+          <LabeledList.Item label="Coordinates">
+            {s_x} : {s_y}
+          </LabeledList.Item>
+          <LabeledList.Item label="Additional Information">{sector_info}</LabeledList.Item>
+        </LabeledList>
+      </Section>
+      <Section title="Flight Data">
+        <OvermapFlightData disableLimiterControls />
+      </Section>
+    </Fragment>
+  );
+};