style: remove unused imports

src/components/Cart/Cart.js

@@ -10,7 +10,6 @@ import {
 } from 'react-icons/md';
 
 import StoreContext from '../../context/StoreContext';
-import InterfaceContext from '../../context/InterfaceContext';
 import CartList from './CartList';
 import CartIndicator from './CartIndicator';
 import EmptyCart from './EmptyCart';
@@ -22,7 +21,6 @@ import {
   breakpoints,
   colors,
   fonts,
-  radius,
   spacing,
   dimensions
 } from '../../utils/styles';

src/components/Cart/CartIndicator.js

@@ -2,10 +2,7 @@ import React, { Component } from 'react';
 import PropTypes from 'prop-types';
 import styled from 'react-emotion';
 
-import { MdSentimentSatisfied } from 'react-icons/md';
-
 import { colors, dimensions, radius, spacing } from '../../utils/styles';
-import gift from '../../assets/gift.png';
 
 const CartIndicatorRoot = styled(`div`)`
   background: ${colors.lemon};
@@ -26,7 +23,7 @@ class CartIndicator extends Component {
     message: ''
   };
 
-  componentDidUpdate(prevProps, prevState) {
+  componentDidUpdate(prevProps) {
     if (prevProps.adding !== this.props.adding) {
       if (this.props.adding) {
         this.setState({

src/components/Cart/CartThumbail.js

@@ -3,7 +3,7 @@ import { graphql, StaticQuery } from 'gatsby';
 import styled from 'react-emotion';
 import Image from 'gatsby-image';
 
-import { colors, spacing, radius } from '../../utils/styles';
+import { colors, radius } from '../../utils/styles';
 
 const CartThumbailRoot = styled(Image)`
   border: 1px solid ${colors.brandLight};

src/components/Cart/ShippingInfo.js

@@ -4,7 +4,6 @@ import styled, { keyframes } from 'react-emotion';
 import { MdKeyboardArrowDown, MdInfo } from 'react-icons/md';
 
 import { colors, radius, spacing, defaultFontStack } from '../../utils/styles';
-import gift from '../../assets/gift.png';
 
 const ShippingInfoRoot = styled(`div`)`
   background: #f5f5f5;
@@ -73,7 +72,7 @@ class ShippingInfo extends Component {
     detailsVisible: false
   };
 
-  toggle = e => {
+  toggle = () => {
     this.setState({ detailsVisible: !this.state.detailsVisible });
   };
 

src/components/ContributorArea/AreaTypography.js

@@ -1,13 +1,6 @@
 import styled from 'react-emotion';
 
-import {
-  breakpoints,
-  colors,
-  fonts,
-  radius,
-  spacing,
-  dimensions
-} from '../../utils/styles';
+import { colors, fonts, spacing } from '../../utils/styles';
 
 export const SectionHeading = styled(`h3`)`
   color: ${colors.lightest};

src/components/ContributorArea/CloseBar.js

@@ -1,25 +1,19 @@
 import React, { Component } from 'react';
 import PropTypes from 'prop-types';
-import styled, { keyframes } from 'react-emotion';
+import styled from 'react-emotion';
 
 import { MdArrowForward, MdClose } from 'react-icons/md';
 
 import {
   breakpoints,
   colors,
   fonts,
-  radius,
   spacing,
-  dimensions,
-  durations
+  dimensions
 } from '../../utils/styles';
 
 const {
-  contributorAreaWidth: {
-    openDesktop: desktopMaxWidth,
-    openHd: hdMaxWidth,
-    closed: desktopMinWidth
-  },
+  contributorAreaWidth: { openDesktop: desktopMaxWidth, openHd: hdMaxWidth },
   contributorAreaBarHeight: height
 } = dimensions;
 
@@ -154,7 +148,7 @@ class CloseBar extends Component {
   }
 
   render() {
-    const { status, onClick, isDesktopViewport } = this.props;
+    const { onClick, isDesktopViewport } = this.props;
     const { className } = this.state;
 
     return (

src/components/ContributorArea/ContentContainer.js

@@ -1,21 +1,12 @@
-import React, { Component } from 'react';
-import PropTypes from 'prop-types';
+import React from 'react';
 import styled, { keyframes } from 'react-emotion';
 
 import UserContext from '../../context/UserContext';
 import Butler from '../../assets/Butler';
-import { Button } from '../shared/Buttons';
 import ContentForNotLoggedIn from './ContentForNotLoggedIn';
 import ContentForLoggedIn from './ContentForLoggedIn';
 
-import {
-  breakpoints,
-  colors,
-  fonts,
-  radius,
-  spacing,
-  dimensions
-} from '../../utils/styles';
+import { breakpoints, colors, spacing, dimensions } from '../../utils/styles';
 
 const ContentContainerRoot = styled(`div`)`
   -webkit-overflow-scrolling: touch;
@@ -76,38 +67,36 @@ const ButlerBox = styled(`div`)`
   }
 `;
 
-const ContentContainer = props => {
-  return (
-    <ContentContainerRoot>
-      <UserContext.Consumer>
-        {({
-          contributor,
-          error,
-          handleLogout,
-          loading,
-          profile,
-          profile: { nickname }
-        }) =>
-          nickname || loading ? (
-            <ContentForLoggedIn
-              contributor={contributor}
-              error={error}
-              handleLogout={handleLogout}
-              loading={loading}
-              profile={profile}
-            />
-          ) : (
-            <>
-              <ContentForNotLoggedIn />
-              <ButlerBox>
-                <Butler />
-              </ButlerBox>
-            </>
-          )
-        }
-      </UserContext.Consumer>
-    </ContentContainerRoot>
-  );
-};
+const ContentContainer = () => (
+  <ContentContainerRoot>
+    <UserContext.Consumer>
+      {({
+        contributor,
+        error,
+        handleLogout,
+        loading,
+        profile,
+        profile: { nickname }
+      }) =>
+        nickname || loading ? (
+          <ContentForLoggedIn
+            contributor={contributor}
+            error={error}
+            handleLogout={handleLogout}
+            loading={loading}
+            profile={profile}
+          />
+        ) : (
+          <>
+            <ContentForNotLoggedIn />
+            <ButlerBox>
+              <Butler />
+            </ButlerBox>
+          </>
+        )
+      }
+    </UserContext.Consumer>
+  </ContentContainerRoot>
+);
 
 export default ContentContainer;

src/components/ContributorArea/ContentForContributor.js

@@ -1,20 +1,17 @@
-import React, { Component } from 'react';
-import PropTypes from 'prop-types';
-import styled, { keyframes } from 'react-emotion';
+import React from 'react';
+import styled from 'react-emotion';
 
 import { MdLock } from 'react-icons/md';
 
 import UserContext from '../../context/UserContext';
-import { Heading, SectionHeading, SubHeading, Text } from './AreaTypography';
+import { Heading, Text } from './AreaTypography';
 
 import {
-  breakpoints,
   colors,
   badgeThemes,
   fonts,
   radius,
   spacing,
-  dimensions,
   animations
 } from '../../utils/styles';
 
@@ -133,84 +130,82 @@ const LockIcon = styled(MdLock)`
   padding-top: 0.4rem;
 `;
 
-const ContentForContributor = props => {
-  return (
-    <UserContext.Consumer>
-      {({ contributor }) => {
-        const {
-          shopify: { codes },
-          github: { contributionCount }
-        } = contributor;
-
-        const showLevelTwoIncentive =
-          contributionCount >= 1 && contributionCount < 5;
-        let contributionsToGo, percentToGo;
-        if (showLevelTwoIncentive) {
-          contributionsToGo = 5 - contributionCount;
-          percentToGo = ((5 - contributionsToGo) / 5) * 100;
-        }
-
-        const numberOfCodes = codes.filter(code => code.used === false).length;
-        let text;
-        if (numberOfCodes > 1) {
-          text = `Use these discount codes during checkout to claim some free swag!`;
-        } else if (numberOfCodes == 1) {
-          text = `Enter this discount code during checkout to claim your free swag!`;
-        } else {
-          text = `Looks like you've claimed your swag! Thanks again, and keep being awesome.`;
-        }
-
-        return (
-          <ContentForContributorRoot>
-            <Heading>Here you go!</Heading>
-            <Text>
-              Thanks for going the extra mile to help build Gatsby! 💪 You have
-              made <strong>{contributionCount}</strong>{' '}
-              {`contribution${contributionCount > 1 ? `s` : ``}`}!
-            </Text>
-            <Text>{text}</Text>
-            {codes.map(code => (
-              <CodeBadgeBox key={code.code}>
-                <CodeBadge>
-                  <Name code={code.code}>
-                    {`Level ${badgeThemes[code.code].level} Swag Code`}
-                  </Name>
-                  {!code.used ? (
-                    <Code>{code.code}</Code>
-                  ) : (
-                    <Used>Claimed! 🎉</Used>
-                  )}
-                </CodeBadge>
-                {/* {!code.used && (
+const ContentForContributor = () => (
+  <UserContext.Consumer>
+    {({ contributor }) => {
+      const {
+        shopify: { codes },
+        github: { contributionCount }
+      } = contributor;
+
+      const showLevelTwoIncentive =
+        contributionCount >= 1 && contributionCount < 5;
+      let contributionsToGo, percentToGo;
+      if (showLevelTwoIncentive) {
+        contributionsToGo = 5 - contributionCount;
+        percentToGo = ((5 - contributionsToGo) / 5) * 100;
+      }
+
+      const numberOfCodes = codes.filter(code => code.used === false).length;
+      let text;
+      if (numberOfCodes > 1) {
+        text = `Use these discount codes during checkout to claim some free swag!`;
+      } else if (numberOfCodes == 1) {
+        text = `Enter this discount code during checkout to claim your free swag!`;
+      } else {
+        text = `Looks like you've claimed your swag! Thanks again, and keep being awesome.`;
+      }
+
+      return (
+        <ContentForContributorRoot>
+          <Heading>Here you go!</Heading>
+          <Text>
+            Thanks for going the extra mile to help build Gatsby! 💪 You have
+            made <strong>{contributionCount}</strong>{' '}
+            {`contribution${contributionCount > 1 ? `s` : ``}`}!
+          </Text>
+          <Text>{text}</Text>
+          {codes.map(code => (
+            <CodeBadgeBox key={code.code}>
+              <CodeBadge>
+                <Name code={code.code}>
+                  {`Level ${badgeThemes[code.code].level} Swag Code`}
+                </Name>
+                {!code.used ? (
+                  <Code>{code.code}</Code>
+                ) : (
+                  <Used>Claimed! 🎉</Used>
+                )}
+              </CodeBadge>
+              {/* {!code.used && (
                   <Tip>
                     Click the badge to shop only items you can claim for free
                     using this code.
                   </Tip>
                 )} */}
+            </CodeBadgeBox>
+          ))}
+          {/* Show progress bar when Level 1 is earned, but Level 2 is not */}
+          {showLevelTwoIncentive && (
+            <>
+              <CodeBadgeBox key={`HOLYBUCKETS`}>
+                <CodeBadge>
+                  <Name code={`HOLYBUCKETS`}>{`Level 2 Swag Code`}</Name>
+                  <Code>
+                    <LockIcon />
+                  </Code>
+                </CodeBadge>
               </CodeBadgeBox>
-            ))}
-            {/* Show progress bar when Level 1 is earned, but Level 2 is not */}
-            {showLevelTwoIncentive && (
-              <>
-                <CodeBadgeBox key={`HOLYBUCKETS`}>
-                  <CodeBadge>
-                    <Name code={`HOLYBUCKETS`}>{`Level 2 Swag Code`}</Name>
-                    <Code>
-                      <LockIcon />
-                    </Code>
-                  </CodeBadge>
-                </CodeBadgeBox>
-                <ProgressBar value={percentToGo} max="100" />
-                <Text>{`Make ${contributionsToGo} more contribution${
-                  contributionsToGo > 1 ? `s` : ``
-                } to earn level 2 swag!`}</Text>
-              </>
-            )}
-          </ContentForContributorRoot>
-        );
-      }}
-    </UserContext.Consumer>
-  );
-};
+              <ProgressBar value={percentToGo} max="100" />
+              <Text>{`Make ${contributionsToGo} more contribution${
+                contributionsToGo > 1 ? `s` : ``
+              } to earn level 2 swag!`}</Text>
+            </>
+          )}
+        </ContentForContributorRoot>
+      );
+    }}
+  </UserContext.Consumer>
+);
 
 export default ContentForContributor;