diff --git a/tgui/packages/tgui/components/Dropdown.tsx b/tgui/packages/tgui/components/Dropdown.tsx
index cf9465ee0a8..5d80fd2c379 100644
--- a/tgui/packages/tgui/components/Dropdown.tsx
+++ b/tgui/packages/tgui/components/Dropdown.tsx
@@ -7,12 +7,12 @@ import { Button } from './Button';
 import { Icon } from './Icon';
 import { Stack } from './Stack';
 
-export interface DropdownEntry {
+type DropdownEntry = {
   displayText: string | number | ReactNode;
   value: string | number | Enumerator;
-}
+};
 
-type DropdownUniqueProps = { options: string[] | DropdownEntry[] } & Partial<{
+type Props = { options: string[] | DropdownEntry[] } & Partial<{
   buttons: boolean;
   clipSelectedText: boolean;
   color: string;
@@ -30,9 +30,13 @@ type DropdownUniqueProps = { options: string[] | DropdownEntry[] } & Partial<{
   // you freaks really are just doing anything with this shit
   selected: any;
   width: string;
-}>;
+}> &
+  BoxProps;
 
-export type DropdownProps = BoxProps & DropdownUniqueProps;
+type State = {
+  selected?: string;
+  open: boolean;
+};
 
 const DEFAULT_OPTIONS = {
   placement: 'left-start',
@@ -43,6 +47,7 @@ const DEFAULT_OPTIONS = {
     },
   ],
 };
+
 const NULL_RECT: DOMRect = {
   width: 0,
   height: 0,
@@ -55,15 +60,10 @@ const NULL_RECT: DOMRect = {
   toJSON: () => null,
 } as const;
 
-type DropdownState = {
-  selected?: string;
-  open: boolean;
-};
-
 const DROPDOWN_DEFAULT_CLASSNAMES = 'Layout Dropdown__menu';
 const DROPDOWN_SCROLL_CLASSNAMES = 'Layout Dropdown__menu-scroll';
 
-export class Dropdown extends Component<DropdownProps, DropdownState> {
+export class Dropdown extends Component<Props, State> {
   static renderedMenu: HTMLDivElement | undefined;
   static singletonPopper: ReturnType<typeof createPopper> | undefined;
   static currentOpenMenu: Element | undefined;
@@ -72,7 +72,7 @@ export class Dropdown extends Component<DropdownProps, DropdownState> {
       Dropdown.currentOpenMenu?.getBoundingClientRect() ?? NULL_RECT,
   };
   menuContents: any;
-  state: DropdownState = {
+  state: State = {
     open: false,
     selected: this.props.selected,
   };
@@ -342,7 +342,7 @@ export class Dropdown extends Component<DropdownProps, DropdownState> {
                 overflow: clipSelectedText ? 'hidden' : 'visible',
               }}
             >
-              {displayText || this.state.selected}
+              {this.state.selected || displayText}
             </span>
             {nochevron || (
               <span className="Dropdown__arrow-button">