Merge pull request #1371 from cptran777/schemaless-tagging-fix

Fixes issues where schemaless tagging component was permanently uneditable

wherehows-web/app/components/datasets/schemaless-tagging.ts

@@ -2,7 +2,8 @@ import Component from '@ember/component';
 import { get, computed } from '@ember/object';
 import { action } from '@ember-decorators/object';
 import { ISecurityClassificationOption } from 'wherehows-web/typings/app/dataset-compliance';
-import { getSecurityClassificationDropDownOptions } from 'wherehows-web/constants';
+import { getSecurityClassificationDropDownOptions, ComplianceEdit } from 'wherehows-web/constants';
+import { noop } from 'wherehows-web/utils/helpers/functions';
 
 export default class SchemalessTagging extends Component {
   classNames = ['schemaless-tagging'];
@@ -21,6 +22,11 @@ export default class SchemalessTagging extends Component {
     securityClassification: ISecurityClassificationOption['value']
   ) => ISecurityClassificationOption['value'];
 
+  /**
+   * Used to pass around constants in the component or template
+   */
+  ComplianceEdit = ComplianceEdit;
+
   /**
    * Flag indicating that the dataset contains personally identifiable data
    * @type {boolean}
@@ -28,6 +34,13 @@ export default class SchemalessTagging extends Component {
    */
   containsPersonalData: boolean;
 
+  /**
+   * Passed through flag that determines whether or not we are in an editing state for this
+   * component
+   * @type {boolean}
+   */
+  isEditing: boolean;
+
   /**
    * List of drop down options for classifying the dataset
    * @type {Array<ISecurityClassificationOption>}
@@ -39,13 +52,6 @@ export default class SchemalessTagging extends Component {
     return getSecurityClassificationDropDownOptions(get(this, 'containsPersonalData'));
   });
 
-  /**
-   * Flag indicating if this component should be in edit mode or readonly
-   * @type {boolean}
-   * @memberof SchemalessTagging
-   */
-  isEditable: boolean;
-
   /**
    * The current dataset classification value
    * @type { ISecurityClassificationOption.value}
@@ -53,6 +59,55 @@ export default class SchemalessTagging extends Component {
    */
   classification: ISecurityClassificationOption['value'];
 
+  /**
+   * Passed through action from the parent dataset-compliance component that toggles editing
+   * at the container level
+   * @type {(e: boolean) => void}
+   */
+  toggleEditing: (edit: boolean) => void;
+
+  /**
+   * Passed through action from the parent dataset-compliance component that triggers a save
+   * action for the compliance information
+   * @type {() => Promise<void>}
+   */
+  onSaveCompliance: () => Promise<void>;
+
+  /**
+   * Passed through action from the parent dataset-compliance component that triggers a reset
+   * for our compliance information, effectively rolling us back to the server state
+   * @type {() => void}
+   */
+  resetCompliance: () => void;
+
+  constructor() {
+    super(...arguments);
+
+    typeof this.isEditing === 'boolean' || (this.isEditing = false);
+    this.toggleEditing || (this.toggleEditing = noop);
+    this.onSaveCompliance || (this.onSaveCompliance = noop);
+    this.resetCompliance || (this.resetCompliance = noop);
+  }
+
+  /**
+   * Action in the template action bar that the user clicks to save their changes to the dataset
+   * level classification
+   */
+  @action
+  saveCompliance() {
+    this.onSaveCompliance();
+  }
+
+  /**
+   * Action in the template action bar that the user clicks to cancel their changes. It sets our
+   * editing flag to false and re-fetches information from the server to "roll back" our changes
+   */
+  @action
+  onCancel() {
+    this.toggleEditing(false);
+    this.resetCompliance();
+  }
+
   /**
    * Invokes the closure action onPersonaDataChange when the flag is toggled
    * @param {boolean} containsPersonalDataTag flag indicating that the dataset contains personal data

wherehows-web/app/templates/components/dataset-compliance.hbs

@@ -98,6 +98,7 @@
         {{datasets/compliance/export-policy
           exportPolicyData=exportPolicy
           isEditing=isEditing
+          wikiLinks=@wikiLinks
           toggleEditing=(action toggleEditing)
           onSaveExportPolicy=(action "saveExportPolicy")}}
       {{/if}}
@@ -166,14 +167,17 @@
 
       {{#if schemaless}}
 
-        {{#if (or isReadOnly (eq editTarget ComplianceEdit.CompliancePolicy))}}
+        {{#if (or isReadOnly (eq editTarget ComplianceEdit.DatasetLevelPolicy))}}
           {{datasets/schemaless-tagging
             classificationHelpLink=@wikiLinks.dht
-            isEditable=(not isReadOnly)
+            isEditing=isEditing
             classification=(readonly complianceInfo.confidentiality)
             containsPersonalData=(readonly complianceInfo.containingPersonalData)
+            toggleEditing=(action toggleEditing)
             onClassificationChange=(action "onDatasetSecurityClassificationChange")
             onPersonalDataChange=(action "onDatasetLevelPolicyChange")
+            onSaveCompliance=(action "saveCompliance")
+            resetCompliance=(action "resetCompliance")
           }}
         {{/if}}
 

wherehows-web/app/templates/components/datasets/schemaless-tagging.hbs

@@ -2,10 +2,24 @@
   <header class="metadata-prompt__header">
     <p>
       Dataset <span title="Personally Identifiable Information" class="define-text">PII</span> & Security Classification
+
     </p>
+
+    {{#unless isEditing}}
+      <div class="compliance-entities-meta__secondary">
+        <button class="nacho-button nacho-button--tertiary" {{action toggleEditing true ComplianceEdit.DatasetLevelPolicy}}>
+          <i class="fa fa-pencil" aria-label="Edit Schemaless Classification"></i>
+          Edit
+        </button>
+      </div>
+    {{/unless}}
   </header>
 </section>
 
+{{#if isEditing}}
+  {{partial "datasets/dataset-compliance/action-bar"}}
+{{/if}}
+
 <div class="schemaless-tagging__tag">
   <h4 class="schemaless-tagging__prompt">
     Dataset contains personally identifiable information?
@@ -16,7 +30,7 @@
       id=(concat elementId '-schemaless-checkbox')
       type="checkbox"
       class="toggle-switch toggle-switch--light"
-      disabled=(not isEditable)
+      disabled=(not isEditing)
       checked=(readonly containsPersonalData)
       change=(action "onPersonalDataToggle" value="target.checked")
     }}
@@ -39,7 +53,7 @@
     {{ember-selector
       values=classifiers
       selected=classification
-      disabled=(not isEditable)
+      disabled=(not isEditing)
       selectionDidChange=(action "onSecurityClassificationChange")
     }}
   </div>