From 0de191ac0b74e8372f111221057314ebd16f4cef Mon Sep 17 00:00:00 2001
From: Alejandro Celaya <alejandro@alejandrocelaya.com>
Date: Wed, 18 Jul 2018 20:32:19 +0200
Subject: [PATCH] Added icons to side menu

---
 src/common/AsideMenu.js   | 15 ++++++++++++---
 src/common/AsideMenu.scss |  4 ++++
 2 files changed, 16 insertions(+), 3 deletions(-)

diff --git a/src/common/AsideMenu.js b/src/common/AsideMenu.js
index 08808d2a..5a84719d 100644
--- a/src/common/AsideMenu.js
+++ b/src/common/AsideMenu.js
@@ -1,5 +1,9 @@
 import React from 'react';
 import { NavLink } from 'react-router-dom';
+import listIcon from '@fortawesome/fontawesome-free-solid/faBars';
+import createIcon from '@fortawesome/fontawesome-free-solid/faPlus';
+import deleteIcon from '@fortawesome/fontawesome-free-solid/faMinusCircle';
+import FontAwesomeIcon from '@fortawesome/react-fontawesome';
 import './AsideMenu.scss';
 
 export default function AsideMenu({ selectedServer }) {
@@ -19,17 +23,22 @@ export default function AsideMenu({ selectedServer }) {
           to={`/server/${serverId}/list-short-urls/1`}
           isActive={isListShortUrlsActive}
         >
-          List short URLs
+          <FontAwesomeIcon icon={listIcon} />
+          <span className="aside-menu__item-text">List short URLs</span>
         </NavLink>
         <NavLink
           className="aside-menu__item"
           activeClassName="aside-menu__item--selected"
           to={`/server/${serverId}/create-short-url`}
         >
-          Create short code
+          <FontAwesomeIcon icon={createIcon} />
+          <span className="aside-menu__item-text">Create short code</span>
         </NavLink>
         <span className="aside-menu__item--divider" />
-        <span className="aside-menu__item aside-menu__item--danger">Delete this server</span>
+        <span className="aside-menu__item aside-menu__item--danger">
+          <FontAwesomeIcon icon={deleteIcon} />
+          <span className="aside-menu__item-text">Delete this server</span>
+        </span>
       </nav>
     </aside>
   );
diff --git a/src/common/AsideMenu.scss b/src/common/AsideMenu.scss
index 1cfa1f54..6ce257ae 100644
--- a/src/common/AsideMenu.scss
+++ b/src/common/AsideMenu.scss
@@ -49,3 +49,7 @@
   color: #fff;
   background-color: $dangerColor;
 }
+
+.aside-menu__item-text {
+  margin-left: 8px;
+}