Convert SpinnerIcon to TypeScript

(cherry picked from commit 25d9f09a43ded9dd07c6777390fc541ca5f89eeb)

frontend/src/Components/SpinnerIcon.js

@@ -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;

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}
+    />
+  );
+}

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';
 
 //