Everything compiling again

website/src/ui/Loader.js

@@ -1,51 +1,43 @@
-import React from 'react';
-import PropTypes from 'prop-types';
-import { keyframes, css } from 'emotion';
-import { onlyUpdateForKeys } from 'recompose';
-
-// This returns an animation
-const pulse = keyframes`
-  0% {transform: scale(1);opacity: 1}
-  45% {transform: scale(0.1);opacity: 0.7}
-  80% {transform: scale(1);opacity: 1}
-`;
+import React from 'react'
+import Radium from 'radium'
+import PropTypes from 'prop-types'
 
 class Loader extends React.Component {
-  style = i => css`{
-        background-color: ${this.props.color};
-        width: ${this.props.size}px;
-        height: ${this.props.size}px;
-        margin: ${this.props.margin};
-        border-radius: 100%;
-        display: inline-block;
-        animation: ${pulse} 0.75s ${i * 0.12}s infinite cubic-bezier(.2,.68,.18,1.08);
-        animation-fill-mode: both;
-    }`;
+  static propTypes = {
+    color: PropTypes.string,
+    size: PropTypes.number,
+    margin: PropTypes.string
+  }
+
+  static defaultProps = {
+    color: '#000000',
+    size: 15,
+    margin: '2px'
+  }
+
+  style(i) {
+    return {
+      backgroundColor: `${this.props.color}`,
+      width: `${this.props.size}px`,
+      height: `${this.props.size}px`,
+      margin: `${this.props.margin}`,
+      borderRadius: '100%',
+      display: 'inline-block',
+      // 0% {transform: scale(1); opacity: 1} 45% {transform: scale(0.1); opacity: 0.7} 80% {transform: scale(1); opacity: 1} 0.75s ${i * 0.12}s infinite cubic-bezier(.2,.68,.18,1.08)
+      animation: ``,
+      animationFillMode: 'both'
+    }
+  }
 
   render() {
-    return this.props.loading ?
+    return (
       <div>
         <div className={this.style(1)} />
         <div className={this.style(2)} />
         <div className={this.style(3)} />
-      </div> : null;
+      </div>
+    )
   }
 }
 
-Loader.propTypes = {
-  loading: PropTypes.bool,
-  color: PropTypes.string,
-  size: PropTypes.number,
-  margin: PropTypes.string
-};
-
-Loader.defaultProps = {
-  loading: true,
-  color: '#000000',
-  size: 15,
-  margin: '2px'
-};
-
-const Component = onlyUpdateForKeys(['loading', 'color', 'size', 'margin'])(Loader);
-Component.defaultProps = Loader.defaultProps;
-export default Component;
+export default Radium(Loader)