From 05c24df9e389cc72b46298b505a753f39800ad02 Mon Sep 17 00:00:00 2001
From: Kia Lam <digitalanime@gmail.com>
Date: Wed, 23 Jan 2019 11:46:43 -0500
Subject: [PATCH] Add list toolbar component.

---
 .../components/list/list-toolbar.directive.js  | 18 ++++++++++++++++++
 .../components/list/list-toolbar.partial.html  |  5 +++++
 2 files changed, 23 insertions(+)
 create mode 100644 awx/ui/client/lib/components/list/list-toolbar.directive.js
 create mode 100644 awx/ui/client/lib/components/list/list-toolbar.partial.html

diff --git a/awx/ui/client/lib/components/list/list-toolbar.directive.js b/awx/ui/client/lib/components/list/list-toolbar.directive.js
new file mode 100644
index 0000000000..57183e32af
--- /dev/null
+++ b/awx/ui/client/lib/components/list/list-toolbar.directive.js
@@ -0,0 +1,18 @@
+const templateUrl = require('~components/list/list-toolbar.partial.html');
+
+function atListToolbar () {
+    return {
+        restrict: 'E',
+        replace: true,
+        transclude: true,
+        templateUrl,
+        scope: {
+            onExpand: '=',
+            onCollapse: '=',
+            sortOnly: '=',
+            isCollapsed: '=',
+        }
+    };
+}
+
+export default atListToolbar;
diff --git a/awx/ui/client/lib/components/list/list-toolbar.partial.html b/awx/ui/client/lib/components/list/list-toolbar.partial.html
new file mode 100644
index 0000000000..4511be1760
--- /dev/null
+++ b/awx/ui/client/lib/components/list/list-toolbar.partial.html
@@ -0,0 +1,5 @@
+<div class="at-List-toolbar--attached">
+  <div ng-class="isCollapsed ? 'active' : ''" ng-if="!sortOnly" class="at-List-toolbar-item" ng-click="onCollapse()">Compact</div>
+  <div ng-class="!isCollapsed ? 'active' : ''" ng-if="!sortOnly" class="at-List-toolbar-item" ng-click="onExpand()">Expanded</div>
+  <div class="at-List-toolbar-item">Sort</div>
+</div>
\ No newline at end of file