Update delete modal text

- Single delete
- Multi delete

Update translations string in gitlab.pot

Finalise modal text for tags deletion

app/assets/javascripts/registry/components/table_registry.vue

@@ -53,8 +53,8 @@ export default {
     },
     modalTitle() {
       return n__(
-        'ContainerRegistry|Remove image',
-        'ContainerRegistry|Remove images',
+        'ContainerRegistry|Remove tag',
+        'ContainerRegistry|Remove tags',
         this.itemsToBeDeleted.length === 0 ? 1 : this.itemsToBeDeleted.length,
       );
     },
@@ -67,16 +67,14 @@ export default {
     setModalDescription(itemIndex = -1) {
       if (itemIndex === -1) {
         this.modalDescription = sprintf(
-          s__(`ContainerRegistry|You are about to delete <b>%{count}</b> images. This will
-              delete the images and all tags pointing to them.`),
+          s__(`ContainerRegistry|You are about to remove <b>%{count}</b> tags. Are you sure?`),
           { count: this.itemsToBeDeleted.length },
         );
       } else {
         const { tag } = this.repo.list[itemIndex];
 
         this.modalDescription = sprintf(
-          s__(`ContainerRegistry|You are about to delete the image <b>%{title}</b>. This will
-              delete the image and all tags pointing to this image.`),
+          s__(`ContainerRegistry|You are about to remove <b>%{title}</b>. Are you sure?`),
           { title: `${this.repo.name}:${tag}` },
         );
       }
@@ -195,8 +193,8 @@ export default {
               :disabled="!itemsToBeDeleted || itemsToBeDeleted.length === 0"
               class="js-delete-registry float-right"
               variant="danger"
-              :title="s__('ContainerRegistry|Remove selected images')"
-              :aria-label="s__('ContainerRegistry|Remove selected images')"
+              :title="s__('ContainerRegistry|Remove selected tags')"
+              :aria-label="s__('ContainerRegistry|Remove selected tags')"
               @click="deleteMultipleItems()"
             >
               <icon name="remove" />
@@ -246,8 +244,8 @@ export default {
             <gl-button
               v-if="item.canDelete"
               v-gl-modal="modalId"
-              :title="s__('ContainerRegistry|Remove image')"
-              :aria-label="s__('ContainerRegistry|Remove image')"
+              :title="s__('ContainerRegistry|Remove tag')"
+              :aria-label="s__('ContainerRegistry|Remove tag')"
               variant="danger"
               class="js-delete-registry-row float-right btn-inverted btn-border-color btn-icon"
               @click="deleteSingleItem(index)"
@@ -268,7 +266,7 @@ export default {
 
     <gl-modal ref="deleteModal" :modal-id="modalId" ok-variant="danger">
       <template v-slot:modal-title>{{ modalTitle }}</template>
-      <template v-slot:modal-ok>{{ s__('ContainerRegistry|Remove image(s) and tags') }}</template>
+      <template v-slot:modal-ok>{{ s__('ContainerRegistry|Remove tag(s)') }}</template>
       <p v-html="modalDescription"></p>
     </gl-modal>
   </div>

changelogs/unreleased/31547-update-registry-tag-delete-popup-message.yml

+---
+title: Update registry tag delete popup message
+merge_request: 17257
+author:
+type: changed

locale/gitlab.pot

@@ -4208,18 +4208,18 @@ msgstr ""
 msgid "ContainerRegistry|Quick Start"
 msgstr ""
 
-msgid "ContainerRegistry|Remove image"
-msgid_plural "ContainerRegistry|Remove images"
-msgstr[0] ""
-msgstr[1] ""
-
-msgid "ContainerRegistry|Remove image(s) and tags"
+msgid "ContainerRegistry|Remove repository"
 msgstr ""
 
-msgid "ContainerRegistry|Remove repository"
+msgid "ContainerRegistry|Remove selected tags"
 msgstr ""
 
-msgid "ContainerRegistry|Remove selected images"
+msgid "ContainerRegistry|Remove tag"
+msgid_plural "ContainerRegistry|Remove tags"
+msgstr[0] ""
+msgstr[1] ""
+
+msgid "ContainerRegistry|Remove tag(s)"
 msgstr ""
 
 msgid "ContainerRegistry|Size"
@@ -4243,10 +4243,10 @@ msgstr ""
 msgid "ContainerRegistry|With the Docker Container Registry integrated into GitLab, every project can have its own space to store its Docker images. %{docLinkStart}More Information%{docLinkEnd}"
 msgstr ""
 
-msgid "ContainerRegistry|You are about to delete <b>%{count}</b> images. This will delete the images and all tags pointing to them."
+msgid "ContainerRegistry|You are about to remove <b>%{count}</b> tags. Are you sure?"
 msgstr ""
 
-msgid "ContainerRegistry|You are about to delete the image <b>%{title}</b>. This will delete the image and all tags pointing to this image."
+msgid "ContainerRegistry|You are about to remove <b>%{title}</b>. Are you sure?"
 msgstr ""
 
 msgid "ContainerRegistry|You are about to remove repository <b>%{title}</b>. Once you confirm, this repository will be permanently deleted."

spec/features/container_registry_spec.rb

@@ -58,7 +58,7 @@ describe 'Container Registry', :js do
       expect(Projects::ContainerRepository::DeleteTagsService).to receive(:new).with(container_repository.project, user, tags: ['latest']) { service }
 
       click_on(class: 'js-delete-registry-row', visible: false)
-      expect(find('.modal .modal-title')).to have_content 'Remove image'
+      expect(find('.modal .modal-title')).to have_content 'Remove tag'
       find('.modal .modal-footer .btn-danger').click
     end
   end

spec/frontend/registry/components/table_registry_spec.js

@@ -196,7 +196,7 @@ describe('table registry', () => {
     it('should show the singular title and image name when deleting a single image', () => {
       wrapper.setData({ itemsToBeDeleted: [1] });
       wrapper.vm.setModalDescription(0);
-      expect(wrapper.vm.modalTitle).toBe('Remove image');
+      expect(wrapper.vm.modalTitle).toBe('Remove tag');
       expect(wrapper.vm.modalDescription).toContain(firstImage.tag);
     });
 
@@ -204,8 +204,8 @@ describe('table registry', () => {
       wrapper.setData({ itemsToBeDeleted: [1, 2] });
       wrapper.vm.setModalDescription();
 
-      expect(wrapper.vm.modalTitle).toBe('Remove images');
-      expect(wrapper.vm.modalDescription).toContain('<b>2</b> images');
+      expect(wrapper.vm.modalTitle).toBe('Remove tags');
+      expect(wrapper.vm.modalDescription).toContain('<b>2</b> tags');
     });
   });
 });