import React, { Component } from "react";
import { Link } from "react-router-dom";
import InLineSearch from "./common/Functionality/InlineSearchBar";

// Navbar class component, Just simple href's to retain styling

export class Navigation extends Component {
  render() {
    return (
      <nav>
        <div className="navbar-fixed grey darken-1">
          <div className="nav-wrapper">
            <ul className="left hide-on-med-and-down">
              <li>
                <Link className="active" to="/">
                  Dashboard
                </Link>
              </li>
              <li>
                <Link to="/upcoming-migrations">Upcoming Migrations</Link>
              </li>
              <li>
                <Link to="/migrations">Migrations</Link>
              </li>
              <li>
                <Link to="/reports">Reports</Link>
              </li>
              <li>
                <Link to="/historical-migrations">Historical Migrations</Link>
              </li>
              <li className="orange accent-4 active">
                <Link to="/book">Book</Link>
              </li>
            </ul>
            {/* Inline UUID search bar is here */}
            <ul className="right hide-on-med-and-down">
              <li style={{ paddingRight: "1em" }}>UUID:</li>
              <li>
                <InLineSearch style={{ paddingRight: "4em" }}></InLineSearch>
              </li>
              {/* <li>
                <Link>
                  <IdSearchForm />
                </Link>
              </li> */}
            </ul>
          </div>
        </div>
      </nav>
    );
  }
}

export default Navigation;