Merge pull request #7982 from artoscinote/ma_SCI_11198

Add confirmation modal for repository file delete [SCI-11198]

app/assets/javascripts/repositories/repository_datatable.js

@@ -328,6 +328,40 @@ var RepositoryDatatable = (function(global) {
     });
   }
 
+  function initDeleteAssetValueConfirmModal() {
+    $('#deleteRepositoryAssetValueModal').on('shown.bs.modal', function() {
+      let $fileBtn = $(this).data('cellFileBtn');
+      let $input = $(this).data('cellInput');
+      let $label = $(this).data('cellLabel');
+
+      $('#confirmAssetValueDelete').one('click', function() {
+        $fileBtn.addClass('new-file');
+        $label.text('');
+        $input.val('');
+        $fileBtn.removeClass('error');
+
+        if (!$input.data('is-empty')) { // set hidden field for deletion only if original value has been set on rendering
+          $input
+            .prev('.file-hidden-field-container')
+            .html(`<input type="hidden"
+                       form="${$input.attr('form')}"
+                       name="repository_cells[${$input.data('col-id')}]"
+                       value=""/>`);
+        }
+
+        $('#deleteRepositoryAssetValueModal').modal('hide');
+      });
+    });
+
+    $('#deleteRepositoryAssetValueModal').on('hidden.bs.modal', function() {
+      const $deleteRepositoryAssetValueModal = $('#deleteRepositoryAssetValueModal');
+
+      $deleteRepositoryAssetValueModal.data('cellFileBtn', null);
+      $deleteRepositoryAssetValueModal.data('cellInput', null);
+      $deleteRepositoryAssetValueModal.data('cellLabel', null);
+    });
+  }
+
   function initActiveRemindersFilter() {
     $(TABLE_WRAPPER_ID).find('#only_reminders').on('change', function() {
       var $activeRemindersFilter = $(this).closest('.active-reminders-filter');
@@ -804,6 +838,7 @@ var RepositoryDatatable = (function(global) {
         initSaveButton();
         initCancelButton();
         initBSTooltips();
+        initDeleteAssetValueConfirmModal();
         window.initRepositoryStateMenu();
         DataTableHelpers.initLengthAppearance($(TABLE_ID).closest('.dataTables_wrapper'));
 

app/assets/javascripts/repositories/row_editor.js

@@ -80,25 +80,17 @@ var RepositoryDatatableRowEditor = (function() {
       $fileBtn.removeClass('error');
     });
 
-
     deleteButtons.on('click', function() {
+      const $deleteRepositoryAssetValueModal = $('#deleteRepositoryAssetValueModal');
       let $fileBtn = $(this).parent();
       let $input = $fileBtn.prev('input[type=file]');
       let $label = $fileBtn.find('label');
 
-      $fileBtn.addClass('new-file');
+      $deleteRepositoryAssetValueModal.data('cellFileBtn', $fileBtn);
-      $label.text('');
+      $deleteRepositoryAssetValueModal.data('cellInput', $input);
-      $input.val('');
+      $deleteRepositoryAssetValueModal.data('cellLabel', $label);
-      $fileBtn.removeClass('error');
 
-      if (!$input.data('is-empty')) { // set hidden field for deletion only if original value has been set on rendering
+      $('#deleteRepositoryAssetValueModal').modal('show');
-        $input
-          .prev('.file-hidden-field-container')
-          .html(`<input type="hidden"
-                     form="${$input.attr('form')}"
-                     name="repository_cells[${$input.data('col-id')}]"
-                     value=""/>`);
-      }
     });
   }
 

app/views/repositories/_delete_asset_value_modal.html.erb

@@ -0,0 +1,19 @@
+<div class="modal fade" id="deleteRepositoryAssetValueModal" tabindex="-1" role="dialog" aria-labelledby="deleteRepositoryAssetValueModalLabel">
+  <div class="modal-dialog" role="document" data-e2e="e2e-MD-invInventoryDeleteAssetAT">
+    <div class="modal-content">
+      <div class="modal-header">
+        <button type="button" data-e2e="e2e-BT-invInventoryDeleteAssetMD-close" class="close" data-dismiss="modal" aria-label="Close"><i class="sn-icon sn-icon-close"></i></button>
+        <h4 class="modal-title"><%= t("repositories.modal_delete_asset_value.title") %></h4>
+      </div>
+      <div class="modal-body">
+        <%= t("repositories.modal_delete_asset_value.notice_html") %>
+      </div>
+      <div class="modal-footer">
+        <button type="button" data-e2e="e2e-BT-invInventoryDeleteAssetMD-cancel" class="btn btn-secondary" data-dismiss="modal"><%= t("general.cancel")%></button>
+        <button id="confirmAssetValueDelete" type="button" data-e2e="e2e-BT-invInventoryDeleteAssetMD-delete" class="btn btn-danger delete-asset-value-modal-button" data-dismiss="modal">
+          <%= t("repositories.modal_delete_asset_value.delete") %>
+        </button>
+      </div>
+    </div>
+  </div>
+</div>

app/views/repositories/show.html.erb

@@ -78,6 +78,7 @@
 
 
 <%= render partial: "repositories/delete_record_modal" %>
+<%= render partial: "repositories/delete_asset_value_modal" %>
 <%= render partial: 'repositories/export_repository_rows_modal',
            locals: { repository: @repository } %>
 

config/locales/en.yml

@@ -2425,6 +2425,10 @@ en:
       title: "Delete items"
       notice: "Are you sure you want to delete the selected item(s)?"
       delete: "Delete"
+    modal_delete_asset_value:
+      title: "Confirm file deletion?"
+      notice_html: "<p>Deleting this file will remove the entire column history.<br><br></p><p>This action is irreversible.<br><br></p><p>To retain version history, replace the file with a new one instead.</p>"
+      delete: "Delete"
     modal_delete_column:
       title: "Delete a column"
       message: "Are you sure you wish to permanently delete selected column %{column}? This action is irreversible."