pokemon.trade/app/javascript/packs/react-app/components/misc/nav_bar.jsx

import React from 'react';
import {Menu, Image} from 'semantic-ui-react';

class NavBar extends React.Component {
  render() {
    const {left_items, right_items} = this.props;

    return (
      <Menu fixed="top" inverted>
        {left_items.map((item, i) => {
          return (
            <Menu.Item
              key={i}
              href={item.path}
              content={item.text}
              method={item.method}
            />
          );
        })}
        <Menu.Menu position="right">
          {right_items.map((item, i) => {
            return (
              <Menu.Item
                key={i}
                href={item.path}
                content={item.text}
                method={item.method}
              />
            );
          })}
        </Menu.Menu>
      </Menu>
    );
  }
}

export default NavBar;