Prettify everything

Author: Ives van Hoorne

package.json

@@ -170,18 +170,9 @@
     "precommit": "lint-staged"
   },
   "lint-staged": {
-    "*.js": [
-      "prettier --write --single-quote --trailing-comma none",
-      "git add"
-    ],
-    "*.css": [
-      "prettier --write --single-quote --trailing-comma none",
-      "git add"
-    ],
-    "*.json": [
-      "prettier --write --single-quote --trailing-comma none",
-      "git add"
-    ]
+    "*.js": ["prettier --write", "git add"],
+    "*.css": ["prettier --write", "git add"],
+    "*.json": ["prettier --write", "git add"]
   },
   "jest": {
     "rootDir": "src",

src/app/components/HeaderSearchBar.js

@@ -38,7 +38,7 @@ const Input = styled.input`
 const StyledSearchIcon = styled(SearchIcon)`
   position: absolute;
   right: 0.5em;
-  font-size: .875em;
+  font-size: 0.875em;
 `;
 
 export default class HeaderSearchBar extends React.PureComponent {

src/app/components/HoverMenu.js

@@ -52,10 +52,6 @@ export default class HoverMenu extends React.PureComponent {
 
   render() {
     const { children } = this.props;
-    return (
-      <div ref={this.setOnclickListener}>
-        {children}
-      </div>
-    );
+    return <div ref={this.setOnclickListener}>{children}</div>;
   }
 }

src/app/components/Loading.js

@@ -13,9 +13,10 @@ const LogoContainer = styled.div`
   animation-duration: 800ms;
 `;
 
-export default () =>
+export default () => (
   <Centered vertical horizontal>
     <LogoContainer>
       <Logo width={490} height={490} />
     </LogoContainer>
-  </Centered>;
+  </Centered>
+);

src/app/components/Logo.js

@@ -4,7 +4,11 @@ export default ({
   width = 35,
   height = 35,
   className,
-}: { width: number, height: number, className: ?string }) => (
+}: {
+  width: number,
+  height: number,
+  className: ?string,
+}) => (
   <svg
     x="0px"
     y="0px"

src/app/components/Preference/PreferenceDropdown.js

@@ -21,11 +21,7 @@ export default class PreferenceInput extends React.PureComponent {
     const { value, options } = this.props;
     return (
       <Select onChange={this.handleChange} value={value}>
-        {options.map(op =>
-          <option key={op}>
-            {op}
-          </option>,
-        )}
+        {options.map(op => <option key={op}>{op}</option>)}
       </Select>
     );
   }

src/app/components/Preference/PreferenceNumber.js

@@ -3,9 +3,7 @@ import styled from 'styled-components';
 
 import Input from 'app/components/Input';
 
-const StyledInput = styled(Input)`
-  text-align: center;
-`;
+const StyledInput = styled(Input)`text-align: center;`;
 
 type Props = {
   value: boolean,

src/app/components/Preference/index.js

@@ -71,20 +71,18 @@ export default class Preference extends React.Component {
   render() {
     const { title, className, value, tooltip } = this.props;
 
-    const Title = tooltip
-      ? <Tooltip position="right" title={tooltip}>
-          {title}
-        </Tooltip>
-      : <span>
-          {title}
-        </span>;
+    const Title = tooltip ? (
+      <Tooltip position="right" title={tooltip}>
+        {title}
+      </Tooltip>
+    ) : (
+      <span>{title}</span>
+    );
 
     return (
       <Container className={className}>
         {Title}
-        <div>
-          {this.getOptionComponent(value)}
-        </div>
+        <div>{this.getOptionComponent(value)}</div>
       </Container>
     );
   }

src/app/components/Stat/index.js

@@ -24,7 +24,7 @@ const Number = styled.div`
 
 const Property = styled.div`
   font-weight: 400;
-  font-size: .875em;
+  font-size: 0.875em;
   color: rgba(255, 255, 255, 0.5);
   text-transform: uppercase;
   margin-bottom: 0.4rem;

src/app/components/Switch.js

@@ -15,7 +15,7 @@ const Container = styled.div`
   background-color: ${getColor};
   width: ${({ small }) => (small ? 3 : 3.5)}rem;
   color: rgba(0, 0, 0, 0.5);
-  border: 1px solid rgba(0, 0, 0, .1);
+  border: 1px solid rgba(0, 0, 0, 0.1);
   padding: 0.5rem;
   height: ${props => (props.small ? 20 : 26)}px;
   box-sizing: border-box;
@@ -61,7 +61,7 @@ export default ({
   secondary = false,
   offMode = false,
   small = false,
-}: Props) =>
+}: Props) => (
   <Container
     small={small}
     secondary={secondary}
@@ -70,4 +70,5 @@ export default ({
     right={right}
   >
     <Dot small={small} right={right} />
-  </Container>;
+  </Container>
+);