The BIG frontend update

src/frontend/items.eta.html

@@ -3,7 +3,7 @@
 <!-- TODO: Center table content -->
 <h1>Items</h1>
 <div class="container">
-	<table class="table">
+	<table class="table align-middle">
 		<thead>
 			<tr>
 				<th scope="col">SKU</th>
@@ -12,6 +12,13 @@
 				<th scope="col">Actions</th>
 			</tr>
 		</thead>
+		<% if(it.items.length == 0) { %>
+		<tbody>
+			<tr>
+				<td colspan="4" class="text-center">No items found</td>
+			</tr>
+		</tbody>
+		<% } %>
 		<tbody>
 			<% it.items.forEach(function(user){ %>
 			<tr>
@@ -23,6 +30,19 @@
 			<% }) %>
 		</tbody>
 	</table>
+	<br>
+	<% if(it.maxPages > 1) { %>
+	<nav aria-label="Page selector">
+		<ul class="pagination justify-content-center">
+		  <li class="page-item <%= it.currentPage-1 < 1 ? 'disabled' : ''%>"><a class="page-link" href="?page=<%= it.currentPage - 1 %>">Previous</a></li>
+		  <% for (var i = 1; i <= it.maxPages; i++) { %>
+		  	<li class="page-item <%= it.currentPage == i ? 'active' : ''%> "><a class="page-link" href="?page=<%= i %>"><%= i %></a></li>
+		  <% } %>
+		  				
+		  <li class="page-item <%= it.currentPage+1 > it.maxPages ? 'disabled' : ''%>"><a class="page-link" href="?page=<%= it.currentPage + 1 %>">Next</a></li>
+		</ul>
+	      </nav>
+	<% } %>
 </div>
 
 <%~ E.includeFile("partials/controlsFoot.eta.html") %> <%~ E.includeFile("partials/foot.eta.html") %>