From 60a2442559d5bbd43d9a02a9dcbfe2bb34820724 Mon Sep 17 00:00:00 2001
From: 8cy <50817549+8cy@users.noreply.github.com>
Date: Fri, 24 Jul 2020 04:29:37 -0700
Subject: stage

---
 client/src/components/navigation/NavigationBar.js | 72 ++++++++++++++---------
 1 file changed, 43 insertions(+), 29 deletions(-)

(limited to 'client/src/components/navigation')

diff --git a/client/src/components/navigation/NavigationBar.js b/client/src/components/navigation/NavigationBar.js
index 3962aae..0b90958 100644
--- a/client/src/components/navigation/NavigationBar.js
+++ b/client/src/components/navigation/NavigationBar.js
@@ -1,8 +1,5 @@
 import React, { Component } from 'react';
-import {
-    MDBNavbar, MDBNavbarBrand, MDBNavbarNav, MDBNavItem, MDBNavLink, MDBNavbarToggler, MDBCollapse, MDBIcon,
-    MDBDropdown, MDBDropdownToggle, MDBDropdownMenu, MDBDropdownItem, MDBCol
-} from 'mdbreact'
+import { Navbar, NavDropdown, Nav } from 'react-bootstrap';
 import PropTypes from 'prop-types';
 
 export default class NavigationBar extends Component {
@@ -16,31 +13,48 @@ export default class NavigationBar extends Component {
     
     render() {
         return(
-            <MDBNavbar color="black" dark expand="md">
-                <MDBNavbarBrand>
-                    <strong className="white-text">Bot Dashboard</strong>
-                </MDBNavbarBrand>
-                <MDBNavbarToggler onClick={this.toggleCollapse} />
-                <MDBCollapse id="navbarCollapse" isOpen={this.state.isOpen} navbar>
-                    <MDBNavbarNav left>
-                        <MDBNavItem>
-                            <MDBNavLink to="/">Server Selection</MDBNavLink>
-                        </MDBNavItem>
-                    </MDBNavbarNav>
-                    <MDBNavbarNav right>
-                        <MDBNavItem>
-                            <MDBDropdown>
-                                <MDBDropdownToggle nav caret>
-                                    <MDBIcon icon='user' />
-                                </MDBDropdownToggle>
-                                <MDBDropdownMenu className="dropdown-default">
-                                    <MDBDropdownItem href="http://localhost:8088/oauth/logout">{`Logout (${this.props.user.username})`}</MDBDropdownItem>
-                                </MDBDropdownMenu>
-                            </MDBDropdown>
-                        </MDBNavItem>
-                    </MDBNavbarNav>
-                </MDBCollapse>
-            </MDBNavbar>
+            <Navbar bg="dark" className="dark-navbar" expand="lg">
+                <Navbar.Brand>Aki Dashboard</Navbar.Brand>
+                <Navbar.Toggle aria-controls="basic-navbar-nav" />
+                <Navbar.Collapse id="basic-navbar-nav">
+                    <Nav className="mr-auto">
+                        <Nav.Link href="/">Home</Nav.Link>
+                        <Nav.Link href="/">Server Selection</Nav.Link>
+                    </Nav>
+                    <NavDropdown title={<img
+                        src={`https://cdn.discordapp.com/avatars/${this.props.user.id}/${this.props.user.avatar}.png?size=32`}
+                        alt="Discord profile picture" className="user-icon-image" />}
+                        id="basic=nav-dropdown">
+                        <NavDropdown.Item href="http://localhost:8088/oauth/logout">{`Logout (${this.props.user.username})`}</NavDropdown.Item>
+                    </NavDropdown>
+                </Navbar.Collapse>
+            </Navbar>
+
+            // <MDBNavbar color="black" dark expand="md">
+            //     <MDBNavbarBrand>
+            //         <strong className="white-text">Bot Dashboard</strong>
+            //     </MDBNavbarBrand>
+            //     <MDBNavbarToggler onClick={this.toggleCollapse} />
+            //     <MDBCollapse id="navbarCollapse" isOpen={this.state.isOpen} navbar>
+            //         <MDBNavbarNav left>
+            //             <MDBNavItem>
+            //                 <MDBNavLink to="/">Server Selection</MDBNavLink>
+            //             </MDBNavItem>
+            //         </MDBNavbarNav>
+            //         <MDBNavbarNav right>
+            //             <MDBNavItem>
+            //                 <MDBDropdown>
+            //                     <MDBDropdownToggle nav caret>
+            //                         <MDBIcon icon='user' />
+            //                     </MDBDropdownToggle>
+            //                     <MDBDropdownMenu className="dropdown-default">
+            //                         <MDBDropdownItem href="http://localhost:8088/oauth/logout">{`Logout (${this.props.user.username})`}</MDBDropdownItem>
+            //                     </MDBDropdownMenu>
+            //                 </MDBDropdown>
+            //             </MDBNavItem>
+            //         </MDBNavbarNav>
+            //     </MDBCollapse>
+            // </MDBNavbar>
         );
     }
 }
-- 
cgit v1.2.3