diff --git a/frontend/src/Components/SpinnerIcon.js b/frontend/src/Components/SpinnerIcon.js
deleted file mode 100644
index 5ae03ee66..000000000
--- a/frontend/src/Components/SpinnerIcon.js
+++ /dev/null
@@ -1,34 +0,0 @@
-import PropTypes from 'prop-types';
-import React from 'react';
-import { icons } from 'Helpers/Props';
-import Icon from './Icon';
-
-function SpinnerIcon(props) {
-  const {
-    name,
-    spinningName,
-    isSpinning,
-    ...otherProps
-  } = props;
-
-  return (
-    <Icon
-      name={isSpinning ? (spinningName || name) : name}
-      isSpinning={isSpinning}
-      {...otherProps}
-    />
-  );
-}
-
-SpinnerIcon.propTypes = {
-  className: PropTypes.string,
-  name: PropTypes.object.isRequired,
-  spinningName: PropTypes.object.isRequired,
-  isSpinning: PropTypes.bool.isRequired
-};
-
-SpinnerIcon.defaultProps = {
-  spinningName: icons.SPINNER
-};
-
-export default SpinnerIcon;
diff --git a/frontend/src/Components/SpinnerIcon.tsx b/frontend/src/Components/SpinnerIcon.tsx
new file mode 100644
index 000000000..27ddadc41
--- /dev/null
+++ b/frontend/src/Components/SpinnerIcon.tsx
@@ -0,0 +1,21 @@
+import React from 'react';
+import { icons } from 'Helpers/Props';
+import Icon, { IconProps } from './Icon';
+
+export interface SpinnerIconProps extends IconProps {
+  spinningName?: IconProps['name'];
+  isSpinning: Required<IconProps['isSpinning']>;
+}
+
+export default function SpinnerIcon({
+  name,
+  spinningName = icons.SPINNER,
+  ...otherProps
+}: SpinnerIconProps) {
+  return (
+    <Icon
+      name={(otherProps.isSpinning && spinningName) || name}
+      {...otherProps}
+    />
+  );
+}
diff --git a/frontend/src/Helpers/Props/icons.js b/frontend/src/Helpers/Props/icons.ts
similarity index 99%
rename from frontend/src/Helpers/Props/icons.js
rename to frontend/src/Helpers/Props/icons.ts
index aa9c23145..200adcae1 100644
--- a/frontend/src/Helpers/Props/icons.js
+++ b/frontend/src/Helpers/Props/icons.ts
@@ -16,7 +16,7 @@ import {
   faKeyboard as farKeyboard,
   faObjectGroup as farObjectGroup,
   faObjectUngroup as farObjectUngroup,
-  faSquare as farSquare
+  faSquare as farSquare,
 } from '@fortawesome/free-regular-svg-icons';
 //
 // Solid
@@ -109,7 +109,7 @@ import {
   faUser as fasUser,
   faUserPlus as fasUserPlus,
   faVial as fasVial,
-  faWrench as fasWrench
+  faWrench as fasWrench,
 } from '@fortawesome/free-solid-svg-icons';
 
 //