From 6543eca32c8f361fca2d18d565edf43d2810e3da Mon Sep 17 00:00:00 2001
From: Seyi Adebajo <sadebajo@linkedin.com>
Date: Fri, 18 Aug 2017 04:36:14 -0700
Subject: [PATCH] adds compliance action buttons to affirm or discard
 suggestions

---
 .../app/components/auto-suggest-action.js       | 17 +++++++++++++++++
 .../components/dataset-compliance/_all.scss     |  1 +
 .../_compliance-auto-suggester-action.scss      | 16 ++++++++++++++++
 .../components/auto-suggest-action.hbs          | 15 +++++++++++++++
 .../templates/components/dataset-compliance.hbs |  2 ++
 5 files changed, 51 insertions(+)
 create mode 100644 wherehows-web/app/components/auto-suggest-action.js
 create mode 100644 wherehows-web/app/styles/components/dataset-compliance/_compliance-auto-suggester-action.scss
 create mode 100644 wherehows-web/app/templates/components/auto-suggest-action.hbs

diff --git a/wherehows-web/app/components/auto-suggest-action.js b/wherehows-web/app/components/auto-suggest-action.js
new file mode 100644
index 0000000000..85b80942df
--- /dev/null
+++ b/wherehows-web/app/components/auto-suggest-action.js
@@ -0,0 +1,17 @@
+import Ember from 'ember';
+
+const { Component, computed } = Ember;
+
+export default Component.extend({
+  tagName: 'button',
+
+  classNames: ['compliance-auto-suggester-action'],
+
+  classNameBindings: ['isAffirmative:compliance-auto-suggester-action--accept'],
+
+  /**
+   * Determines the type of suggestion action this is
+   * if type property is passed in
+   */
+  isAffirmative: computed.equal('type', 'accept')
+});
diff --git a/wherehows-web/app/styles/components/dataset-compliance/_all.scss b/wherehows-web/app/styles/components/dataset-compliance/_all.scss
index cfd3417c89..2ae6e6641f 100644
--- a/wherehows-web/app/styles/components/dataset-compliance/_all.scss
+++ b/wherehows-web/app/styles/components/dataset-compliance/_all.scss
@@ -1,3 +1,4 @@
 @import "compliance-container";
 @import "compliance-prompts";
 @import "compliance-table";
+@import "compliance-auto-suggester-action";
diff --git a/wherehows-web/app/styles/components/dataset-compliance/_compliance-auto-suggester-action.scss b/wherehows-web/app/styles/components/dataset-compliance/_compliance-auto-suggester-action.scss
new file mode 100644
index 0000000000..aac4a83d93
--- /dev/null
+++ b/wherehows-web/app/styles/components/dataset-compliance/_compliance-auto-suggester-action.scss
@@ -0,0 +1,16 @@
+/// Defines styles for the compliance auto suggestion action button
+.compliance-auto-suggester-action {
+  text-decoration: none;
+  text-align: center;
+  padding: 0;
+  border: 0;
+  background-color: transparent;
+  display: inline-block;
+  vertical-align: middle;
+  color: set-color(red, red5);
+  margin: 0 5px;
+
+  &--accept {
+    color: set-color(green, green5);
+  }
+}
diff --git a/wherehows-web/app/templates/components/auto-suggest-action.hbs b/wherehows-web/app/templates/components/auto-suggest-action.hbs
new file mode 100644
index 0000000000..5496283272
--- /dev/null
+++ b/wherehows-web/app/templates/components/auto-suggest-action.hbs
@@ -0,0 +1,15 @@
+{{#if (eq type "accept")}}
+  <svg viewBox="0 0 24 24" width="24px" height="24px" x="0" y="0" preserveAspectRatio="xMinYMin meet">
+    <g class="large-icon" style="fill: currentColor">
+      <path d="M19.68,4L9,17.7,4.36,12,3,13.06l5.42,6.67A0.72,0.72,0,0,0,9,20a0.7,0.7,0,0,0,.59-0.28L21,5.05Z"></path>
+    </g>
+  </svg>
+{{else}}
+  <svg viewBox="0 0 24 24" width="24px" height="24px" x="0" y="0" preserveAspectRatio="xMinYMin meet">
+    <g class="large-icon" style="fill: currentColor">
+      <path
+        d="M20,5.32L13.32,12,20,18.68,18.66,20,12,13.33,5.34,20,4,18.68,10.68,12,4,5.32,5.32,4,12,10.69,18.68,4Z"></path>
+    </g>
+  </svg>
+{{/if}}
+
diff --git a/wherehows-web/app/templates/components/dataset-compliance.hbs b/wherehows-web/app/templates/components/dataset-compliance.hbs
index 43fc19860d..292baaef2e 100644
--- a/wherehows-web/app/templates/components/dataset-compliance.hbs
+++ b/wherehows-web/app/templates/components/dataset-compliance.hbs
@@ -259,6 +259,8 @@
             {{#row.cell}}
               {{#if row.suggestion}}
                 {{row.suggestion.confidence}}%
+                {{auto-suggest-action type="accept"}}
+                {{auto-suggest-action}}
               {{else}}
                 &mdash;
               {{/if}}