fix tech memories data tab

cmss13-devs · Jan 21, 2024 · a922d83 · a922d83
1 parent 0016ed5
commit a922d83
Showing 1 changed file with 38 additions and 8 deletions.
diff --git a/...packages/tgui/interfaces/TechMemories.jsx → ...packages/tgui/interfaces/TechMemories.tsx b/...packages/tgui/interfaces/TechMemories.jsx → ...packages/tgui/interfaces/TechMemories.tsx
@@ -1,11 +1,41 @@
 import { useBackend, useLocalState } from '../backend';
-import { Button, Flex, Section, Box, Tabs, Fragment, LabeledList } from '../components';
+import { Button, Flex, Section, Box, Tabs, LabeledList } from '../components';
 import { Window } from '../layouts';
 
-export const TechMemories = (props) => {
-  const { act, data } = useBackend();
-  const [clueCategory, setClueCategory] = useLocalState('clueCategory', 0);
+type Clue = {
+  text: string;
+  itemID: string;
+  location: string;
+  color?: string;
+  color_name?: string;
+  key?: string;
+  key_text?: string;
+};
 
+type ClueCategory = {
+  name: string;
+  icon: string;
+  clues: Array<Clue>;
+};
+
+type ObjectiveData = {
+  label: string;
+  content_credits: string;
+  content: string;
+  content_color: string;
+};
+
+type TechProps = {
+  clue_categories: Array<ClueCategory>;
+  tech_points: number;
+  total_tech_points: number;
+  objectives: Array<ObjectiveData>;
+  theme: string;
+};
+
+export const TechMemories = () => {
+  const { config, data } = useBackend<TechProps>();
+  const [clueCategory, setClueCategory] = useLocalState('clueCategory', 0);
   const { tech_points, theme, clue_categories } = data;
 
   return (
@@ -42,7 +72,7 @@ export const TechMemories = (props) => {
   );
 };
 
-const CluesAdvanced = (props) => {
+const CluesAdvanced = (props: { readonly clues: Array<Clue> }) => {
   const { clues } = props;
 
   return (
@@ -69,12 +99,12 @@ const CluesAdvanced = (props) => {
                   </Box>
                 )}
                 {!!clue.key && (
-                  <Fragment>
+                  <>
                     {clue.key_text}
                     <Box inline bold>
                       {clue.key}
                     </Box>
-                  </Fragment>
+                  </>
                 )}
               </Flex.Item>
               <Flex.Item>{clue.location}</Flex.Item>
@@ -87,7 +117,7 @@ const CluesAdvanced = (props) => {
 };
 
 const Objectives = (props) => {
-  const { data } = useBackend();
+  const { data } = useBackend<TechProps>();
 
   return (
     <Section