From a7eb555cd08fbd8fc28a4d4e3d06476dab04f60c Mon Sep 17 00:00:00 2001
From: paulrpg <mullenpaul90@gmail.com>
Date: Tue, 14 Nov 2023 20:00:43 +0000
Subject: [PATCH] tracked down bugs which came up during firemission creation
 and equipment selection

---
 .../tgui/interfaces/MfdPanels/FiremissionPanel.tsx    | 11 ++++++++---
 .../tgui/interfaces/MfdPanels/SupportPanel.tsx        |  6 +++---
 2 files changed, 11 insertions(+), 6 deletions(-)

diff --git a/tgui/packages/tgui/interfaces/MfdPanels/FiremissionPanel.tsx b/tgui/packages/tgui/interfaces/MfdPanels/FiremissionPanel.tsx
index 3dc4a7b8d364..87a468e3fdec 100644
--- a/tgui/packages/tgui/interfaces/MfdPanels/FiremissionPanel.tsx
+++ b/tgui/packages/tgui/interfaces/MfdPanels/FiremissionPanel.tsx
@@ -6,6 +6,10 @@ import { range } from 'common/collections';
 import { DropshipEquipment, DropshipProps } from '../DropshipWeaponsConsole';
 import { fmEditState, fmState, fmWeaponEditState, mfdState } from './stateManagers';
 
+function sortWeapons(a: DropshipEquipment, b: DropshipEquipment): number {
+  return (a?.mount_point ?? 0) < (b?.mount_point ?? 0) ? -1 : 1;
+}
+
 const CreateFiremissionPanel = (props, context) => {
   const { act } = useBackend(context);
   const [fmName, setFmName] = useLocalState<string>(context, 'fmname', '');
@@ -205,7 +209,8 @@ const FiremissionView = (props: MfdProps & { fm: CasFiremission }, context) => {
 
   const weaponData = props.fm.records
     .map((x) => data.equipment_data.find((y) => y.mount_point === x.weapon))
-    .filter((x) => x !== undefined) as Array<DropshipEquipment>;
+    .filter((x) => x !== undefined)
+    .sort(sortWeapons) as Array<DropshipEquipment>;
 
   const selectedWeapon = weaponData.find((x) => x.mount_point === editFmWeapon);
   const displayDetail = editFm;
@@ -273,8 +278,8 @@ const FiremissionView = (props: MfdProps & { fm: CasFiremission }, context) => {
 
 const gimbals: GimbalInfo[] = [
   { min: -1, max: -1, values: [] },
-  { min: -6, max: 0, values: ['-6', '-5', '-4 ', '-3', '-2', '-1', '0', '-'] },
-  { min: -6, max: 0, values: ['-6', '-5', '-4 ', '-3', '-2', '-1', '0', '-'] },
+  { min: -6, max: 0, values: ['-6', '-5', '-4', '-3', '-2', '-1', '0', '-'] },
+  { min: -6, max: 0, values: ['-6', '-5', '-4', '-3', '-2', '-1', '0', '-'] },
   { min: 0, max: 6, values: ['-', '0', '1', '2', '3', '4', '5', '6'] },
   { min: 0, max: 6, values: ['-', '0', '1', '2', '3', '4', '5', '6'] },
 ];
diff --git a/tgui/packages/tgui/interfaces/MfdPanels/SupportPanel.tsx b/tgui/packages/tgui/interfaces/MfdPanels/SupportPanel.tsx
index 74443613b0e8..020e65362abd 100644
--- a/tgui/packages/tgui/interfaces/MfdPanels/SupportPanel.tsx
+++ b/tgui/packages/tgui/interfaces/MfdPanels/SupportPanel.tsx
@@ -9,7 +9,7 @@ import { EquipmentContext } from './types';
 import { mfdState, useEquipmentState } from './stateManagers';
 
 export const SupportMfdPanel = (props: MfdProps, context) => {
-  const { equipmentState } = useEquipmentState(props.panelStateId, context);
+  const { equipmentState } = useEquipmentState(context, props.panelStateId);
 
   const { setPanelState } = mfdState(context, props.panelStateId);
 
@@ -39,14 +39,14 @@ export const SupportMfdPanel = (props: MfdProps, context) => {
         },
       ]}>
       <Box className="NavigationMenu">
-        <Stack align="center">
+        <Stack align="center" vertical>
           <Stack.Item>
             <h3>Component {result?.shorthand} not found</h3>
           </Stack.Item>
           <Stack.Item>
             <h3>Is this authorised equipment?</h3>
           </Stack.Item>
-          <Stack.Item>
+          <Stack.Item width="300px">
             <h3>
               Contact your local WY representative for further upgrade options
             </h3>