Update to FontAwesome5

frontend/src/Components/Icon.js

@@ -1,6 +1,7 @@
 import PropTypes from 'prop-types';
 import React from 'react';
-import { icons, kinds } from 'Helpers/Props';
+import FontAwesomeIcon from '@fortawesome/react-fontawesome';
+import { kinds } from 'Helpers/Props';
 import classNames from 'classnames';
 import styles from './Icon.css';
 
@@ -11,38 +12,42 @@ function Icon(props) {
     kind,
     size,
     title,
-    isSpinning
+    isSpinning,
+    ...otherProps
   } = props;
 
   return (
-    <i
+    <FontAwesomeIcon
       className={classNames(
-        name,
         className,
-        styles[kind],
-        isSpinning && icons.SPIN
+        styles[kind]
       )}
+      icon={name}
+      spin={isSpinning}
       title={title}
       style={{
         fontSize: `${size}px`
       }}
+      {...otherProps}
     />
   );
 }
 
 Icon.propTypes = {
   className: PropTypes.string,
-  name: PropTypes.string.isRequired,
+  name: PropTypes.object.isRequired,
   kind: PropTypes.string.isRequired,
   size: PropTypes.number.isRequired,
   title: PropTypes.string,
-  isSpinning: PropTypes.bool.isRequired
+  isSpinning: PropTypes.bool.isRequired,
+  fixedWidth: PropTypes.bool.isRequired
 };
 
 Icon.defaultProps = {
   kind: kinds.DEFAULT,
   size: 14,
-  isSpinning: false
+  isSpinning: false,
+  fixedWidth: false
 };
 
 export default Icon;