diff options
Diffstat (limited to 'app/assets/javascripts/ide/components')
3 files changed, 33 insertions, 11 deletions
diff --git a/app/assets/javascripts/ide/components/commit_sidebar/form.vue b/app/assets/javascripts/ide/components/commit_sidebar/form.vue index 2897f4cbf77..9ec4a07a3d0 100644 --- a/app/assets/javascripts/ide/components/commit_sidebar/form.vue +++ b/app/assets/javascripts/ide/components/commit_sidebar/form.vue @@ -186,7 +186,7 @@ export default { data-testid="commit-button" class="qa-commit-button" category="primary" - variant="success" + variant="confirm" @click="commit" > {{ __('Commit') }} diff --git a/app/assets/javascripts/ide/components/commit_sidebar/list.vue b/app/assets/javascripts/ide/components/commit_sidebar/list.vue index fbe353fc4ba..829686ef051 100644 --- a/app/assets/javascripts/ide/components/commit_sidebar/list.vue +++ b/app/assets/javascripts/ide/components/commit_sidebar/list.vue @@ -1,12 +1,12 @@ <script> -import { GlModal, GlIcon, GlTooltipDirective } from '@gitlab/ui'; +import { GlButton, GlModal, GlTooltipDirective } from '@gitlab/ui'; import { mapActions } from 'vuex'; import { __, sprintf } from '~/locale'; import ListItem from './list_item.vue'; export default { components: { - GlIcon, + GlButton, ListItem, GlModal, }, @@ -70,7 +70,7 @@ export default { <div class="d-flex align-items-center flex-fill"> <strong> {{ titleText }} </strong> <div class="d-flex ml-auto"> - <button + <gl-button v-if="!stagedList" v-gl-tooltip :title="__('Discard all changes')" @@ -79,15 +79,14 @@ export default { :class="{ 'disabled-content': !filesLength, }" - type="button" - class="d-flex ide-staged-action-btn p-0 border-0 align-items-center" + class="gl-shadow-none!" + category="tertiary" + icon="remove-all" data-placement="bottom" data-container="body" data-boundary="viewport" @click="openDiscardModal" - > - <gl-icon :size="16" name="remove-all" class="ml-auto mr-auto position-top-0" /> - </button> + /> </div> </div> </header> diff --git a/app/assets/javascripts/ide/components/repo_editor.vue b/app/assets/javascripts/ide/components/repo_editor.vue index 5c711313ff6..bf5ec849bc5 100644 --- a/app/assets/javascripts/ide/components/repo_editor.vue +++ b/app/assets/javascripts/ide/components/repo_editor.vue @@ -38,6 +38,8 @@ import { getPathParent, readFileAsDataURL, registerSchema, isTextFile } from '.. import FileAlert from './file_alert.vue'; import FileTemplatesBar from './file_templates/bar.vue'; +const MARKDOWN_FILE_TYPE = 'markdown'; + export default { name: 'RepoEditor', components: { @@ -201,7 +203,7 @@ export default { showContentViewer(val) { if (!val) return; - if (this.fileType === 'markdown') { + if (this.fileType === MARKDOWN_FILE_TYPE) { const { content, images } = extractMarkdownImagesFromEntries(this.file, this.entries); this.content = content; this.images = images; @@ -309,6 +311,23 @@ export default { }), ); + if (this.fileType === MARKDOWN_FILE_TYPE) { + import('~/editor/extensions/source_editor_markdown_ext') + .then(({ EditorMarkdownExtension: MarkdownExtension } = {}) => { + this.editor.use( + new MarkdownExtension({ + instance: this.editor, + projectPath: this.currentProjectId, + }), + ); + }) + .catch((e) => + createFlash({ + message: e, + }), + ); + } + this.$nextTick(() => { this.setupEditor(); }); @@ -406,7 +425,11 @@ export default { const reImage = /^image\/(png|jpg|jpeg|gif)$/; const file = event.clipboardData.files[0]; - if (editor.hasTextFocus() && this.fileType === 'markdown' && reImage.test(file?.type)) { + if ( + editor.hasTextFocus() && + this.fileType === MARKDOWN_FILE_TYPE && + reImage.test(file?.type) + ) { // don't let the event be passed on to Monaco. event.preventDefault(); event.stopImmediatePropagation(); |