diff --git a/InvenTree/order/templates/order/sales_order_detail.html b/InvenTree/order/templates/order/sales_order_detail.html
index 5d4db70a34..109811452a 100644
--- a/InvenTree/order/templates/order/sales_order_detail.html
+++ b/InvenTree/order/templates/order/sales_order_detail.html
@@ -38,6 +38,35 @@
     </div>
 </div>
 
+<div class='panel panel-hidden' id='panel-order-shipments'>
+    {% if order.is_pending %}
+    <div class='panel-heading'>
+        <div class='d-flex flex-row'>
+            <h4>{% trans "Pending Shipments" %}</h4>
+            {% include "spacer.html" %}
+            <div class='btn-group' role='group'>
+                <button type='button' class='btn btn-success' id='new-shipment'>
+                    <span class='fas fa-plus-circle'></span> {% trans "New Shipment" %}
+                </button>
+            </div>
+        </div>
+    </div>
+    <div class='panel-content'>
+        {% if roles.sales_order.change %}
+        <div id='pending-shipment-toolbar' class='btn-group' style='float: right;'>
+        </div>
+        {% endif %}
+        <table class='table table-striped table-condensed' id='pending-shipments-table' data-toolbar='#pending-shipment-toolbar'></table>
+    </div>
+    {% endif %}
+    <div class='panel-heading'>
+        <h4>{% trans "Completed Shipments" %}</h4>
+    </div>
+    <div class='panel-content'>
+        <table class='table table-striped table-condensed' id='completed-shipments-table'></table>
+    </div>
+</div>
+
 <div class='panel panel-hidden' id='panel-order-builds'>
     <div class='panel-heading'>
         <h4>{% trans "Build Orders" %}</h4>
@@ -90,6 +119,33 @@
 {% block js_ready %}
 {{ block.super }}
 
+    // Callback when the "shipments" panel is first loaded
+    onPanelLoad('order-shipments', function() {
+
+        {% if order.is_pending %}
+        loadSalesOrderShipmentTable('#pending-shipments-table', {
+            order: {{ order.pk }},
+            shipped: false,
+        });
+
+        $('#new-shipment').click(function() {
+            createSalesOrderShipment({
+                order: {{ order.pk }},
+                onSuccess: function(data) {
+                    $('#pending-shipments-table').bootstrapTable('refresh');
+                }
+            });
+        });
+
+        {% endif %}
+
+        loadSalesOrderShipmentTable('#completed-shipments-table', {
+            order: {{ order.pk }},
+            shipped: true,
+        });
+
+    });
+
     $('#edit-notes').click(function() {
         constructForm('{% url "api-so-detail" order.pk %}', {
             fields: {
diff --git a/InvenTree/order/templates/order/so_navbar.html b/InvenTree/order/templates/order/so_navbar.html
deleted file mode 100644
index 814df0fca6..0000000000
--- a/InvenTree/order/templates/order/so_navbar.html
+++ /dev/null
@@ -1,47 +0,0 @@
-{% load i18n %}
-{% load static %}
-{% load inventree_extras %}
-
-<ul class='list-group'>
-    <li class='list-group-item'>
-        <a href='#' id='so-menu-toggle'>
-            <span class='menu-tab-icon fas fa-expand-arrows-alt'></span>
-        </a>
-    </li>
-
-    <li class='list-group-item' title='{% trans "Sales Order Line Items" %}'>
-        <a href='#' id='select-order-items' class='nav-toggle'>
-            <span class='fas fa-list-ol sidebar-icon'></span>
-            {% trans "Order Items" %}
-        </a>
-    </li>
-
-    <li class='list-group-item' title='{% trans "Shipments" %}'>
-        <a href='#' id='select-order-shipments' class='nav-toggle'>
-            <span class='fas fa-truck sidebar-icon'></span>
-            {% trans "Shipments" %}
-        </a>
-    </li>
-
-    <li class='list-group-item' title='{% trans "Build Orders" %}'>
-        <a href='#' id='select-order-builds' class='nav-toggle'>
-            <span class='fas fa-tools sidebar-icon'></span>
-            {% trans "Build Orders" %}
-        </a>
-    </li>
-
-    <li class='list-group-item' title='{% trans "Sales Order Attachments" %}'>
-        <a href='#' id='select-order-attachments' class='nav-toggle'>
-            <span class='fas fa-paperclip sidebar-icon'></span>
-            {% trans "Attachments" %}
-        </a>
-    </li>
-
-    <li class='list-group-item' title='{% trans "Notes" %}'>
-        <a href='#' id='select-order-notes' class='nav-toggle'>
-            <span class='fas fa-clipboard sidebar-icon'></span>
-            {% trans "Notes" %}
-        </a>
-    </li>
-
-</ul>
\ No newline at end of file
diff --git a/InvenTree/order/templates/order/so_sidebar.html b/InvenTree/order/templates/order/so_sidebar.html
index be924eb37b..6ee68949ee 100644
--- a/InvenTree/order/templates/order/so_sidebar.html
+++ b/InvenTree/order/templates/order/so_sidebar.html
@@ -3,6 +3,7 @@
 {% load inventree_extras %}
 
 {% include "sidebar_item.html" with label='order-items' text="Line Items" icon="fa-list-ol" %}
+{% include "sidebar_item.html" with label='order-shipments' text="Shipments" icon="fa-truck" %}
 {% include "sidebar_item.html" with label='order-builds' text="Build Orders" icon="fa-tools" %}
 {% include "sidebar_item.html" with label='order-attachments' text="Attachments" icon="fa-paperclip" %}
 {% include "sidebar_item.html" with label='order-notes' text="Notes" icon="fa-clipboard" %}