diff --git a/code/modules/antagonists/abductor/machinery/console.dm b/code/modules/antagonists/abductor/machinery/console.dm
index 3dcdaf5a5b07e..4c5a30c0d9e27 100644
--- a/code/modules/antagonists/abductor/machinery/console.dm
+++ b/code/modules/antagonists/abductor/machinery/console.dm
@@ -94,10 +94,19 @@
 			"items" = (category == selected_cat ? list() : null))
 		for(var/gear in possible_gear[category])
 			var/datum/abductor_gear/AG = possible_gear[category][gear]
+
+			var/atom/gear_path
+			if(!length(AG.build_path))
+				continue
+
+			gear_path = AG.build_path[1]
+
 			cat["items"] += list(list(
 				"name" = AG.name,
 				"cost" = AG.cost,
 				"desc" = AG.description,
+				"icon" = gear_path::icon,
+				"icon_state" = gear_path::icon_state,
 			))
 		data["categories"] += list(cat)
 	return data
diff --git a/tgui/packages/tgui/interfaces/AbductorConsole.jsx b/tgui/packages/tgui/interfaces/AbductorConsole.tsx
similarity index 74%
rename from tgui/packages/tgui/interfaces/AbductorConsole.jsx
rename to tgui/packages/tgui/interfaces/AbductorConsole.tsx
index bb2f1dffccfe3..d8d3305362725 100644
--- a/tgui/packages/tgui/interfaces/AbductorConsole.jsx
+++ b/tgui/packages/tgui/interfaces/AbductorConsole.tsx
@@ -5,10 +5,33 @@ import {
   Section,
   Tabs,
 } from 'tgui-core/components';
+import { BooleanLike } from 'tgui-core/react';
 
 import { useBackend, useSharedState } from '../backend';
 import { Window } from '../layouts';
-import { GenericUplink } from './Uplink/GenericUplink';
+import { GenericUplink, Item } from './Uplink/GenericUplink';
+
+type AbductorConsoleData = {
+  categories: { name: string; items: ConsoleItem[] }[];
+
+  compactMode: BooleanLike;
+  experiment: BooleanLike;
+  points?: number;
+  credits?: number;
+  pad: BooleanLike;
+  gizmo: BooleanLike;
+  vest: BooleanLike;
+  vest_mode?: number;
+  vest_lock?: BooleanLike;
+};
+
+type ConsoleItem = {
+  name: string;
+  cost: number;
+  desc: string;
+  icon: string;
+  icon_state: string;
+};
 
 export const AbductorConsole = (props) => {
   const [tab, setTab] = useSharedState('tab', 1);
@@ -47,15 +70,15 @@ export const AbductorConsole = (props) => {
 };
 
 const Abductsoft = (props) => {
-  const { act, data } = useBackend();
+  const { act, data } = useBackend<AbductorConsoleData>();
   const { experiment, points, credits, categories } = data;
 
   if (!experiment) {
     return <NoticeBox danger>No Experiment Machine Detected</NoticeBox>;
   }
 
-  const categoriesList = [];
-  const items = [];
+  const categoriesList: string[] = [];
+  const items: Item[] = [];
   for (let i = 0; i < categories.length; i++) {
     const category = categories[i];
     categoriesList.push(category.name);
@@ -67,7 +90,9 @@ const Abductsoft = (props) => {
         category: category.name,
         cost: `${item.cost} Credits`,
         desc: item.desc,
-        disabled: credits < item.cost,
+        disabled: (credits || 0) < item.cost,
+        icon: item.icon,
+        icon_state: item.icon_state,
       });
     }
   }
@@ -92,7 +117,7 @@ const Abductsoft = (props) => {
 };
 
 const EmergencyTeleporter = (props) => {
-  const { act, data } = useBackend();
+  const { act, data } = useBackend<AbductorConsoleData>();
   const { pad, gizmo } = data;
 
   if (!pad) {
@@ -115,10 +140,11 @@ const EmergencyTeleporter = (props) => {
         <LabeledList.Item label="Mark Retrieval">
           <Button
             icon={gizmo ? 'user-plus' : 'user-slash'}
-            content={gizmo ? 'Retrieve' : 'No Mark'}
             disabled={!gizmo}
             onClick={() => act('teleporter_retrieve')}
-          />
+          >
+            {gizmo ? 'Retrieve' : 'No Mark'}
+          </Button>
         </LabeledList.Item>
       </LabeledList>
     </Section>
@@ -126,7 +152,7 @@ const EmergencyTeleporter = (props) => {
 };
 
 const VestSettings = (props) => {
-  const { act, data } = useBackend();
+  const { act, data } = useBackend<AbductorConsoleData>();
   const { vest, vest_mode, vest_lock } = data;
 
   if (!vest) {
@@ -139,25 +165,25 @@ const VestSettings = (props) => {
       buttons={
         <Button
           icon={vest_lock ? 'lock' : 'unlock'}
-          content={vest_lock ? 'Locked' : 'Unlocked'}
           onClick={() => act('toggle_vest')}
-        />
+        >
+          {vest_lock ? 'Locked' : 'Unlocked'}
+        </Button>
       }
     >
       <LabeledList>
         <LabeledList.Item label="Mode">
           <Button
             icon={vest_mode === 1 ? 'eye-slash' : 'fist-raised'}
-            content={vest_mode === 1 ? 'Stealth' : 'Combat'}
             onClick={() => act('flip_vest')}
-          />
+          >
+            {vest_mode === 1 ? 'Stealth' : 'Combat'}
+          </Button>
         </LabeledList.Item>
         <LabeledList.Item label="Disguise">
-          <Button
-            icon="user-secret"
-            content="Select"
-            onClick={() => act('select_disguise')}
-          />
+          <Button icon="user-secret" onClick={() => act('select_disguise')}>
+            Select
+          </Button>
         </LabeledList.Item>
       </LabeledList>
     </Section>