Welcome to mirror list, hosted at ThFree Co, Russian Federation.

gitlab.com/gitlab-org/gitlab-foss.git - Unnamed repository; edit this file 'description' to name the repository.
summaryrefslogtreecommitdiff
path: root/app/assets/javascripts/repository/components/delete_blob_modal.vue
diff options
context:
space:
mode:
Diffstat (limited to 'app/assets/javascripts/repository/components/delete_blob_modal.vue')
-rw-r--r--app/assets/javascripts/repository/components/delete_blob_modal.vue199
1 files changed, 139 insertions, 60 deletions
diff --git a/app/assets/javascripts/repository/components/delete_blob_modal.vue b/app/assets/javascripts/repository/components/delete_blob_modal.vue
index cbdf6ef9ccd..97171a3282b 100644
--- a/app/assets/javascripts/repository/components/delete_blob_modal.vue
+++ b/app/assets/javascripts/repository/components/delete_blob_modal.vue
@@ -1,8 +1,18 @@
<script>
-import { GlModal, GlFormGroup, GlFormInput, GlFormTextarea, GlToggle, GlForm } from '@gitlab/ui';
+import {
+ GlModal,
+ GlFormGroup,
+ GlFormInput,
+ GlFormTextarea,
+ GlToggle,
+ GlForm,
+ GlSprintf,
+ GlLink,
+} from '@gitlab/ui';
import csrf from '~/lib/utils/csrf';
-import { __ } from '~/locale';
+import { __, s__ } from '~/locale';
import validation from '~/vue_shared/directives/validation';
+import { helpPagePath } from '~/helpers/help_page_helper';
import {
SECONDARY_OPTIONS_TEXT,
COMMIT_LABEL,
@@ -28,8 +38,19 @@ export default {
GlFormTextarea,
GlToggle,
GlForm,
+ GlSprintf,
+ GlLink,
},
i18n: {
+ LFS_WARNING_TITLE: __("The file you're about to delete is tracked by LFS"),
+ LFS_WARNING_PRIMARY_CONTENT: s__(
+ 'BlobViewer|If you delete the file, it will be removed from the branch %{branch}.',
+ ),
+ LFS_WARNING_SECONDARY_CONTENT: s__(
+ 'BlobViewer|This file will still take up space in your LFS storage. %{linkStart}How do I remove tracked objects from Git LFS?%{linkEnd}',
+ ),
+ LFS_CONTINUE_TEXT: __('Continue…'),
+ LFS_CANCEL_TEXT: __('Cancel'),
PRIMARY_OPTIONS_TEXT: __('Delete file'),
SECONDARY_OPTIONS_TEXT,
COMMIT_LABEL,
@@ -79,6 +100,11 @@ export default {
type: Boolean,
required: true,
},
+ isUsingLfs: {
+ type: Boolean,
+ required: false,
+ default: false,
+ },
},
data() {
const form = {
@@ -91,6 +117,7 @@ export default {
},
};
return {
+ lfsWarningDismissed: false,
loading: false,
createNewMr: true,
error: '',
@@ -99,7 +126,7 @@ export default {
},
computed: {
primaryOptions() {
- return {
+ const defaultOptions = {
text: this.$options.i18n.PRIMARY_OPTIONS_TEXT,
attributes: {
variant: 'danger',
@@ -107,6 +134,13 @@ export default {
disabled: this.loading || !this.form.state,
},
};
+
+ const lfsWarningOptions = {
+ text: this.$options.i18n.LFS_CONTINUE_TEXT,
+ attributes: { variant: 'confirm' },
+ };
+
+ return this.showLfsWarning ? lfsWarningOptions : defaultOptions;
},
cancelOptions() {
return {
@@ -139,14 +173,39 @@ export default {
(hasFirstLineExceedMaxLength || hasOtherLineExceedMaxLength)
);
},
- /* eslint-enable dot-notation */
+ showLfsWarning() {
+ return this.isUsingLfs && !this.lfsWarningDismissed;
+ },
+ title() {
+ return this.showLfsWarning ? this.$options.i18n.LFS_WARNING_TITLE : this.modalTitle;
+ },
+ showDeleteForm() {
+ return !this.isUsingLfs || (this.isUsingLfs && this.lfsWarningDismissed);
+ },
},
methods: {
show() {
this.$refs[this.modalId].show();
+ this.lfsWarningDismissed = false;
+ },
+ cancel() {
+ this.$refs[this.modalId].hide();
},
- submitForm(e) {
+ async handleContinueLfsWarning() {
+ this.lfsWarningDismissed = true;
+ await this.$nextTick();
+ this.$refs.message?.$el.focus();
+ },
+ async handlePrimaryAction(e) {
e.preventDefault(); // Prevent modal from closing
+
+ if (this.showLfsWarning) {
+ this.lfsWarningDismissed = true;
+ await this.$nextTick();
+ this.$refs.message?.$el.focus();
+ return;
+ }
+
this.form.showValidation = true;
if (!this.form.state) {
@@ -158,6 +217,7 @@ export default {
this.$refs.form.$el.submit();
},
},
+ deleteLfsHelpPath: helpPagePath('topics/git/lfs/index', { anchor: 'removing-objects-from-lfs' }),
};
</script>
@@ -165,67 +225,86 @@ export default {
<gl-modal
:ref="modalId"
v-bind="$attrs"
- data-testid="modal-delete"
:modal-id="modalId"
- :title="modalTitle"
+ :title="title"
:action-primary="primaryOptions"
:action-cancel="cancelOptions"
- @primary="submitForm"
+ @primary="handlePrimaryAction"
>
- <gl-form ref="form" novalidate :action="deletePath" method="post">
- <input type="hidden" name="_method" value="delete" />
- <input :value="$options.csrf.token" type="hidden" name="authenticity_token" />
- <template v-if="emptyRepo">
- <input type="hidden" name="branch_name" :value="originalBranch" class="js-branch-name" />
- </template>
- <template v-else>
- <input type="hidden" name="original_branch" :value="originalBranch" />
- <input
- v-if="createNewMr || !canPushToBranch"
- type="hidden"
- name="create_merge_request"
- value="1"
- />
- <gl-form-group
- :label="$options.i18n.COMMIT_LABEL"
- label-for="commit_message"
- :invalid-feedback="form.fields['commit_message'].feedback"
- >
- <gl-form-textarea
- v-model="form.fields['commit_message'].value"
- v-validation:[form.showValidation]
- name="commit_message"
- data-qa-selector="commit_message_field"
- :state="form.fields['commit_message'].state"
- :disabled="loading"
- required
+ <div v-if="showLfsWarning">
+ <p>
+ <gl-sprintf :message="$options.i18n.LFS_WARNING_PRIMARY_CONTENT">
+ <template #branch>
+ <code>{{ targetBranch }}</code>
+ </template>
+ </gl-sprintf>
+ </p>
+
+ <p>
+ <gl-sprintf :message="$options.i18n.LFS_WARNING_SECONDARY_CONTENT">
+ <template #link="{ content }">
+ <gl-link :href="$options.deleteLfsHelpPath">{{ content }}</gl-link>
+ </template>
+ </gl-sprintf>
+ </p>
+ </div>
+ <div v-if="showDeleteForm">
+ <gl-form ref="form" novalidate :action="deletePath" method="post">
+ <input type="hidden" name="_method" value="delete" />
+ <input :value="$options.csrf.token" type="hidden" name="authenticity_token" />
+ <template v-if="emptyRepo">
+ <input type="hidden" name="branch_name" :value="originalBranch" class="js-branch-name" />
+ </template>
+ <template v-else>
+ <input type="hidden" name="original_branch" :value="originalBranch" />
+ <input
+ v-if="createNewMr || !canPushToBranch"
+ type="hidden"
+ name="create_merge_request"
+ value="1"
/>
- <p v-if="showHint" class="form-text gl-text-gray-600" data-testid="hint">
- {{ $options.i18n.COMMIT_MESSAGE_HINT }}
- </p>
- </gl-form-group>
- <gl-form-group
- v-if="canPushCode"
- :label="$options.i18n.TARGET_BRANCH_LABEL"
- label-for="branch_name"
- :invalid-feedback="form.fields['branch_name'].feedback"
- >
- <gl-form-input
- v-model="form.fields['branch_name'].value"
- v-validation:[form.showValidation]
- :state="form.fields['branch_name'].state"
+ <gl-form-group
+ :label="$options.i18n.COMMIT_LABEL"
+ label-for="commit_message"
+ :invalid-feedback="form.fields['commit_message'].feedback"
+ >
+ <gl-form-textarea
+ ref="message"
+ v-model="form.fields['commit_message'].value"
+ v-validation:[form.showValidation]
+ name="commit_message"
+ data-qa-selector="commit_message_field"
+ :state="form.fields['commit_message'].state"
+ :disabled="loading"
+ required
+ />
+ <p v-if="showHint" class="form-text gl-text-gray-600" data-testid="hint">
+ {{ $options.i18n.COMMIT_MESSAGE_HINT }}
+ </p>
+ </gl-form-group>
+ <gl-form-group
+ v-if="canPushCode"
+ :label="$options.i18n.TARGET_BRANCH_LABEL"
+ label-for="branch_name"
+ :invalid-feedback="form.fields['branch_name'].feedback"
+ >
+ <gl-form-input
+ v-model="form.fields['branch_name'].value"
+ v-validation:[form.showValidation]
+ :state="form.fields['branch_name'].state"
+ :disabled="loading"
+ name="branch_name"
+ required
+ />
+ </gl-form-group>
+ <gl-toggle
+ v-if="showCreateNewMrToggle"
+ v-model="createNewMr"
:disabled="loading"
- name="branch_name"
- required
+ :label="$options.i18n.TOGGLE_CREATE_MR_LABEL"
/>
- </gl-form-group>
- <gl-toggle
- v-if="showCreateNewMrToggle"
- v-model="createNewMr"
- :disabled="loading"
- :label="$options.i18n.TOGGLE_CREATE_MR_LABEL"
- />
- </template>
- </gl-form>
+ </template>
+ </gl-form>
+ </div>
</gl-modal>
</template>
generated by cgit v1.2.3 (git 2.25.1) at 2024-07-15 13:47:59 +0300