feat: remove unused files

10 files changed, 0 insertions, 558 deletions

diff --git a/packages/website/ts/components/dialogs/u2f_not_supported_dialog.tsx b/packages/website/ts/components/dialogs/u2f_not_supported_dialog.tsx
deleted file mode 100644
index bbec1d649..000000000
--- a/packages/website/ts/components/dialogs/u2f_not_supported_dialog.tsx
+++ /dev/null
@@ -1,46 +0,0 @@
-import { colors } from '@0x/react-shared';
-import Dialog from 'material-ui/Dialog';
-import FlatButton from 'material-ui/FlatButton';
-import * as React from 'react';
-import { constants } from 'ts/utils/constants';
-
-interface U2fNotSupportedDialogProps {
-    isOpen: boolean;
-    onToggleDialog: () => void;
-}
-
-export const U2fNotSupportedDialog = (props: U2fNotSupportedDialogProps) => {
-    return (
-        <Dialog
-            title="U2F Not Supported"
-            titleStyle={{ fontWeight: 100 }}
-            actions={[<FlatButton key="u2fNo" label="Ok" onClick={props.onToggleDialog} />]}
-            open={props.isOpen}
-            onRequestClose={props.onToggleDialog}
-            autoScrollBodyContent={true}
-        >
-            <div className="pt2" style={{ color: colors.grey700 }}>
-                <div>
-                    It looks like your browser does not support U2F connections required for us to communicate with your
-                    hardware wallet. Please use a browser that supports U2F connections and try again.
-                </div>
-                <div>
-                    <ul>
-                        <li className="pb1">Chrome version 38 or later</li>
-                        <li className="pb1">Opera version 40 of later</li>
-                        <li>
-                            Firefox with{' '}
-                            <a
-                                href={constants.URL_FIREFOX_U2F_ADDON}
-                                target="_blank"
-                                style={{ textDecoration: 'underline' }}
-                            >
-                                this extension
-                            </a>.
-                        </li>
-                    </ul>
-                </div>
-            </div>
-        </Dialog>
-    );
-};
diff --git a/packages/website/ts/components/dialogs/wrapped_eth_section_notice_dialog.tsx b/packages/website/ts/components/dialogs/wrapped_eth_section_notice_dialog.tsx
deleted file mode 100644
index cf2c4dda5..000000000
--- a/packages/website/ts/components/dialogs/wrapped_eth_section_notice_dialog.tsx
+++ /dev/null
@@ -1,33 +0,0 @@
-import Dialog from 'material-ui/Dialog';
-import FlatButton from 'material-ui/FlatButton';
-import { colors } from 'material-ui/styles';
-import * as React from 'react';
-
-interface WrappedEthSectionNoticeDialogProps {
-    isOpen: boolean;
-    onToggleDialog: () => void;
-}
-
-export const WrappedEthSectionNoticeDialog = (props: WrappedEthSectionNoticeDialogProps) => {
-    return (
-        <Dialog
-            title="Dedicated Wrapped Ether Section"
-            titleStyle={{ fontWeight: 100 }}
-            actions={[
-                <FlatButton key="acknowledgeWrapEthSection" label="Sounds good" onClick={props.onToggleDialog} />,
-            ]}
-            open={props.isOpen}
-            onRequestClose={props.onToggleDialog}
-            autoScrollBodyContent={true}
-            modal={true}
-        >
-            <div className="pt2" style={{ color: colors.grey700 }}>
-                <div>
-                    We have recently updated the Wrapped Ether token (WETH) used by 0x Portal. Don't worry, unwrapping
-                    Ether tied to the old Wrapped Ether token can be done at any time by clicking on the "Wrap ETH"
-                    section in the menu to the left.
-                </div>
-            </div>
-        </Dialog>
-    );
-};
diff --git a/packages/website/ts/components/forms/subscribe_form.tsx b/packages/website/ts/components/forms/subscribe_form.tsx
deleted file mode 100644
index f5560cfa7..000000000
--- a/packages/website/ts/components/forms/subscribe_form.tsx
+++ /dev/null
@@ -1,127 +0,0 @@
-import { colors } from '@0x/react-shared';
-import * as _ from 'lodash';
-import * as React from 'react';
-
-import { Button } from 'ts/components/ui/button';
-import { Container } from 'ts/components/ui/container';
-import { Input } from 'ts/components/ui/input';
-import { Text } from 'ts/components/ui/text';
-import { analytics } from 'ts/utils/analytics';
-import { backendClient } from 'ts/utils/backend_client';
-
-export interface SubscribeFormProps {}
-
-export enum SubscribeFormStatus {
-    None,
-    Error,
-    Success,
-    Loading,
-    Other,
-}
-
-export interface SubscribeFormState {
-    emailText: string;
-    lastSubmittedEmail: string;
-    status: SubscribeFormStatus;
-}
-
-const FORM_FONT_SIZE = '15px';
-
-// TODO: Translate visible strings. https://app.asana.com/0/628666249318202/697485674422001
-export class SubscribeForm extends React.Component<SubscribeFormProps, SubscribeFormState> {
-    public state = {
-        emailText: '',
-        lastSubmittedEmail: '',
-        status: SubscribeFormStatus.None,
-    };
-    public render(): React.ReactNode {
-        return (
-            <Container className="flex flex-column items-center justify-between md-mx2 sm-mx2">
-                <Container marginBottom="15px">
-                    <Text fontFamily="Roboto Mono" fontColor={colors.grey} center={true}>
-                        Subscribe to our newsletter for 0x relayer and dApp updates
-                    </Text>
-                </Container>
-                <form onSubmit={this._handleFormSubmitAsync.bind(this)}>
-                    <Container className="flex flex-wrap justify-center items-center">
-                        <Container marginTop="15px">
-                            <Input
-                                placeholder="you@email.com"
-                                value={this.state.emailText}
-                                fontColor={colors.white}
-                                fontSize={FORM_FONT_SIZE}
-                                backgroundColor={colors.projectsGrey}
-                                width="300px"
-                                onChange={this._handleEmailInputChange.bind(this)}
-                            />
-                        </Container>
-                        <Container marginLeft="15px" marginTop="15px">
-                            <Button
-                                type="submit"
-                                backgroundColor={colors.darkestGrey}
-                                fontColor={colors.white}
-                                fontSize={FORM_FONT_SIZE}
-                            >
-                                Subscribe
-                            </Button>
-                        </Container>
-                    </Container>
-                </form>
-                {this._renderMessage()}
-            </Container>
-        );
-    }
-    private _renderMessage(): React.ReactNode {
-        let message = null;
-        switch (this.state.status) {
-            case SubscribeFormStatus.Error:
-                message = 'Sorry, something went wrong. Try again later.';
-                break;
-            case SubscribeFormStatus.Loading:
-                message = 'One second...';
-                break;
-            case SubscribeFormStatus.Success:
-                message = `Thanks! ${this.state.lastSubmittedEmail} is now on the mailing list.`;
-                break;
-            case SubscribeFormStatus.None:
-                break;
-            default:
-                throw new Error(
-                    'The SubscribeFormStatus switch statement is not exhaustive when choosing an error message.',
-                );
-        }
-        return (
-            <Container isHidden={!message} marginTop="30px">
-                <Text center={true} fontFamily="Roboto Mono" fontColor={colors.grey}>
-                    {message || 'spacer text (never shown to user)'}
-                </Text>
-            </Container>
-        );
-    }
-    private _handleEmailInputChange(event: React.ChangeEvent<HTMLInputElement>): void {
-        this.setState({ emailText: event.target.value });
-    }
-    private async _handleFormSubmitAsync(event: React.FormEvent<HTMLInputElement>): Promise<void> {
-        event.preventDefault();
-        if (_.isUndefined(this.state.emailText) || _.isEmpty(this.state.emailText)) {
-            return;
-        }
-        this.setState({
-            status: SubscribeFormStatus.Loading,
-            lastSubmittedEmail: this.state.emailText,
-        });
-        try {
-            const response = await backendClient.subscribeToNewsletterAsync(this.state.emailText);
-            const status = response.status === 200 ? SubscribeFormStatus.Success : SubscribeFormStatus.Error;
-            if (status === SubscribeFormStatus.Success) {
-                analytics.identify(this.state.emailText, 'email');
-            }
-            this.setState({ status, emailText: '' });
-        } catch (error) {
-            this._setStatus(SubscribeFormStatus.Error);
-        }
-    }
-    private _setStatus(status: SubscribeFormStatus): void {
-        this.setState({ status });
-    }
-}
diff --git a/packages/website/ts/components/layout.tsx b/packages/website/ts/components/layout.tsx
deleted file mode 100644
index 9563f80f8..000000000
--- a/packages/website/ts/components/layout.tsx
+++ /dev/null
@@ -1,177 +0,0 @@
-import styled from 'styled-components';
-import { getCSSPadding, PADDING_SIZES, PaddingInterface } from 'ts/constants/utilities';
-
-interface WrapWidths {
-    default: string;
-    full: string;
-    medium: string;
-    narrow: string;
-    [key: string]: string;
-}
-
-interface ColumnWidths {
-    [key: string]: string;
-}
-
-interface SectionProps {
-    isNoPadding?: boolean;
-    isPadLarge?: boolean;
-    isNoMargin?: boolean;
-    bgColor?: string;
-    isFullWidth?: boolean;
-    isRelative?: boolean;
-}
-
-interface WrapProps extends PaddingInterface {
-    width?: 'default' | 'full' | 'medium' | 'narrow';
-    bgColor?: string;
-    isWrapped?: boolean;
-    isCentered?: boolean;
-    isReversed?: boolean;
-}
-
-interface ColumnProps {
-    colWidth?: '1/4' | '1/3' | '1/2' | '2/3';
-    isNoPadding?: boolean;
-    isNoMargin?: boolean;
-    isPadLarge?: boolean;
-    isFlexGrow?: boolean;
-    isMobileCentered?: boolean;
-    bgColor?: string;
-}
-
-interface GetColWidthArgs {
-    span?: number;
-    columns: number;
-}
-
-export interface WrapStickyInterface {
-    offsetTop?: string;
-}
-
-const _getColumnWidth = (args: GetColWidthArgs): string => {
-    const { span = 1, columns } = args;
-    const percentWidth = span / columns * 100;
-    const gutterDiff = GUTTER * (columns - 1) / columns;
-    return `calc(${percentWidth}% - ${gutterDiff}px)`;
-};
-
-const GUTTER = 30 as number;
-const MAX_WIDTH = 1500;
-export const BREAKPOINTS = {
-    mobile: '768px',
-};
-const WRAPPER_WIDTHS: WrapWidths = {
-    default: `${MAX_WIDTH}px`, // tbd
-    full: '100%',
-    medium: '1136px',
-    narrow: '930px',
-};
-const COLUMN_WIDTHS: ColumnWidths = {
-    '1/4': _getColumnWidth({ columns: 4 }),
-    '1/3': _getColumnWidth({ columns: 3 }),
-    '1/2': _getColumnWidth({ columns: 2 }),
-    '2/3': _getColumnWidth({ span: 2, columns: 3 }),
-};
-
-export const Main = styled.main`
-    max-width: ${MAX_WIDTH}px;
-    margin: 0 auto;
-
-    @media (min-width: ${BREAKPOINTS.mobile}) {
-        width: calc(100% - 60px);
-    }
-`;
-
-// We can also turn Section into a stateless comp,
-// passing a asElement (same patter nas Heading) so we dont have to
-// make a const on every route to withComponent-size it.
-// just <Section asElement?="div/section/footer/header/whatever" /> ?
-export const Section =
-    styled.section <
-    SectionProps >
-    `
-    width: ${props => (props.isFullWidth ? `calc(100% + ${GUTTER * 2}px)` : '100%')};
-    padding: ${props => !props.isNoPadding && (props.isPadLarge ? `${PADDING_SIZES.large}` : PADDING_SIZES.default)};
-    background-color: ${props => props.bgColor};
-    position: ${props => props.isRelative && 'relative'};
-    overflow: ${props => props.isRelative && 'hidden'};
-    margin-bottom: ${props => !props.isNoMargin && `${GUTTER}px`};
-
-    @media (min-width: 1560px) {
-        width: ${props => props.isFullWidth && '100vw'};
-        margin-left: ${props => props.isFullWidth && `calc(750px - 50vw)`};
-    }
-
-    @media (max-width: ${BREAKPOINTS.mobile}) {
-        margin-bottom: ${props => !props.isNoMargin && `${GUTTER / 2}px`};
-        padding: ${props =>
-            props.isPadLarge ? `${PADDING_SIZES.large} ${PADDING_SIZES.default}` : PADDING_SIZES.default};
-    }
-`;
-
-const WrapBase =
-    styled.div <
-    WrapProps >
-    `
-    max-width: ${props => WRAPPER_WIDTHS[props.width || 'default']};
-    padding: ${props => props.padding && getCSSPadding(props.padding)};
-    background-color: ${props => props.bgColor};
-    margin: 0 auto;
-`;
-
-export const Wrap = styled(WrapBase)`
-    @media (min-width: ${BREAKPOINTS.mobile}) {
-        display: flex;
-        justify-content: space-between;
-        flex-wrap: wrap;
-        flex-direction: ${props => props.isReversed && 'row-reverse'};
-    }
-`;
-
-export const WrapCentered = styled(WrapBase)`
-    display: flex;
-    flex-direction: column;
-    justify-content: center;
-    align-items: center;
-    text-align: center;
-`;
-
-export const WrapSticky =
-    styled.div <
-    WrapStickyInterface >
-    `
-    position: sticky;
-    top: ${props => props.offsetTop || '60px'};
-`;
-
-export const WrapGrid = styled(WrapBase)`
-    display: flex;
-    flex-wrap: ${props => props.isWrapped && `wrap`};
-    justify-content: ${props => (props.isCentered ? `center` : 'space-between')};
-`;
-
-export const Column =
-    styled.div <
-    ColumnProps >
-    `
-    background-color: ${props => props.bgColor};
-    flex-grow: ${props => props.isFlexGrow && 1};
-
-    @media (min-width: ${BREAKPOINTS.mobile}) {
-        padding: ${props =>
-            !props.isNoPadding &&
-            (props.isPadLarge ? `${PADDING_SIZES.large} ${PADDING_SIZES.default}` : PADDING_SIZES.default)};
-        width: ${props => (props.colWidth ? COLUMN_WIDTHS[props.colWidth] : '100%')};
-    }
-
-    @media (max-width: ${BREAKPOINTS.mobile}) {
-        padding: ${props => !props.isNoPadding && (props.isPadLarge ? '40px 30px' : 0)};
-        margin-bottom: 20px;
-        text-align: ${props => props.isMobileCentered && 'center'};
-    }
-`;
-
-WrapGrid.defaultProps = {
-    isCentered: true,
-};
diff --git a/packages/website/ts/components/redirector.tsx b/packages/website/ts/components/redirector.tsx
deleted file mode 100644
index a02693003..000000000
--- a/packages/website/ts/components/redirector.tsx
+++ /dev/null
@@ -1,9 +0,0 @@
-import { constants } from 'ts/utils/constants';
-
-interface RedirectorProps {
-    location: string;
-}
-
-export function Redirector(_props: RedirectorProps): void {
-    window.location.href = constants.URL_ANGELLIST;
-}
diff --git a/packages/website/ts/components/separator.tsx b/packages/website/ts/components/separator.tsx
deleted file mode 100644
index 0b8b8d766..000000000
--- a/packages/website/ts/components/separator.tsx
+++ /dev/null
@@ -1,7 +0,0 @@
-import styled from 'styled-components';
-
-export const Separator = styled.hr`
-    background: #eaeaea;
-    height: 1px;
-    border: 0;
-`;
diff --git a/packages/website/ts/components/ui/filled_image.tsx b/packages/website/ts/components/ui/filled_image.tsx
deleted file mode 100644
index 7f58ee5b9..000000000
--- a/packages/website/ts/components/ui/filled_image.tsx
+++ /dev/null
@@ -1,18 +0,0 @@
-import * as React from 'react';
-
-export interface FilledImageProps {
-    src: string;
-}
-export const FilledImage = (props: FilledImageProps) => (
-    <div
-        style={{
-            width: '100%',
-            height: '100%',
-            objectFit: 'cover',
-            backgroundImage: `url(${props.src})`,
-            backgroundRepeat: 'no-repeat',
-            backgroundPosition: 'center',
-            backgroundSize: 'cover',
-        }}
-    />
-);
diff --git a/packages/website/ts/components/ui/input.tsx b/packages/website/ts/components/ui/input.tsx
deleted file mode 100644
index d21b9fd0e..000000000
--- a/packages/website/ts/components/ui/input.tsx
+++ /dev/null
@@ -1,49 +0,0 @@
-import { colors } from '@0x/react-shared';
-import * as React from 'react';
-import { styled } from 'ts/style/theme';
-
-export interface InputProps {
-    className?: string;
-    value?: string;
-    width?: string;
-    fontSize?: string;
-    fontColor?: string;
-    border?: string;
-    padding?: string;
-    placeholderColor?: string;
-    placeholder?: string;
-    backgroundColor?: string;
-    onChange?: (event: React.ChangeEvent<HTMLInputElement>) => void;
-}
-
-const PlainInput: React.StatelessComponent<InputProps> = ({ value, className, placeholder, onChange }) => (
-    <input className={className} value={value} onChange={onChange} placeholder={placeholder} />
-);
-
-export const Input = styled(PlainInput)`
-    font-size: ${props => props.fontSize};
-    width: ${props => props.width};
-    padding: ${props => props.padding};
-    border-radius: 3px;
-    box-sizing: border-box;
-    font-family: 'Roboto Mono';
-    color: ${props => props.fontColor};
-    border: ${props => props.border};
-    outline: none;
-    background-color: ${props => props.backgroundColor};
-    &::placeholder {
-        color: ${props => props.placeholderColor};
-    }
-`;
-
-Input.defaultProps = {
-    width: 'auto',
-    backgroundColor: colors.white,
-    fontColor: colors.darkestGrey,
-    placeholderColor: colors.darkGrey,
-    fontSize: '12px',
-    border: 'none',
-    padding: '0.8em 1.2em',
-};
-
-Input.displayName = 'Input';
diff --git a/packages/website/ts/components/ui/simple_loading.tsx b/packages/website/ts/components/ui/simple_loading.tsx
deleted file mode 100644
index 81744196d..000000000
--- a/packages/website/ts/components/ui/simple_loading.tsx
+++ /dev/null
@@ -1,17 +0,0 @@
-import CircularProgress from 'material-ui/CircularProgress';
-import * as React from 'react';
-
-export interface SimpleLoadingProps {
-    message: string;
-}
-
-export const SimpleLoading = (props: SimpleLoadingProps) => {
-    return (
-        <div className="mx-auto pt3" style={{ maxWidth: 400, height: 409 }}>
-            <div className="relative" style={{ top: '50%', transform: 'translateY(-50%)', height: 95 }}>
-                <CircularProgress />
-                <div className="pt3 pb3">{props.message}</div>
-            </div>
-        </div>
-    );
-};
diff --git a/packages/website/ts/components/ui/typed_text.tsx b/packages/website/ts/components/ui/typed_text.tsx
deleted file mode 100644
index 6d38580b9..000000000
--- a/packages/website/ts/components/ui/typed_text.tsx
+++ /dev/null
@@ -1,75 +0,0 @@
-import * as _ from 'lodash';
-import * as React from 'react';
-import Typist from 'react-typist';
-
-import { Text, TextProps } from 'ts/components/ui/text';
-
-import 'react-typist/dist/Typist.css';
-
-export interface TypedTextProps extends TextProps {
-    textList: string[];
-    shouldRepeat?: boolean;
-    wordDelayMs?: number;
-    avgKeystrokeDelayMs?: number;
-    stdKeystrokeDelay?: number;
-}
-
-export interface TypedTextState {
-    cycleCount: number;
-}
-
-export class TypedText extends React.Component<TypedTextProps, TypedTextState> {
-    public static defaultProps = {
-        shouldRepeat: false,
-        avgKeystrokeDelayMs: 90,
-        wordDelayMs: 1000,
-    };
-    public state = {
-        cycleCount: 0,
-    };
-    public render(): React.ReactNode {
-        const {
-            textList,
-            shouldRepeat,
-            wordDelayMs,
-            avgKeystrokeDelayMs,
-            stdKeystrokeDelay,
-            // tslint:disable-next-line
-            ...textProps
-        } = this.props;
-        const { cycleCount } = this.state;
-        if (_.isEmpty(textList)) {
-            return null;
-        }
-        const typistChildren: React.ReactNode[] = [];
-        _.forEach(textList, text => {
-            typistChildren.push(
-                <Text key={`text-${text}-${cycleCount}`} {...textProps}>
-                    {text}
-                </Text>,
-            );
-            if (wordDelayMs) {
-                typistChildren.push(<Typist.Delay key={`delay-${text}-${cycleCount}`} ms={wordDelayMs} />);
-            }
-            typistChildren.push(<Typist.Backspace key={`backspace-${text}-${cycleCount}`} count={text.length} />);
-        });
-        return (
-            <Typist
-                avgTypingDelay={avgKeystrokeDelayMs}
-                stdTypingDelay={stdKeystrokeDelay}
-                className="inline"
-                key={`typist-key-${cycleCount}`}
-                onTypingDone={this._onTypingDone.bind(this)}
-            >
-                {typistChildren}
-            </Typist>
-        );
-    }
-    private _onTypingDone(): void {
-        if (this.props.shouldRepeat) {
-            this.setState({
-                cycleCount: this.state.cycleCount + 1,
-            });
-        }
-    }
-}