diff options
Diffstat (limited to 'packages/website/ts/components/legacy_portal/legacy_portal_menu.tsx')
-rw-r--r-- | packages/website/ts/components/legacy_portal/legacy_portal_menu.tsx | 94 |
1 files changed, 94 insertions, 0 deletions
diff --git a/packages/website/ts/components/legacy_portal/legacy_portal_menu.tsx b/packages/website/ts/components/legacy_portal/legacy_portal_menu.tsx new file mode 100644 index 000000000..634d966ed --- /dev/null +++ b/packages/website/ts/components/legacy_portal/legacy_portal_menu.tsx @@ -0,0 +1,94 @@ +import * as _ from 'lodash'; +import * as React from 'react'; +import { MenuItem } from 'ts/components/ui/menu_item'; +import { Environments, WebsitePaths } from 'ts/types'; +import { configs } from 'ts/utils/configs'; + +export interface LegacyPortalMenuProps { + menuItemStyle: React.CSSProperties; + onClick?: () => void; +} + +interface LegacyPortalMenuState {} + +export class LegacyPortalMenu extends React.Component<LegacyPortalMenuProps, LegacyPortalMenuState> { + public static defaultProps: Partial<LegacyPortalMenuProps> = { + onClick: _.noop, + }; + public render() { + return ( + <div> + <MenuItem + style={this.props.menuItemStyle} + className="py2" + to={`${WebsitePaths.Portal}`} + onClick={this.props.onClick.bind(this)} + > + {this._renderMenuItemWithIcon('Generate order', 'zmdi-arrow-right-top')} + </MenuItem> + <MenuItem + style={this.props.menuItemStyle} + className="py2" + to={`${WebsitePaths.Portal}/fill`} + onClick={this.props.onClick.bind(this)} + > + {this._renderMenuItemWithIcon('Fill order', 'zmdi-arrow-left-bottom')} + </MenuItem> + <MenuItem + style={this.props.menuItemStyle} + className="py2" + to={`${WebsitePaths.Portal}/balances`} + onClick={this.props.onClick.bind(this)} + > + {this._renderMenuItemWithIcon('Balances', 'zmdi-balance-wallet')} + </MenuItem> + <MenuItem + style={this.props.menuItemStyle} + className="py2" + to={`${WebsitePaths.Portal}/trades`} + onClick={this.props.onClick.bind(this)} + > + {this._renderMenuItemWithIcon('Trade history', 'zmdi-format-list-bulleted')} + </MenuItem> + <MenuItem + style={this.props.menuItemStyle} + className="py2" + to={`${WebsitePaths.Portal}/weth`} + onClick={this.props.onClick.bind(this)} + > + {this._renderMenuItemWithIcon('Wrap ETH', 'zmdi-circle-o')} + </MenuItem> + {configs.ENVIRONMENT === Environments.DEVELOPMENT && ( + <div> + <MenuItem + style={this.props.menuItemStyle} + className="py2" + to={`${WebsitePaths.Portal}/wallet`} + onClick={this.props.onClick.bind(this)} + > + {this._renderMenuItemWithIcon('Wallet', 'zmdi-balance-wallet')} + </MenuItem> + <MenuItem + style={this.props.menuItemStyle} + className="py2" + to={`${WebsitePaths.Portal}/relayers`} + onClick={this.props.onClick.bind(this)} + > + {this._renderMenuItemWithIcon('Relayers', 'zmdi-input-antenna')} + </MenuItem> + </div> + )} + </div> + ); + } + private _renderMenuItemWithIcon(title: string, iconName: string) { + return ( + <div className="flex" style={{ fontWeight: 100 }}> + <div className="pr1 pl2"> + <i style={{ fontSize: 20 }} className={`zmdi ${iconName}`} /> + </div> + <div className="pl1">{title}</div> + </div> + ); + } +} |