[WIP] Refactored original header in anticipation for changes to docs header

packages/website/ts/components/dropdowns/dropdown_products.tsx

@@ -1,8 +1,7 @@
-import * as _ from 'lodash';
-import * as React from 'react';
-
+import React from 'react';
 import { Link } from 'react-router-dom';
 import styled from 'styled-components';
+
 import { Heading, Paragraph } from 'ts/components/text';
 import { WebsitePaths } from 'ts/types';
 
@@ -29,9 +28,9 @@ const navData = [
     },
 ];
 
-export const DropdownProducts: React.FunctionComponent<{}> = () => (
+export const DropdownProducts: React.FC = () => (
     <List>
-        {_.map(navData, (item, index) => (
+        {navData.map((item, index) => (
             <li key={`productLink-${index}`}>
                 <Link to={item.url}>
                     <Heading asElement="h3" color="inherit" isNoMargin={true} size="small">

packages/website/ts/components/header.tsx

@@ -1,10 +1,10 @@
-import _ from 'lodash';
 import * as React from 'react';
+import Headroom from 'react-headroom';
 import MediaQuery from 'react-responsive';
 import styled, { css, withTheme } from 'styled-components';
 import { Link } from 'ts/components/documentation/shared/link';
 
-import Headroom from 'react-headroom';
+import { Link } from '@0x/react-shared';
 
 import { Button } from 'ts/components/button';
 import { DropdownDevelopers } from 'ts/components/dropdowns/dropdown_developers';
@@ -67,19 +67,18 @@ const navItems: NavItemProps[] = [
     },
 ];
 
-class HeaderBase extends React.Component<HeaderProps> {
-    public onUnpin = () => {
-        if (this.props.isNavToggled) {
-            this.props.toggleMobileNav();
+export const HeaderBase: React.FC<HeaderProps> = props => {
+    const { isNavToggled, toggleMobileNav, theme } = props;
+
+    const onUnpin = () => {
+        if (isNavToggled) {
+            toggleMobileNav();
         }
     };
 
-    public render(): React.ReactNode {
-        const { isNavToggled, toggleMobileNav, theme } = this.props;
-
     return (
         <Headroom
-                onUnpin={this.onUnpin}
+            onUnpin={onUnpin}
             downTolerance={4}
             upTolerance={10}
             wrapperStyle={{ position: 'relative', zIndex: 2 }}
@@ -91,7 +90,7 @@ class HeaderBase extends React.Component<HeaderProps> {
                     </Link>
 
                     <NavLinks>
-                            {_.map(navItems, (link, index) => (
+                        {navItems.map((link, index) => (
                             <NavItem key={`navlink-${index}`} link={link} />
                         ))}
                     </NavLinks>
@@ -108,8 +107,7 @@ class HeaderBase extends React.Component<HeaderProps> {
             </StyledHeader>
         </Headroom>
     );
-    }
-}
+};
 
 export const Header = withTheme(HeaderBase);