diff options
| author | Filipa Lacerda <filipa@gitlab.com> | 2018-11-21 13:35:54 +0300 |
|---|---|---|
| committer | Filipa Lacerda <filipa@gitlab.com> | 2018-11-21 13:35:54 +0300 |
| commit | d55650f045335f52ad833b5ba00990549bb032f5 (patch) | |
| tree | dde3529f894604b7f0487ff5a83dd4bfb69b677a /app/assets/javascripts/ide/components | |
| parent | 2133baaf9944da24859e54bb68d86f8cf6f89d28 (diff) | |
| parent | 98fd36274a530423399a9a4a0920e48ab82147cd (diff) | |
Merge branch 'master' into 54282-tooltip-stuck
* master: (24 commits)
Adds a PHILOSOPHY.md
Externalize strings from `/app/views/abuse_reports`
Fix Issuable container element selector for shortcuts handling
Enable Rubocop on lib/gitlab
Add user docs for Pages access control
Added information about syntax highlighting in Web IDE. Fixes gitlab-org/gitlab-ce#53571
Align issue status label and confidential icon
Externalize strings from `/app/views/repository_check_mailer`
Remove instances of `@extend .monospace`
Resolve "The reply shortcut can add any text of the page to the "comment" text area"
Upgrade escape_utils to 1.2.1
Add dedicated runner tags to assets job
Upgrade gitlab eslint config to latest
Fix broken karma specs
Disable conflicting eslint rules
Prettify all the things
Upgrade prettier to 1.15.2
Added a test for open merge request files
Update CHANGELOG.md for 11.4.7
Open first 10 merge request files in IDE
...
Diffstat (limited to 'app/assets/javascripts/ide/components')
56 files changed, 301 insertions, 980 deletions
diff --git a/app/assets/javascripts/ide/components/activity_bar.vue b/app/assets/javascripts/ide/components/activity_bar.vue index 2cebacc1c4c..a1f66ff764d 100644 --- a/app/assets/javascripts/ide/components/activity_bar.vue +++ b/app/assets/javascripts/ide/components/activity_bar.vue @@ -37,7 +37,7 @@ export default { <button v-tooltip :class="{ - active: currentActivityView === $options.activityBarViews.edit + active: currentActivityView === $options.activityBarViews.edit, }" :title="s__('IDE|Edit')" :aria-label="s__('IDE|Edit')" @@ -45,18 +45,16 @@ export default { data-placement="right" type="button" class="ide-sidebar-link js-ide-edit-mode" - @click.prevent="changedActivityView($event, $options.activityBarViews.edit)" + @click.prevent="changedActivityView($event, $options.activityBarViews.edit);" > - <icon - name="code" - /> + <icon name="code" /> </button> </li> <li> <button v-tooltip :class="{ - active: currentActivityView === $options.activityBarViews.review + active: currentActivityView === $options.activityBarViews.review, }" :title="s__('IDE|Review')" :aria-label="s__('IDE|Review')" @@ -64,18 +62,16 @@ export default { data-placement="right" type="button" class="ide-sidebar-link js-ide-review-mode" - @click.prevent="changedActivityView($event, $options.activityBarViews.review)" + @click.prevent="changedActivityView($event, $options.activityBarViews.review);" > - <icon - name="file-modified" - /> + <icon name="file-modified" /> </button> </li> <li v-show="hasChanges"> <button v-tooltip :class="{ - active: currentActivityView === $options.activityBarViews.commit + active: currentActivityView === $options.activityBarViews.commit, }" :title="s__('IDE|Commit')" :aria-label="s__('IDE|Commit')" @@ -83,11 +79,9 @@ export default { data-placement="right" type="button" class="ide-sidebar-link js-ide-commit-mode" - @click.prevent="changedActivityView($event, $options.activityBarViews.commit)" + @click.prevent="changedActivityView($event, $options.activityBarViews.commit);" > - <icon - name="commit" - /> + <icon name="commit" /> </button> </li> </ul> diff --git a/app/assets/javascripts/ide/components/branches/item.vue b/app/assets/javascripts/ide/components/branches/item.vue index cc3e84e3f77..4dff3f7e755 100644 --- a/app/assets/javascripts/ide/components/branches/item.vue +++ b/app/assets/javascripts/ide/components/branches/item.vue @@ -32,28 +32,14 @@ export default { </script> <template> - <a - :href="branchHref" - class="btn-link d-flex align-items-center" - > + <a :href="branchHref" class="btn-link d-flex align-items-center"> <span class="d-flex append-right-default ide-search-list-current-icon"> - <icon - v-if="isActive" - :size="18" - name="mobile-issue-close" - /> + <icon v-if="isActive" :size="18" name="mobile-issue-close" /> </span> <span> - <strong> - {{ item.name }} - </strong> - <span - class="ide-merge-request-project-path d-block mt-1" - > - Updated - <timeago - :time="item.committedDate || ''" - /> + <strong> {{ item.name }} </strong> + <span class="ide-merge-request-project-path d-block mt-1"> + Updated <timeago :time="item.committedDate || ''" /> </span> </span> </a> diff --git a/app/assets/javascripts/ide/components/branches/search_list.vue b/app/assets/javascripts/ide/components/branches/search_list.vue index 600e1063f89..3cfdc1a367a 100644 --- a/app/assets/javascripts/ide/components/branches/search_list.vue +++ b/app/assets/javascripts/ide/components/branches/search_list.vue @@ -68,11 +68,7 @@ export default { class="form-control dropdown-input-field" @input="searchBranches" /> - <icon - :size="18" - name="search" - class="input-icon" - /> + <icon :size="18" name="search" class="input-icon" /> </div> </div> <div class="dropdown-content ide-merge-requests-dropdown-content d-flex"> @@ -81,26 +77,13 @@ export default { :size="2" class="mt-3 mb-3 align-self-center ml-auto mr-auto" /> - <ul - v-else - class="mb-3 w-100" - > + <ul v-else class="mb-3 w-100"> <template v-if="hasBranches"> - <li - v-for="item in branches" - :key="item.name" - > - <item - :item="item" - :project-id="currentProjectId" - :is-active="isActiveBranch(item)" - /> + <li v-for="item in branches" :key="item.name"> + <item :item="item" :project-id="currentProjectId" :is-active="isActiveBranch(item)" /> </li> </template> - <li - v-else - class="ide-search-list-empty d-flex align-items-center justify-content-center" - > + <li v-else class="ide-search-list-empty d-flex align-items-center justify-content-center"> <template v-if="hasNoSearchResults"> {{ __('No branches found') }} </template> diff --git a/app/assets/javascripts/ide/components/commit_sidebar/actions.vue b/app/assets/javascripts/ide/components/commit_sidebar/actions.vue index a8b5c7a16d0..d360dc42cd3 100644 --- a/app/assets/javascripts/ide/components/commit_sidebar/actions.vue +++ b/app/assets/javascripts/ide/components/commit_sidebar/actions.vue @@ -57,11 +57,7 @@ export default { :disabled="currentBranch && !currentBranch.can_push" :title="$options.currentBranchPermissionsTooltip" > - <span - class="ide-radio-label" - v-html="commitToCurrentBranchText" - > - </span> + <span class="ide-radio-label" v-html="commitToCurrentBranchText"> </span> </radio-group> <radio-group :value="$options.commitToNewBranch" diff --git a/app/assets/javascripts/ide/components/commit_sidebar/editor_header.vue b/app/assets/javascripts/ide/components/commit_sidebar/editor_header.vue index b0e60edcbe5..5119dbf32eb 100644 --- a/app/assets/javascripts/ide/components/commit_sidebar/editor_header.vue +++ b/app/assets/javascripts/ide/components/commit_sidebar/editor_header.vue @@ -42,18 +42,9 @@ export default { <template> <div class="d-flex ide-commit-editor-header align-items-center"> - <file-icon - :file-name="activeFile.name" - :size="16" - class="mr-2" - /> - <strong class="mr-2"> - {{ activeFile.path }} - </strong> - <changed-file-icon - :file="activeFile" - class="ml-0" - /> + <file-icon :file-name="activeFile.name" :size="16" class="mr-2" /> + <strong class="mr-2"> {{ activeFile.path }} </strong> + <changed-file-icon :file="activeFile" class="ml-0" /> <div class="ml-auto"> <button v-if="!isStaged" @@ -66,7 +57,7 @@ export default { <button :class="{ 'btn-success': !isStaged, - 'btn-warning': isStaged + 'btn-warning': isStaged, }" type="button" class="btn btn-inverted" diff --git a/app/assets/javascripts/ide/components/commit_sidebar/empty_state.vue b/app/assets/javascripts/ide/components/commit_sidebar/empty_state.vue index d0a60d647e5..a23bae8e4c7 100644 --- a/app/assets/javascripts/ide/components/commit_sidebar/empty_state.vue +++ b/app/assets/javascripts/ide/components/commit_sidebar/empty_state.vue @@ -13,22 +13,12 @@ export default { v-if="!lastCommitMsg" class="multi-file-commit-panel-section ide-commit-empty-state js-empty-state" > - <div - class="ide-commit-empty-state-container" - > - <div class="svg-content svg-80"> - <img :src="noChangesStateSvgPath" /> - </div> + <div class="ide-commit-empty-state-container"> + <div class="svg-content svg-80"><img :src="noChangesStateSvgPath" /></div> <div class="append-right-default prepend-left-default"> - <div - class="text-content text-center" - > - <h4> - {{ __('No changes') }} - </h4> - <p> - {{ __('Edit files in the editor and commit changes here') }} - </p> + <div class="text-content text-center"> + <h4>{{ __('No changes') }}</h4> + <p>{{ __('Edit files in the editor and commit changes here') }}</p> </div> </div> </div> diff --git a/app/assets/javascripts/ide/components/commit_sidebar/form.vue b/app/assets/javascripts/ide/components/commit_sidebar/form.vue index 802827fce76..e5cd2411541 100644 --- a/app/assets/javascripts/ide/components/commit_sidebar/form.vue +++ b/app/assets/javascripts/ide/components/commit_sidebar/form.vue @@ -96,7 +96,7 @@ export default { <div :class="{ 'is-compact': isCompact, - 'is-full': !isCompact + 'is-full': !isCompact, }" :style="{ height: componentHeight ? `${componentHeight}px` : null, @@ -109,11 +109,7 @@ export default { @enter="enterTransition" @after-enter="afterEndTransition" > - <div - v-if="isCompact" - ref="compactEl" - class="commit-form-compact" - > + <div v-if="isCompact" ref="compactEl" class="commit-form-compact"> <button :disabled="!hasChanges" type="button" @@ -122,21 +118,10 @@ export default { > {{ __('Commit…') }} </button> - <p - class="text-center" - v-html="overviewText" - ></p> + <p class="text-center" v-html="overviewText"></p> </div> - <form - v-if="!isCompact" - ref="formEl" - @submit.prevent.stop="commitChanges" - > - <transition name="fade"> - <success-message - v-show="lastCommitMsg" - /> - </transition> + <form v-if="!isCompact" ref="formEl" @submit.prevent.stop="commitChanges"> + <transition name="fade"> <success-message v-show="lastCommitMsg" /> </transition> <commit-message-field :text="commitMessage" :placeholder="preBuiltCommitMessage" diff --git a/app/assets/javascripts/ide/components/commit_sidebar/list.vue b/app/assets/javascripts/ide/components/commit_sidebar/list.vue index 3e3539e364b..a1094570275 100644 --- a/app/assets/javascripts/ide/components/commit_sidebar/list.vue +++ b/app/assets/javascripts/ide/components/commit_sidebar/list.vue @@ -93,24 +93,11 @@ export default { </script> <template> - <div - class="ide-commit-list-container" - > - <header - class="multi-file-commit-panel-header d-flex mb-0" - > - <div - class="d-flex align-items-center flex-fill" - > - <icon - v-once - :name="iconName" - :size="18" - class="append-right-8" - /> - <strong> - {{ titleText }} - </strong> + <div class="ide-commit-list-container"> + <header class="multi-file-commit-panel-header d-flex mb-0"> + <div class="d-flex align-items-center flex-fill"> + <icon v-once :name="iconName" :size="18" class="append-right-8" /> + <strong> {{ titleText }} </strong> <div class="d-flex ml-auto"> <button ref="actionBtn" @@ -119,7 +106,7 @@ export default { :aria-label="actionBtnText" :disabled="!filesLength" :class="{ - 'disabled-content': !filesLength + 'disabled-content': !filesLength, }" type="button" class="d-flex ide-staged-action-btn p-0 border-0 align-items-center" @@ -128,11 +115,7 @@ export default { data-boundary="viewport" @click="actionBtnClicked" > - <icon - :name="actionBtnIcon" - :size="16" - class="ml-auto mr-auto" - /> + <icon :name="actionBtnIcon" :size="16" class="ml-auto mr-auto" /> </button> <button v-if="!stagedList" @@ -141,7 +124,7 @@ export default { :aria-label="__('Discard all changes')" :disabled="!filesLength" :class="{ - 'disabled-content': !filesLength + 'disabled-content': !filesLength, }" type="button" class="d-flex ide-staged-action-btn p-0 border-0 align-items-center" @@ -150,23 +133,13 @@ export default { data-boundary="viewport" @click="openDiscardModal" > - <icon - :size="16" - name="remove-all" - class="ml-auto mr-auto" - /> + <icon :size="16" name="remove-all" class="ml-auto mr-auto" /> </button> </div> </div> </header> - <ul - v-if="filesLength" - class="multi-file-commit-list list-unstyled append-bottom-0" - > - <li - v-for="file in fileList" - :key="file.key" - > + <ul v-if="filesLength" class="multi-file-commit-list list-unstyled append-bottom-0"> + <li v-for="file in fileList" :key="file.key"> <list-item :file="file" :action-component="itemActionComponent" @@ -176,10 +149,7 @@ export default { /> </li> </ul> - <p - v-else - class="multi-file-commit-list form-text text-muted text-center" - > + <p v-else class="multi-file-commit-list form-text text-muted text-center"> {{ emptyStateText }} </p> <gl-modal diff --git a/app/assets/javascripts/ide/components/commit_sidebar/list_collapsed.vue b/app/assets/javascripts/ide/components/commit_sidebar/list_collapsed.vue index 699fa7dc937..3156a398113 100644 --- a/app/assets/javascripts/ide/components/commit_sidebar/list_collapsed.vue +++ b/app/assets/javascripts/ide/components/commit_sidebar/list_collapsed.vue @@ -69,9 +69,7 @@ export default { </script> <template> - <div - class="multi-file-commit-list-collapsed text-center" - > + <div class="multi-file-commit-list-collapsed text-center"> <div v-tooltip :title="titleTooltip" @@ -79,11 +77,7 @@ export default { data-placement="left" class="append-bottom-15" > - <icon - v-once - :name="iconName" - :size="18" - /> + <icon v-once :name="iconName" :size="18" /> </div> <div v-tooltip @@ -92,11 +86,7 @@ export default { data-placement="left" class="append-bottom-10" > - <icon - :name="additionIconName" - :size="18" - :css-classes="addedFilesIconClass" - /> + <icon :name="additionIconName" :size="18" :css-classes="addedFilesIconClass" /> </div> {{ addedFilesLength }} <div @@ -106,11 +96,7 @@ export default { data-placement="left" class="prepend-top-10 append-bottom-10" > - <icon - :name="modifiedIconName" - :size="18" - :css-classes="modifiedFilesClass" - /> + <icon :name="modifiedIconName" :size="18" :css-classes="modifiedFilesClass" /> </div> {{ modifiedFilesLength }} </div> diff --git a/app/assets/javascripts/ide/components/commit_sidebar/list_item.vue b/app/assets/javascripts/ide/components/commit_sidebar/list_item.vue index ee0e72cd05f..4be4b02ac1e 100644 --- a/app/assets/javascripts/ide/components/commit_sidebar/list_item.vue +++ b/app/assets/javascripts/ide/components/commit_sidebar/list_item.vue @@ -99,7 +99,7 @@ export default { v-tooltip :title="tooltipTitle" :class="{ - 'is-active': isActive + 'is-active': isActive, }" class="multi-file-commit-list-path w-100 border-0 ml-0 mr-0" role="button" @@ -107,18 +107,11 @@ export default { @click="openFileInEditor" > <span class="multi-file-commit-list-file-path d-flex align-items-center"> - <file-icon - :file-name="file.name" - class="append-right-8" - />{{ file.name }} + <file-icon :file-name="file.name" class="append-right-8" />{{ file.name }} </span> <div class="ml-auto d-flex align-items-center"> <div class="d-flex align-items-center ide-commit-list-changed-icon"> - <icon - :name="iconName" - :size="16" - :css-classes="iconClass" - /> + <icon :name="iconName" :size="16" :css-classes="iconClass" /> </div> </div> </div> diff --git a/app/assets/javascripts/ide/components/commit_sidebar/message_field.vue b/app/assets/javascripts/ide/components/commit_sidebar/message_field.vue index 37ca108fafc..3173e8a4f9f 100644 --- a/app/assets/javascripts/ide/components/commit_sidebar/message_field.vue +++ b/app/assets/javascripts/ide/components/commit_sidebar/message_field.vue @@ -71,24 +71,16 @@ export default { <fieldset class="common-note-form ide-commit-message-field"> <div :class="{ - 'is-focused': isFocused + 'is-focused': isFocused, }" class="md-area" > - <div - v-once - class="md-header" - > + <div v-once class="md-header"> <ul class="nav-links"> <li> {{ __('Commit Message') }} - <span - v-popover="$options.popoverOptions" - class="form-text text-muted prepend-left-10" - > - <icon - name="question" - /> + <span v-popover="$options.popoverOptions" class="form-text text-muted prepend-left-10"> + <icon name="question" /> </span> </li> </ul> @@ -97,22 +89,13 @@ export default { <div class="ide-commit-message-highlights-container"> <div :style="{ - transform: `translate3d(0, ${-scrollTop}px, 0)` + transform: `translate3d(0, ${-scrollTop}px, 0)`, }" class="note-textarea highlights monospace" > - <div - v-for="(line, index) in allLines" - :key="index" - > - <span - v-text="line.text" - > - </span><mark - v-show="line.highlightedText" - v-text="line.highlightedText" - > - </mark> + <div v-for="(line, index) in allLines" :key="index"> + <span v-text="line.text"> </span + ><mark v-show="line.highlightedText" v-text="line.highlightedText"> </mark> </div> </div> </div> @@ -124,8 +107,8 @@ export default { name="commit-message" @scroll="handleScroll" @input="onInput" - @focus="updateIsFocused(true)" - @blur="updateIsFocused(false)" + @focus="updateIsFocused(true);" + @blur="updateIsFocused(false);" > </textarea> </div> diff --git a/app/assets/javascripts/ide/components/commit_sidebar/radio_group.vue b/app/assets/javascripts/ide/components/commit_sidebar/radio_group.vue index 969e2aa61c4..3525084b1cb 100644 --- a/app/assets/javascripts/ide/components/commit_sidebar/radio_group.vue +++ b/app/assets/javascripts/ide/components/commit_sidebar/radio_group.vue @@ -56,7 +56,7 @@ export default { v-tooltip :title="tooltipTitle" :class="{ - 'is-disabled': disabled + 'is-disabled': disabled, }" > <input @@ -65,27 +65,18 @@ export default { :disabled="disabled" type="radio" name="commit-action" - @change="updateCommitAction($event.target.value)" + @change="updateCommitAction($event.target.value);" /> <span class="prepend-left-10"> - <span - v-if="label" - class="ide-radio-label" - > - {{ label }} - </span> - <slot v-else></slot> + <span v-if="label" class="ide-radio-label"> {{ label }} </span> <slot v-else></slot> </span> </label> - <div - v-if="commitAction === value && showInput" - class="ide-commit-new-branch" - > + <div v-if="commitAction === value && showInput" class="ide-commit-new-branch"> <input :placeholder="newBranchName" type="text" class="form-control monospace" - @input="updateBranchName($event.target.value)" + @input="updateBranchName($event.target.value);" /> </div> </fieldset> diff --git a/app/assets/javascripts/ide/components/commit_sidebar/stage_button.vue b/app/assets/javascripts/ide/components/commit_sidebar/stage_button.vue index adf4b479c97..02c2004d495 100644 --- a/app/assets/javascripts/ide/components/commit_sidebar/stage_button.vue +++ b/app/assets/javascripts/ide/components/commit_sidebar/stage_button.vue @@ -38,10 +38,7 @@ export default { </script> <template> - <div - v-once - class="multi-file-discard-btn d-flex" - > + <div v-once class="multi-file-discard-btn d-flex"> <button v-tooltip :aria-label="__('Stage changes')" @@ -51,13 +48,9 @@ export default { data-container="body" data-boundary="viewport" data-placement="bottom" - @click.stop.prevent="stageChange(path)" + @click.stop.prevent="stageChange(path);" > - <icon - :size="16" - name="mobile-issue-close" - class="ml-auto mr-auto" - /> + <icon :size="16" name="mobile-issue-close" class="ml-auto mr-auto" /> </button> <button v-tooltip @@ -70,18 +63,14 @@ export default { data-placement="bottom" @click.stop.prevent="showDiscardModal" > - <icon - :size="16" - name="remove" - class="ml-auto mr-auto" - /> + <icon :size="16" name="remove" class="ml-auto mr-auto" /> </button> <gl-modal :id="modalId" :header-title-text="modalTitle" :footer-primary-button-text="__('Discard changes')" footer-primary-button-variant="danger" - @submit="discardFileChanges(path)" + @submit="discardFileChanges(path);" > {{ __("You will loose all changes you've made to this file. This action cannot be undone.") }} </gl-modal> diff --git a/app/assets/javascripts/ide/components/commit_sidebar/success_message.vue b/app/assets/javascripts/ide/components/commit_sidebar/success_message.vue index a6df91b79c2..b1d5de8682d 100644 --- a/app/assets/javascripts/ide/components/commit_sidebar/success_message.vue +++ b/app/assets/javascripts/ide/components/commit_sidebar/success_message.vue @@ -9,23 +9,11 @@ export default { </script> <template> - <div - class="multi-file-commit-panel-success-message" - aria-live="assertive" - > - <div class="svg-content svg-80"> - <img - :src="committedStateSvgPath" - alt="" - /> - </div> + <div class="multi-file-commit-panel-success-message" aria-live="assertive"> + <div class="svg-content svg-80"><img :src="committedStateSvgPath" alt="" /></div> <div class="append-right-default prepend-left-default"> - <div - class="text-content text-center" - > - <h4> - {{ __('All changes are committed') }} - </h4> + <div class="text-content text-center"> + <h4>{{ __('All changes are committed') }}</h4> <p v-html="lastCommitMsg"></p> </div> </div> diff --git a/app/assets/javascripts/ide/components/commit_sidebar/unstage_button.vue b/app/assets/javascripts/ide/components/commit_sidebar/unstage_button.vue index 86c40602074..ce41fcdb087 100644 --- a/app/assets/javascripts/ide/components/commit_sidebar/unstage_button.vue +++ b/app/assets/javascripts/ide/components/commit_sidebar/unstage_button.vue @@ -23,10 +23,7 @@ export default { </script> <template> - <div - v-once - class="multi-file-discard-btn d-flex" - > + <div v-once class="multi-file-discard-btn d-flex"> <button v-tooltip :aria-label="__('Unstage changes')" @@ -36,13 +33,9 @@ export default { data-container="body" data-boundary="viewport" data-placement="bottom" - @click.stop.prevent="unstageChange(path)" + @click.stop.prevent="unstageChange(path);" > - <icon - :size="16" - name="redo" - class="ml-auto mr-auto" - /> + <icon :size="16" name="redo" class="ml-auto mr-auto" /> </button> </div> </template> diff --git a/app/assets/javascripts/ide/components/editor_mode_dropdown.vue b/app/assets/javascripts/ide/components/editor_mode_dropdown.vue index 95598c9aca6..5f99261ec39 100644 --- a/app/assets/javascripts/ide/components/editor_mode_dropdown.vue +++ b/app/assets/javascripts/ide/components/editor_mode_dropdown.vue @@ -30,16 +30,8 @@ export default { </script> <template> - <div - class="dropdown" - > - <button - type="button" - class="btn btn-link" - data-toggle="dropdown" - > - {{ __('Edit') }} - </button> + <div class="dropdown"> + <button type="button" class="btn btn-link" data-toggle="dropdown">{{ __('Edit') }}</button> <div class="dropdown-menu dropdown-menu-selectable dropdown-open-left"> <ul> <li> @@ -48,11 +40,9 @@ export default { 'is-active': viewer === $options.viewerTypes.mr, }" href="#" - @click.prevent="changeMode($options.viewerTypes.mr)" + @click.prevent="changeMode($options.viewerTypes.mr);" > - <strong class="dropdown-menu-inner-title"> - {{ mergeReviewLine }} - </strong> + <strong class="dropdown-menu-inner-title"> {{ mergeReviewLine }} </strong> <span class="dropdown-menu-inner-content"> {{ __('Compare changes with the merge request target branch') }} </span> @@ -64,7 +54,7 @@ export default { 'is-active': viewer === $options.viewerTypes.diff, }" href="#" - @click.prevent="changeMode($options.viewerTypes.diff)" + @click.prevent="changeMode($options.viewerTypes.diff);" > <strong class="dropdown-menu-inner-title">{{ __('Reviewing') }}</strong> <span class="dropdown-menu-inner-content"> diff --git a/app/assets/javascripts/ide/components/error_message.vue b/app/assets/javascripts/ide/components/error_message.vue index 11fc15871ac..22113692968 100644 --- a/app/assets/javascripts/ide/components/error_message.vue +++ b/app/assets/javascripts/ide/components/error_message.vue @@ -43,15 +43,9 @@ export default { </script> <template> - <div - class="flash-container flash-container-page" - @click="clickFlash" - > + <div class="flash-container flash-container-page" @click="clickFlash"> <div class="flash-alert"> - <span - v-html="message.text" - > - </span> + <span v-html="message.text"> </span> <button v-if="message.action" type="button" @@ -59,10 +53,7 @@ export default { @click.stop.prevent="clickAction" > {{ message.actionText }} - <gl-loading-icon - v-show="isLoading" - inline - /> + <gl-loading-icon v-show="isLoading" inline /> </button> </div> </div> diff --git a/app/assets/javascripts/ide/components/external_link.vue b/app/assets/javascripts/ide/components/external_link.vue index e24fe5bbccb..954f84cea17 100644 --- a/app/assets/javascripts/ide/components/external_link.vue +++ b/app/assets/javascripts/ide/components/external_link.vue @@ -20,10 +20,7 @@ export default { </script> <template> - <div - v-if="showButtons" - class="pull-right ide-btn-group" - > + <div v-if="showButtons" class="pull-right ide-btn-group"> <a :href="file.permalink" :title="s__('IDE|Open in file view')" @@ -31,11 +28,7 @@ export default { rel="noopener noreferrer" > <span class="vertical-align-middle">Open in file view</span> - <icon - :size="16" - name="external-link" - css-classes="vertical-align-middle space-right" - /> + <icon :size="16" name="external-link" css-classes="vertical-align-middle space-right" /> </a> </div> </template> diff --git a/app/assets/javascripts/ide/components/file_finder/index.vue b/app/assets/javascripts/ide/components/file_finder/index.vue index 760ed8654ee..bb391912572 100644 --- a/app/assets/javascripts/ide/components/file_finder/index.vue +++ b/app/assets/javascripts/ide/components/file_finder/index.vue @@ -164,13 +164,8 @@ export default { </script> <template> - <div - class="ide-file-finder-overlay" - @mousedown.self="toggleFileFinder(false)" - > - <div - class="dropdown-menu diff-file-changes ide-file-finder show" - > + <div class="ide-file-finder-overlay" @mousedown.self="toggleFileFinder(false);"> + <div class="dropdown-menu diff-file-changes ide-file-finder show"> <div class="dropdown-input"> <input ref="searchInput" @@ -179,12 +174,12 @@ export default { type="search" class="dropdown-input-field" autocomplete="off" - @keydown="onKeydown($event)" - @keyup="onKeyup($event)" + @keydown="onKeydown($event);" + @keyup="onKeyup($event);" /> <i :class="{ - hidden: showClearInputButton + hidden: showClearInputButton, }" aria-hidden="true" class="fa fa-search dropdown-input-search" @@ -192,7 +187,7 @@ export default { <i :aria-label="__('Clear search input')" :class="{ - show: showClearInputButton + show: showClearInputButton, }" role="button" class="fa fa-times dropdown-input-clear" @@ -200,17 +195,9 @@ export default { ></i> </div> <div> - <virtual-list - ref="virtualScrollList" - :size="listHeight" - :remain="listShowCount" - wtag="ul" - > + <virtual-list ref="virtualScrollList" :size="listHeight" :remain="listShowCount" wtag="ul"> <template v-if="filteredBlobsLength"> - <li - v-for="(file, index) in filteredBlobs" - :key="file.key" - > + <li v-for="(file, index) in filteredBlobs" :key="file.key"> <item :file="file" :search-text="searchText" @@ -223,10 +210,7 @@ export default { /> </li> </template> - <li - v-else - class="dropdown-menu-empty-item" - > + <li v-else class="dropdown-menu-empty-item"> <div class="append-right-default prepend-left-default prepend-top-8 append-bottom-8"> <template v-if="loading"> {{ __('Loading...') }} diff --git a/app/assets/javascripts/ide/components/file_finder/item.vue b/app/assets/javascripts/ide/components/file_finder/item.vue index 72ce37be63a..83e80d50aff 100644 --- a/app/assets/javascripts/ide/components/file_finder/item.vue +++ b/app/assets/javascripts/ide/components/file_finder/item.vue @@ -74,9 +74,7 @@ export default { css-classes="diff-file-changed-icon append-right-8" /> <span class="diff-changed-file-content append-right-8"> - <strong - class="diff-changed-file-name" - > + <strong class="diff-changed-file-name"> <span v-for="(char, charIndex) in file.name.split('')" :key="charIndex + char" @@ -87,9 +85,7 @@ export default { > </span> </strong> - <span - class="diff-changed-file-path prepend-top-5" - > + <span class="diff-changed-file-path prepend-top-5"> <span v-for="(char, charIndex) in pathWithEllipsis.split('')" :key="charIndex + char" @@ -101,13 +97,8 @@ export default { </span> </span> </span> - <span - v-if="file.changed || file.tempFile" - class="diff-changed-stats" - > - <changed-file-icon - :file="file" - /> + <span v-if="file.changed || file.tempFile" class="diff-changed-stats"> + <changed-file-icon :file="file" /> </span> </button> </template> diff --git a/app/assets/javascripts/ide/components/file_row_extra.vue b/app/assets/javascripts/ide/components/file_row_extra.vue index 2ad14b88410..d6673cf0421 100644 --- a/app/assets/javascripts/ide/components/file_row_extra.vue +++ b/app/assets/javascripts/ide/components/file_row_extra.vue @@ -69,13 +69,8 @@ export default { <template> <div class="float-right ide-file-icon-holder"> - <mr-file-icon - v-if="file.mrChange" - /> - <span - v-if="showTreeChangesCount" - class="ide-tree-changes" - > + <mr-file-icon v-if="file.mrChange" /> + <span v-if="showTreeChangesCount" class="ide-tree-changes"> {{ changesCount }} <icon v-tooltip diff --git a/app/assets/javascripts/ide/components/file_templates/bar.vue b/app/assets/javascripts/ide/components/file_templates/bar.vue index 3587626c580..d459e3b43d3 100644 --- a/app/assets/javascripts/ide/components/file_templates/bar.vue +++ b/app/assets/javascripts/ide/components/file_templates/bar.vue @@ -48,9 +48,7 @@ export default { <template> <div class="d-flex align-items-center ide-file-templates qa-file-templates-bar"> - <strong class="append-right-default"> - {{ __('File templates') }} - </strong> + <strong class="append-right-default"> {{ __('File templates') }} </strong> <dropdown :data="templateTypes" :label="selectedTemplateType.name || __('Choose a type...')" @@ -67,12 +65,7 @@ export default { @click="selectTemplate" /> <transition name="fade"> - <button - v-show="updateSuccess" - type="button" - class="btn btn-default" - @click="undo" - > + <button v-show="updateSuccess" type="button" class="btn btn-default" @click="undo"> {{ __('Undo') }} </button> </transition> diff --git a/app/assets/javascripts/ide/components/file_templates/dropdown.vue b/app/assets/javascripts/ide/components/file_templates/dropdown.vue index 81d8d0b5132..414ea9c7d4d 100644 --- a/app/assets/javascripts/ide/components/file_templates/dropdown.vue +++ b/app/assets/javascripts/ide/components/file_templates/dropdown.vue @@ -75,48 +75,23 @@ export default { <template> <div class="dropdown"> - <dropdown-button - :toggle-text="label" - data-display="static" - /> + <dropdown-button :toggle-text="label" data-display="static" /> <div class="dropdown-menu pb-0"> - <div - v-if="title" - class="dropdown-title ml-0 mr-0" - > - {{ title }} - </div> - <div - v-if="!showLoading && searchable" - class="dropdown-input" - > + <div v-if="title" class="dropdown-title ml-0 mr-0">{{ title }}</div> + <div v-if="!showLoading && searchable" class="dropdown-input"> <input v-model="search" :placeholder="__('Filter...')" type="search" class="dropdown-input-field qa-dropdown-filter-input" /> - <i - aria-hidden="true" - class="fa fa-search dropdown-input-search" - ></i> + <i aria-hidden="true" class="fa fa-search dropdown-input-search"></i> </div> <div class="dropdown-content"> - <gl-loading-icon - v-if="showLoading" - :size="2" - /> + <gl-loading-icon v-if="showLoading" :size="2" /> <ul v-else> - <li - v-for="(item, index) in outputData" - :key="index" - > - <button - type="button" - @click="clickItem(item)" - > - {{ item.name }} - </button> + <li v-for="(item, index) in outputData" :key="index"> + <button type="button" @click="clickItem(item);">{{ item.name }}</button> </li> </ul> </div> diff --git a/app/assets/javascripts/ide/components/ide.vue b/app/assets/javascripts/ide/components/ide.vue index 0a368f6558c..caec8779cac 100644 --- a/app/assets/javascripts/ide/components/ide.vue +++ b/app/assets/javascripts/ide/components/ide.vue @@ -88,27 +88,13 @@ export default { <template> <article class="ide position-relative d-flex flex-column align-items-stretch"> - <error-message - v-if="errorMessage" - :message="errorMessage" - /> - <div - class="ide-view flex-grow d-flex" - > - <find-file - v-show="fileFindVisible" - /> + <error-message v-if="errorMessage" :message="errorMessage" /> + <div class="ide-view flex-grow d-flex"> + <find-file v-show="fileFindVisible" /> <ide-sidebar /> - <div - class="multi-file-edit-pane" - > - <template - v-if="activeFile" - > - <commit-editor-header - v-if="isCommitModeActive" - :active-file="activeFile" - /> + <div class="multi-file-edit-pane"> + <template v-if="activeFile"> + <commit-editor-header v-if="isCommitModeActive" :active-file="activeFile" /> <repo-tabs v-else :active-file="activeFile" @@ -117,32 +103,20 @@ export default { :has-changes="hasChanges" :merge-request-id="currentMergeRequestId" /> - <repo-editor - :file="activeFile" - class="multi-file-edit-pane-content" - /> + <repo-editor :file="activeFile" class="multi-file-edit-pane-content" /> </template> - <template - v-else - > - <div - v-once - class="ide-empty-state" - > + <template v-else> + <div v-once class="ide-empty-state"> <div class="row js-empty-state"> <div class="col-12"> - <div class="svg-content svg-250"> - <img :src="emptyStateSvgPath" /> - </div> + <div class="svg-content svg-250"><img :src="emptyStateSvgPath" /></div> </div> <div class="col-12"> <div class="text-content text-center"> - <h4> - Welcome to the GitLab IDE - </h4> + <h4>Welcome to the GitLab IDE</h4> <p> - Select a file from the left sidebar to begin editing. - Afterwards, you'll be able to commit your changes. + Select a file from the left sidebar to begin editing. Afterwards, you'll be able + to commit your changes. </p> </div> </div> @@ -150,12 +124,9 @@ export default { </div> </template> </div> - <component - :is="rightPaneComponent" - v-if="currentProjectId" - /> + <component :is="rightPaneComponent" v-if="currentProjectId" /> </div> - <ide-status-bar :file="activeFile"/> + <ide-status-bar :file="activeFile" /> <new-modal /> </article> </template> diff --git a/app/assets/javascripts/ide/components/ide_project_header.vue b/app/assets/javascripts/ide/components/ide_project_header.vue index 6cf190288e8..36bc7c70196 100644 --- a/app/assets/javascripts/ide/components/ide_project_header.vue +++ b/app/assets/javascripts/ide/components/ide_project_header.vue @@ -16,18 +16,10 @@ export default { <template> <div class="context-header ide-context-header"> - <a - :href="project.web_url" - :title="s__('IDE|Go to project')" - > - <project-avatar-default - :project="project" - :size="48" - /> + <a :href="project.web_url" :title="s__('IDE|Go to project')"> + <project-avatar-default :project="project" :size="48" /> <span class="ide-sidebar-project-title"> - <span class="sidebar-context-title"> - {{ project.name }} - </span> + <span class="sidebar-context-title"> {{ project.name }} </span> <span class="sidebar-context-title text-secondary"> {{ project.path_with_namespace }} </span> diff --git a/app/assets/javascripts/ide/components/ide_review.vue b/app/assets/javascripts/ide/components/ide_review.vue index d09c99050fe..901b8892e80 100644 --- a/app/assets/javascripts/ide/components/ide_review.vue +++ b/app/assets/javascripts/ide/components/ide_review.vue @@ -42,13 +42,8 @@ export default { </script> <template> - <ide-tree-list - :viewer-type="viewer" - header-class="ide-review-header" - > - <template - slot="header" - > + <ide-tree-list :viewer-type="viewer" header-class="ide-review-header"> + <template slot="header"> <div class="ide-review-button-holder"> {{ __('Review') }} <editor-mode-dropdown @@ -63,12 +58,12 @@ export default { {{ __('Latest changes') }} </template> <template v-else-if="showMergeRequestText"> - {{ __('Merge request') }} - (<a + {{ __('Merge request') }} (<a v-if="currentMergeRequest" :href="currentMergeRequest.web_url" v-text="mergeRequestId" - ></a>) + ></a + >) </template> </div> </template> diff --git a/app/assets/javascripts/ide/components/ide_side_bar.vue b/app/assets/javascripts/ide/components/ide_side_bar.vue index 6b4849eb6f9..6178d2b1fc7 100644 --- a/app/assets/javascripts/ide/components/ide_side_bar.vue +++ b/app/assets/javascripts/ide/components/ide_side_bar.vue @@ -37,34 +37,21 @@ export default { </script> <template> - <resizable-panel - :collapsible="false" - :initial-width="340" - side="left" - class="flex-column" - > + <resizable-panel :collapsible="false" :initial-width="340" side="left" class="flex-column"> <template v-if="loading"> <div class="multi-file-commit-panel-inner"> - <div - v-for="n in 3" - :key="n" - class="multi-file-loading-container" - > + <div v-for="n in 3" :key="n" class="multi-file-loading-container"> <gl-skeleton-loading /> </div> </div> </template> <template v-else> - <ide-project-header - :project="currentProject" - /> + <ide-project-header :project="currentProject" /> <div class="ide-context-body d-flex flex-fill"> <activity-bar /> <div class="multi-file-commit-panel-inner"> <div class="multi-file-commit-panel-inner-content"> - <component - :is="currentActivityView" - /> + <component :is="currentActivityView" /> </div> <commit-form /> </div> diff --git a/app/assets/javascripts/ide/components/ide_status_bar.vue b/app/assets/javascripts/ide/components/ide_status_bar.vue index a04d09ef374..e2e0acc22b1 100644 --- a/app/assets/javascripts/ide/components/ide_status_bar.vue +++ b/app/assets/javascripts/ide/components/ide_status_bar.vue @@ -79,18 +79,12 @@ export default { <template> <footer class="ide-status-bar"> - <div - v-if="lastCommit" - class="ide-status-branch" - > - <span - v-if="latestPipeline && latestPipeline.details" - class="ide-status-pipeline" - > + <div v-if="lastCommit" class="ide-status-branch"> + <span v-if="latestPipeline && latestPipeline.details" class="ide-status-pipeline"> <button type="button" class="p-0 border-0 h-50" - @click="openRightPane($options.rightSidebarViews.pipelines)" + @click="openRightPane($options.rightSidebarViews.pipelines);" > <ci-icon v-tooltip @@ -99,24 +93,21 @@ export default { /> </button> Pipeline - <a - :href="latestPipeline.details.status.details_path" - class="monospace">#{{ latestPipeline.id }}</a> - {{ latestPipeline.details.status.text }} - for + <a :href="latestPipeline.details.status.details_path" class="monospace" + >#{{ latestPipeline.id }}</a + > + {{ latestPipeline.details.status.text }} for </span> - <icon - name="commit" - /> + <icon name="commit" /> <a v-tooltip :title="lastCommit.message" :href="getCommitPath(lastCommit.short_id)" class="commit-sha" - >{{ lastCommit.short_id }}</a> - by - {{ lastCommit.author_name }} + >{{ lastCommit.short_id }}</a + > + by {{ lastCommit.author_name }} <time v-tooltip :datetime="lastCommit.committed_date" @@ -127,28 +118,11 @@ export default { {{ lastCommitFormatedAge }} </time> </div> - <div - v-if="file" - class="ide-status-file" - > - {{ file.name }} - </div> - <div - v-if="file" - class="ide-status-file" - > - {{ file.eol }} - </div> - <div - v-if="file && !file.binary" - class="ide-status-file"> + <div v-if="file" class="ide-status-file">{{ file.name }}</div> + <div v-if="file" class="ide-status-file">{{ file.eol }}</div> + <div v-if="file && !file.binary" class="ide-status-file"> {{ file.editorRow }}:{{ file.editorColumn }} </div> - <div - v-if="file" - class="ide-status-file" - > - {{ file.fileLanguage }} - </div> + <div v-if="file" class="ide-status-file">{{ file.fileLanguage }}</div> </footer> </template> diff --git a/app/assets/javascripts/ide/components/ide_tree.vue b/app/assets/javascripts/ide/components/ide_tree.vue index 9f9e638f1aa..9fc21adae7c 100644 --- a/app/assets/javascripts/ide/components/ide_tree.vue +++ b/app/assets/javascripts/ide/components/ide_tree.vue @@ -34,12 +34,8 @@ export default { </script> <template> - <ide-tree-list - viewer-type="editor" - > - <template - slot="header" - > + <ide-tree-list viewer-type="editor"> + <template slot="header"> {{ __('Edit') }} <div class="ide-tree-actions ml-auto d-flex"> <new-entry-button @@ -47,7 +43,7 @@ export default { :show-label="false" class="d-flex border-0 p-0 mr-3 qa-new-file" icon="doc-new" - @click="openNewEntryModal({ type: 'blob' })" + @click="openNewEntryModal({ type: 'blob' });" /> <upload :show-label="false" @@ -60,7 +56,7 @@ export default { :show-label="false" class="d-flex border-0 p-0" icon="folder-new" - @click="openNewEntryModal({ type: 'tree' })" + @click="openNewEntryModal({ type: 'tree' });" /> </div> </template> diff --git a/app/assets/javascripts/ide/components/ide_tree_list.vue b/app/assets/javascripts/ide/components/ide_tree_list.vue index 12ed7f86b3d..81374f26645 100644 --- a/app/assets/javascripts/ide/components/ide_tree_list.vue +++ b/app/assets/javascripts/ide/components/ide_tree_list.vue @@ -42,29 +42,18 @@ export default { </script> <template> - <div - class="ide-file-list qa-file-list" - > + <div class="ide-file-list qa-file-list"> <template v-if="showLoading"> - <div - v-for="n in 3" - :key="n" - class="multi-file-loading-container" - > + <div v-for="n in 3" :key="n" class="multi-file-loading-container"> <gl-skeleton-loading /> </div> </template> <template v-else> - <header - :class="headerClass" - class="ide-tree-header" - > + <header :class="headerClass" class="ide-tree-header"> <nav-dropdown /> <slot name="header"></slot> </header> - <div - class="ide-tree-body h-100" - > + <div class="ide-tree-body h-100"> <file-row v-for="file in currentTree.tree" :key="file.key" diff --git a/app/assets/javascripts/ide/components/jobs/detail.vue b/app/assets/javascripts/ide/components/jobs/detail.vue index f884c26ed6a..e8fe5fc696d 100644 --- a/app/assets/javascripts/ide/components/jobs/detail.vue +++ b/app/assets/javascripts/ide/components/jobs/detail.vue @@ -75,20 +75,12 @@ export default { <template> <div class="ide-pipeline build-page d-flex flex-column flex-fill"> <header class="ide-job-header d-flex align-items-center"> - <button - class="btn btn-default btn-sm d-flex" - @click="setDetailJob(null)" - > - <icon - name="chevron-left" - /> - {{ __('View jobs') }} + <button class="btn btn-default btn-sm d-flex" @click="setDetailJob(null);"> + <icon name="chevron-left" /> {{ __('View jobs') }} </button> </header> <div class="top-bar d-flex border-left-0"> - <job-description - :job="detailJob" - /> + <job-description :job="detailJob" /> <div class="controllers ml-auto"> <a v-tooltip @@ -99,28 +91,13 @@ export default { class="controllers-buttons" target="_blank" > - <i - aria-hidden="true" - class="fa fa-file-text-o" - ></i> + <i aria-hidden="true" class="fa fa-file-text-o"></i> </a> - <scroll-button - :disabled="isScrolledToTop" - direction="up" - @click="scrollUp" - /> - <scroll-button - :disabled="isScrolledToBottom" - direction="down" - @click="scrollDown" - /> + <scroll-button :disabled="isScrolledToTop" direction="up" @click="scrollUp" /> + <scroll-button :disabled="isScrolledToBottom" direction="down" @click="scrollDown" /> </div> </div> - <pre - ref="buildTrace" - class="build-trace mb-0 h-100" - @scroll="scrollBuildLog" - > + <pre ref="buildTrace" class="build-trace mb-0 h-100" @scroll="scrollBuildLog"> <code v-show="!detailJob.isLoading" class="bash" diff --git a/app/assets/javascripts/ide/components/jobs/detail/description.vue b/app/assets/javascripts/ide/components/jobs/detail/description.vue index 7e24974f7e5..7280fba9e7a 100644 --- a/app/assets/javascripts/ide/components/jobs/detail/description.vue +++ b/app/assets/javascripts/ide/components/jobs/detail/description.vue @@ -23,24 +23,11 @@ export default { <template> <div class="d-flex align-items-center"> - <ci-icon - :status="job.status" - :borderless="true" - :size="24" - class="d-flex" - /> + <ci-icon :status="job.status" :borderless="true" :size="24" class="d-flex" /> <span class="prepend-left-8"> {{ job.name }} - <a - :href="job.path" - target="_blank" - class="ide-external-link" - > - {{ jobId }} - <icon - :size="12" - name="external-link" - /> + <a :href="job.path" target="_blank" class="ide-external-link"> + {{ jobId }} <icon :size="12" name="external-link" /> </a> </span> </div> diff --git a/app/assets/javascripts/ide/components/jobs/detail/scroll_button.vue b/app/assets/javascripts/ide/components/jobs/detail/scroll_button.vue index 103a407987f..5674d3ffa80 100644 --- a/app/assets/javascripts/ide/components/jobs/detail/scroll_button.vue +++ b/app/assets/javascripts/ide/components/jobs/detail/scroll_button.vue @@ -58,9 +58,7 @@ export default { type="button" @click="clickedScroll" > - <icon - :name="iconName" - /> + <icon :name="iconName" /> </button> </div> </template> diff --git a/app/assets/javascripts/ide/components/jobs/item.vue b/app/assets/javascripts/ide/components/jobs/item.vue index 7f4695a0451..be8bf77bba0 100644 --- a/app/assets/javascripts/ide/components/jobs/item.vue +++ b/app/assets/javascripts/ide/components/jobs/item.vue @@ -26,17 +26,9 @@ export default { <template> <div class="ide-job-item"> - <job-description - :job="job" - class="append-right-default" - /> + <job-description :job="job" class="append-right-default" /> <div class="ml-auto align-self-center"> - <button - v-if="job.started" - type="button" - class="btn btn-default btn-sm" - @click="clickViewLog" - > + <button v-if="job.started" type="button" class="btn btn-default btn-sm" @click="clickViewLog"> {{ __('View log') }} </button> </div> diff --git a/app/assets/javascripts/ide/components/jobs/list.vue b/app/assets/javascripts/ide/components/jobs/list.vue index e3626f60899..2cb5050c3f0 100644 --- a/app/assets/javascripts/ide/components/jobs/list.vue +++ b/app/assets/javascripts/ide/components/jobs/list.vue @@ -26,11 +26,7 @@ export default { <template> <div> - <gl-loading-icon - v-if="loading && !stages.length" - :size="2" - class="prepend-top-default" - /> + <gl-loading-icon v-if="loading && !stages.length" :size="2" class="prepend-top-default" /> <template v-else> <stage v-for="stage in stages" diff --git a/app/assets/javascripts/ide/components/jobs/stage.vue b/app/assets/javascripts/ide/components/jobs/stage.vue index e4fc78afaf2..b1be25ea602 100644 --- a/app/assets/javascripts/ide/components/jobs/stage.vue +++ b/app/assets/javascripts/ide/components/jobs/stage.vue @@ -56,20 +56,15 @@ export default { </script> <template> - <div - class="ide-stage card prepend-top-default" - > + <div class="ide-stage card prepend-top-default"> <div :class="{ - 'border-bottom-0': stage.isCollapsed + 'border-bottom-0': stage.isCollapsed, }" class="card-header" @click="toggleCollapsed" > - <ci-icon - :status="stage.status" - :size="24" - /> + <ci-icon :status="stage.status" :size="24" /> <strong ref="stageTitle" v-tooltip="showTooltip" @@ -79,33 +74,15 @@ export default { > {{ stage.name }} </strong> - <div - v-if="!stage.isLoading || stage.jobs.length" - class="append-right-8 prepend-left-4" - > - <span class="badge badge-pill"> - {{ jobsCount }} - </span> + <div v-if="!stage.isLoading || stage.jobs.length" class="append-right-8 prepend-left-4"> + <span class="badge badge-pill"> {{ jobsCount }} </span> </div> - <icon - :name="collapseIcon" - css-classes="ide-stage-collapse-icon" - /> + <icon :name="collapseIcon" css-classes="ide-stage-collapse-icon" /> </div> - <div - v-show="!stage.isCollapsed" - class="card-body" - > - <gl-loading-icon - v-if="showLoadingIcon" - /> + <div v-show="!stage.isCollapsed" class="card-body"> + <gl-loading-icon v-if="showLoadingIcon" /> <template v-else> - <item - v-for="job in stage.jobs" - :key="job.id" - :job="job" - @clickViewLog="clickViewLog" - /> + <item v-for="job in stage.jobs" :key="job.id" :job="job" @clickViewLog="clickViewLog" /> </template> </div> </div> diff --git a/app/assets/javascripts/ide/components/merge_requests/info.vue b/app/assets/javascripts/ide/components/merge_requests/info.vue index 199d2e74971..73ec992466c 100644 --- a/app/assets/javascripts/ide/components/merge_requests/info.vue +++ b/app/assets/javascripts/ide/components/merge_requests/info.vue @@ -19,13 +19,8 @@ export default { <template> <div class="ide-merge-request-info h-100 d-flex flex-column"> <div class="detail-page-header"> - <icon - name="git-merge" - class="align-self-center append-right-8" - /> - <strong> - !{{ currentMergeRequest.iid }} - </strong> + <icon name="git-merge" class="align-self-center append-right-8" /> + <strong> !{{ currentMergeRequest.iid }} </strong> </div> <div class="issuable-details"> <title-component diff --git a/app/assets/javascripts/ide/components/merge_requests/item.vue b/app/assets/javascripts/ide/components/merge_requests/item.vue index 0c4ea80ba08..60889c893cf 100644 --- a/app/assets/javascripts/ide/components/merge_requests/item.vue +++ b/app/assets/javascripts/ide/components/merge_requests/item.vue @@ -40,24 +40,13 @@ export default { </script> <template> - <a - :href="mergeRequestHref" - class="btn-link d-flex align-items-center" - > + <a :href="mergeRequestHref" class="btn-link d-flex align-items-center"> <span class="d-flex append-right-default ide-search-list-current-icon"> - <icon - v-if="isActive" - :size="18" - name="mobile-issue-close" - /> + <icon v-if="isActive" :size="18" name="mobile-issue-close" /> </span> <span> - <strong> - {{ item.title }} - </strong> - <span class="ide-merge-request-project-path d-block mt-1"> - {{ pathWithID }} - </span> + <strong> {{ item.title }} </strong> + <span class="ide-merge-request-project-path d-block mt-1"> {{ pathWithID }} </span> </span> </a> </template> diff --git a/app/assets/javascripts/ide/components/merge_requests/list.vue b/app/assets/javascripts/ide/components/merge_requests/list.vue index 4df29590b85..ac2b0eddfb4 100644 --- a/app/assets/javascripts/ide/components/merge_requests/list.vue +++ b/app/assets/javascripts/ide/components/merge_requests/list.vue @@ -84,13 +84,9 @@ export default { :placeholder="__('Search merge requests')" @focus="onSearchFocus" @input="searchMergeRequests" - @removeToken="setSearchType(null)" - /> - <icon - :size="18" - name="search" - class="input-icon" + @removeToken="setSearchType(null);" /> + <icon :size="18" name="search" class="input-icon" /> </div> </div> <div class="dropdown-content ide-merge-requests-dropdown-content d-flex"> @@ -100,36 +96,23 @@ export default { class="mt-3 mb-3 align-self-center ml-auto mr-auto" /> <template v-else> - <ul - class="mb-3 w-100" - > + <ul class="mb-3 w-100"> <template v-if="showSearchTypes"> - <li - v-for="searchType in $options.searchTypes" - :key="searchType.type" - > + <li v-for="searchType in $options.searchTypes" :key="searchType.type"> <button type="button" class="btn-link d-flex align-items-center" - @click.stop="setSearchType(searchType)" + @click.stop="setSearchType(searchType);" > <span class="d-flex append-right-default ide-search-list-current-icon"> - <icon - :size="18" - name="search" - /> - </span> - <span> - {{ searchType.label }} + <icon :size="18" name="search" /> </span> + <span> {{ searchType.label }} </span> </button> </li> </template> <template v-else-if="hasMergeRequests"> - <li - v-for="item in mergeRequests" - :key="item.id" - > + <li v-for="item in mergeRequests" :key="item.id"> <item :item="item" :current-id="currentMergeRequestId" @@ -137,10 +120,7 @@ export default { /> </li> </template> - <li - v-else - class="ide-search-list-empty d-flex align-items-center justify-content-center" - > + <li v-else class="ide-search-list-empty d-flex align-items-center justify-content-center"> {{ __('No merge requests found') }} </li> </ul> diff --git a/app/assets/javascripts/ide/components/nav_dropdown.vue b/app/assets/javascripts/ide/components/nav_dropdown.vue index db36779c395..e45d2a62dae 100644 --- a/app/assets/javascripts/ide/components/nav_dropdown.vue +++ b/app/assets/javascripts/ide/components/nav_dropdown.vue @@ -43,17 +43,8 @@ export default { </script> <template> - <div - ref="dropdown" - class="btn-group ide-nav-dropdown dropdown" - > + <div ref="dropdown" class="btn-group ide-nav-dropdown dropdown"> <nav-dropdown-button /> - <div - class="dropdown-menu dropdown-menu-left p-0" - > - <nav-form - v-if="isVisibleDropdown" - /> - </div> + <div class="dropdown-menu dropdown-menu-left p-0"><nav-form v-if="isVisibleDropdown" /></div> </div> </template> diff --git a/app/assets/javascripts/ide/components/nav_dropdown_button.vue b/app/assets/javascripts/ide/components/nav_dropdown_button.vue index 6cee4e9a8f0..f1d44443125 100644 --- a/app/assets/javascripts/ide/components/nav_dropdown_button.vue +++ b/app/assets/javascripts/ide/components/nav_dropdown_button.vue @@ -24,27 +24,12 @@ export default { <template> <dropdown-button> - <span - class="row" - > - <span - class="col-7 text-truncate" - > - <icon - :size="16" - :aria-label="__('Current Branch')" - name="branch" - /> - {{ branchLabel }} + <span class="row"> + <span class="col-7 text-truncate"> + <icon :size="16" :aria-label="__('Current Branch')" name="branch" /> {{ branchLabel }} </span> - <span - class="col-5 pl-0 text-truncate" - > - <icon - :size="16" - :aria-label="__('Merge Request')" - name="merge-request" - /> + <span class="col-5 pl-0 text-truncate"> + <icon :size="16" :aria-label="__('Merge Request')" name="merge-request" /> {{ mergeRequestLabel }} </span> </span> diff --git a/app/assets/javascripts/ide/components/nav_form.vue b/app/assets/javascripts/ide/components/nav_form.vue index 718b836e11c..23c068f329d 100644 --- a/app/assets/javascripts/ide/components/nav_form.vue +++ b/app/assets/javascripts/ide/components/nav_form.vue @@ -15,15 +15,9 @@ export default { </script> <template> - <div - class="ide-nav-form p-0" - > - <tabs - stop-propagation - > - <tab - active - > + <div class="ide-nav-form p-0"> + <tabs stop-propagation> + <tab active> <template slot="title"> {{ __('Merge Requests') }} </template> diff --git a/app/assets/javascripts/ide/components/new_dropdown/button.vue b/app/assets/javascripts/ide/components/new_dropdown/button.vue index aa5fce59dbf..062a64a19d7 100644 --- a/app/assets/javascripts/ide/components/new_dropdown/button.vue +++ b/app/assets/javascripts/ide/components/new_dropdown/button.vue @@ -52,10 +52,7 @@ export default { class="btn-blank" @click.stop.prevent="clicked" > - <icon - :name="icon" - :css-classes="iconClasses" - /> + <icon :name="icon" :css-classes="iconClasses" /> <template v-if="showLabel"> {{ label }} </template> diff --git a/app/assets/javascripts/ide/components/new_dropdown/index.vue b/app/assets/javascripts/ide/components/new_dropdown/index.vue index f02fd6cf7ea..a50d729036f 100644 --- a/app/assets/javascripts/ide/components/new_dropdown/index.vue +++ b/app/assets/javascripts/ide/components/new_dropdown/index.vue @@ -73,19 +73,11 @@ export default { :aria-label="__('Create new file or directory')" type="button" class="rounded border-0 d-flex ide-entry-dropdown-toggle" - @click.stop="openDropdown()" + @click.stop="openDropdown();" > - <icon - name="ellipsis_v" - /> - <icon - name="arrow-down" - /> + <icon name="ellipsis_v" /> <icon name="arrow-down" /> </button> - <ul - ref="dropdownMenu" - class="dropdown-menu dropdown-menu-right" - > + <ul ref="dropdownMenu" class="dropdown-menu dropdown-menu-right"> <template v-if="type === 'tree'"> <li> <item-button @@ -93,22 +85,17 @@ export default { class="d-flex" icon="doc-new" icon-classes="mr-2" - @click="createNewItem('blob')" - /> - </li> - <li> - <upload - :path="path" - @create="createTempEntry" + @click="createNewItem('blob');" /> </li> + <li><upload :path="path" @create="createTempEntry" /></li> <li> <item-button :label="__('New directory')" class="d-flex" icon="folder-new" icon-classes="mr-2" - @click="createNewItem($options.modalTypes.tree)" + @click="createNewItem($options.modalTypes.tree);" /> </li> <li class="divider"></li> @@ -119,7 +106,7 @@ export default { class="d-flex" icon="pencil" icon-classes="mr-2" - @click="createNewItem($options.modalTypes.rename)" + @click="createNewItem($options.modalTypes.rename);" /> </li> <li> @@ -128,7 +115,7 @@ export default { class="d-flex" icon="remove" icon-classes="mr-2" - @click="deleteEntry(path)" + @click="deleteEntry(path);" /> </li> </ul> diff --git a/app/assets/javascripts/ide/components/new_dropdown/modal.vue b/app/assets/javascripts/ide/components/new_dropdown/modal.vue index f0a04011a3e..63cbf41b89b 100644 --- a/app/assets/javascripts/ide/components/new_dropdown/modal.vue +++ b/app/assets/javascripts/ide/components/new_dropdown/modal.vue @@ -99,12 +99,8 @@ export default { @open="focusInput" @closed="closedModal" > - <div - class="form-group row" - > - <label class="label-bold col-form-label col-sm-2"> - {{ __('Name') }} - </label> + <div class="form-group row"> + <label class="label-bold col-form-label col-sm-2"> {{ __('Name') }} </label> <div class="col-sm-10"> <input ref="fieldName" @@ -113,19 +109,12 @@ export default { class="form-control qa-full-file-path" placeholder="/dir/file_name" /> - <ul - v-if="isCreatingNew" - class="prepend-top-default list-inline qa-template-list" - > - <li - v-for="(template, index) in templateTypes" - :key="index" - class="list-inline-item" - > + <ul v-if="isCreatingNew" class="prepend-top-default list-inline qa-template-list"> + <li v-for="(template, index) in templateTypes" :key="index" class="list-inline-item"> <button type="button" class="btn btn-missing p-1 pr-2 pl-2" - @click="createFromTemplate(template)" + @click="createFromTemplate(template);" > {{ template.name }} </button> diff --git a/app/assets/javascripts/ide/components/panes/right.vue b/app/assets/javascripts/ide/components/panes/right.vue index 10aa96dffaf..e318367a5ec 100644 --- a/app/assets/javascripts/ide/components/panes/right.vue +++ b/app/assets/javascripts/ide/components/panes/right.vue @@ -89,9 +89,7 @@ export default { </script> <template> - <div - class="multi-file-commit-panel ide-right-sidebar" - > + <div class="multi-file-commit-panel ide-right-sidebar"> <resizable-panel v-show="isOpen" :collapsible="false" @@ -112,27 +110,21 @@ export default { </resizable-panel> <nav class="ide-activity-bar"> <ul class="list-unstyled"> - <li - v-for="tab of tabs" - :key="tab.title" - > + <li v-for="tab of tabs" :key="tab.title"> <button v-tooltip :title="tab.title" :aria-label="tab.title" :class="{ - active: isActiveTab(tab) && isOpen + active: isActiveTab(tab) && isOpen, }" data-container="body" data-placement="left" class="ide-sidebar-link is-right" type="button" - @click="clickTab($event, tab)" + @click="clickTab($event, tab);" > - <icon - :size="16" - :name="tab.icon" - /> + <icon :size="16" :name="tab.icon" /> </button> </li> </ul> diff --git a/app/assets/javascripts/ide/components/pipelines/list.vue b/app/assets/javascripts/ide/components/pipelines/list.vue index 36cfcac4186..451c8030e16 100644 --- a/app/assets/javascripts/ide/components/pipelines/list.vue +++ b/app/assets/javascripts/ide/components/pipelines/list.vue @@ -50,34 +50,14 @@ export default { <template> <div class="ide-pipeline"> - <gl-loading-icon - v-if="showLoadingIcon" - :size="2" - class="prepend-top-default" - /> + <gl-loading-icon v-if="showLoadingIcon" :size="2" class="prepend-top-default" /> <template v-else-if="latestPipeline !== null"> - <header - v-if="latestPipeline" - class="ide-tree-header ide-pipeline-header" - > - <ci-icon - :status="latestPipeline.details.status" - :size="24" - /> + <header v-if="latestPipeline" class="ide-tree-header ide-pipeline-header"> + <ci-icon :status="latestPipeline.details.status" :size="24" /> <span class="prepend-left-8"> - <strong> - {{ __('Pipeline') }} - </strong> - <a - :href="latestPipeline.path" - target="_blank" - class="ide-external-link" - > - #{{ latestPipeline.id }} - <icon - :size="12" - name="external-link" - /> + <strong> {{ __('Pipeline') }} </strong> + <a :href="latestPipeline.path" target="_blank" class="ide-external-link"> + #{{ latestPipeline.id }} <icon :size="12" name="external-link" /> </a> </span> </header> @@ -87,58 +67,25 @@ export default { :empty-state-svg-path="pipelinesEmptyStateSvgPath" :can-set-ci="true" /> - <div - v-else-if="latestPipeline.yamlError" - class="bs-callout bs-callout-danger" - > - <p class="append-bottom-0"> - {{ __('Found errors in your .gitlab-ci.yml:') }} - </p> - <p class="append-bottom-0 break-word"> - {{ latestPipeline.yamlError }} - </p> - <p - class="append-bottom-0" - v-html="ciLintText" - ></p> + <div v-else-if="latestPipeline.yamlError" class="bs-callout bs-callout-danger"> + <p class="append-bottom-0">{{ __('Found errors in your .gitlab-ci.yml:') }}</p> + <p class="append-bottom-0 break-word">{{ latestPipeline.yamlError }}</p> + <p class="append-bottom-0" v-html="ciLintText"></p> </div> - <tabs - v-else - class="ide-pipeline-list" - > - <tab - :active="!pipelineFailed" - > + <tabs v-else class="ide-pipeline-list"> + <tab :active="!pipelineFailed"> <template slot="title"> {{ __('Jobs') }} - <span - v-if="jobsCount" - class="badge badge-pill" - > - {{ jobsCount }} - </span> + <span v-if="jobsCount" class="badge badge-pill"> {{ jobsCount }} </span> </template> - <jobs-list - :loading="isLoadingJobs" - :stages="stages" - /> + <jobs-list :loading="isLoadingJobs" :stages="stages" /> </tab> - <tab - :active="pipelineFailed" - > + <tab :active="pipelineFailed"> <template slot="title"> {{ __('Failed Jobs') }} - <span - v-if="failedJobsCount" - class="badge badge-pill" - > - {{ failedJobsCount }} - </span> + <span v-if="failedJobsCount" class="badge badge-pill"> {{ failedJobsCount }} </span> </template> - <jobs-list - :loading="isLoadingJobs" - :stages="failedStages" - /> + <jobs-list :loading="isLoadingJobs" :stages="failedStages" /> </tab> </tabs> </template> diff --git a/app/assets/javascripts/ide/components/preview/clientside.vue b/app/assets/javascripts/ide/components/preview/clientside.vue index afc0cfca7d8..c98dda00817 100644 --- a/app/assets/javascripts/ide/components/preview/clientside.vue +++ b/app/assets/javascripts/ide/components/preview/clientside.vue @@ -146,9 +146,7 @@ export default { <template> <div class="preview h-100 w-100 d-flex flex-column"> <template v-if="showPreview"> - <navigator - :manager="manager" - /> + <navigator :manager="manager" /> <div id="ide-preview"></div> </template> <div @@ -156,15 +154,8 @@ export default { v-once class="d-flex h-100 flex-column align-items-center justify-content-center svg-content" > - <img - :src="promotionSvgPath" - :alt="s__('IDE|Live Preview')" - width="130" - height="100" - /> - <h3> - {{ s__('IDE|Live Preview') }} - </h3> + <img :src="promotionSvgPath" :alt="s__('IDE|Live Preview')" width="130" height="100" /> + <h3>{{ s__('IDE|Live Preview') }}</h3> <p class="text-center"> {{ s__('IDE|Preview your web application using Web IDE client-side evaluation.') }} </p> @@ -177,10 +168,6 @@ export default { {{ s__('IDE|Get started with Live Preview') }} </a> </div> - <gl-loading-icon - v-else - :size="2" - class="align-self-center mt-auto mb-auto" - /> + <gl-loading-icon v-else :size="2" class="align-self-center mt-auto mb-auto" /> </div> </template> diff --git a/app/assets/javascripts/ide/components/preview/navigator.vue b/app/assets/javascripts/ide/components/preview/navigator.vue index cc6fc595b74..bc80e1dba25 100644 --- a/app/assets/javascripts/ide/components/preview/navigator.vue +++ b/app/assets/javascripts/ide/components/preview/navigator.vue @@ -91,33 +91,25 @@ export default { :aria-label="s__('IDE|Back')" :disabled="backButtonDisabled" :class="{ - 'disabled-content': backButtonDisabled + 'disabled-content': backButtonDisabled, }" type="button" class="ide-navigator-btn d-flex align-items-center d-transparent border-0 bg-transparent" @click="back" > - <icon - :size="24" - name="chevron-left" - class="m-auto" - /> + <icon :size="24" name="chevron-left" class="m-auto" /> </button> <button :aria-label="s__('IDE|Back')" :disabled="forwardButtonDisabled" :class="{ - 'disabled-content': forwardButtonDisabled + 'disabled-content': forwardButtonDisabled, }" type="button" class="ide-navigator-btn d-flex align-items-center d-transparent border-0 bg-transparent" @click="forward" > - <icon - :size="24" - name="chevron-right" - class="m-auto" - /> + <icon :size="24" name="chevron-right" class="m-auto" /> </button> <button :aria-label="s__('IDE|Refresh preview')" @@ -125,11 +117,7 @@ export default { class="ide-navigator-btn d-flex align-items-center d-transparent border-0 bg-transparent" @click="refresh" > - <icon - :size="18" - name="retry" - class="m-auto" - /> + <icon :size="18" name="retry" class="m-auto" /> </button> <div class="position-relative w-100 prepend-left-4"> <input @@ -138,10 +126,7 @@ export default { class="ide-navigator-location form-control bg-white" readonly /> - <gl-loading-icon - v-if="loading" - class="position-absolute ide-preview-loading-icon" - /> + <gl-loading-icon v-if="loading" class="position-absolute ide-preview-loading-icon" /> </div> </header> </template> diff --git a/app/assets/javascripts/ide/components/repo_commit_section.vue b/app/assets/javascripts/ide/components/repo_commit_section.vue index 5e86876c1c1..8dd88f187d4 100644 --- a/app/assets/javascripts/ide/components/repo_commit_section.vue +++ b/app/assets/javascripts/ide/components/repo_commit_section.vue @@ -71,9 +71,7 @@ export default { </script> <template> - <div - class="multi-file-commit-panel-section" - > + <div class="multi-file-commit-panel-section"> <deprecated-modal id="ide-create-branch-modal" :primary-button-label="__('Create new branch')" @@ -82,13 +80,13 @@ export default { @submit="forceCreateNewBranch" > <template slot="body"> - {{ __(`This branch has changed since you started editing. - Would you like to create a new branch?`) }} + {{ + __(`This branch has changed since you started editing. + Would you like to create a new branch?`) + }} </template> </deprecated-modal> - <template - v-if="showStageUnstageArea" - > + <template v-if="showStageUnstageArea"> <commit-files-list :title="__('Unstaged')" :key-prefix="$options.stageKeys.unstaged" @@ -116,8 +114,6 @@ export default { icon-name="staged" /> </template> - <empty-state - v-if="unusedSeal" - /> + <empty-state v-if="unusedSeal" /> </div> </template> diff --git a/app/assets/javascripts/ide/components/repo_editor.vue b/app/assets/javascripts/ide/components/repo_editor.vue index 7b0f717962e..c13d3ec094b 100644 --- a/app/assets/javascripts/ide/components/repo_editor.vue +++ b/app/assets/javascripts/ide/components/repo_editor.vue @@ -212,20 +212,15 @@ export default { </script> <template> - <div - id="ide" - class="blob-viewer-container blob-editor-container" - > + <div id="ide" class="blob-viewer-container blob-editor-container"> <div class="ide-mode-tabs clearfix"> - <ul - v-if="!shouldHideEditor && isEditModeActive" - class="nav-links float-left" - > + <ul v-if="!shouldHideEditor && isEditModeActive" class="nav-links float-left"> <li :class="editTabCSS"> <a href="javascript:void(0);" role="button" - @click.prevent="setFileViewMode({ file, viewMode: 'editor' })"> + @click.prevent="setFileViewMode({ file, viewMode: 'editor' });" + > <template v-if="viewer === $options.viewerTypes.edit"> {{ __('Edit') }} </template> @@ -234,41 +229,36 @@ export default { </template> </a> </li> - <li - v-if="file.previewMode" - :class="previewTabCSS"> + <li v-if="file.previewMode" :class="previewTabCSS"> <a href="javascript:void(0);" role="button" - @click.prevent="setFileViewMode({ file, viewMode:'preview' })"> + @click.prevent="setFileViewMode({ file, viewMode: 'preview' });" + > {{ file.previewMode.previewTitle }} </a> </li> </ul> - <external-link - :file="file" - /> + <external-link :file="file" /> </div> - <file-templates-bar - v-if="showFileTemplatesBar(file.name)" - /> + <file-templates-bar v-if="showFileTemplatesBar(file.name)" /> <div - v-show="!shouldHideEditor && file.viewMode ==='editor'" + v-show="!shouldHideEditor && file.viewMode === 'editor'" ref="editor" :class="{ 'is-readonly': isCommitModeActive, 'is-deleted': file.deleted, - 'is-added': file.tempFile + 'is-added': file.tempFile, }" class="multi-file-editor-holder" - > - </div> + ></div> <content-viewer v-if="showContentViewer" :content="file.content || file.raw" :path="file.rawPath || file.path" :file-size="file.size" - :project-path="file.projectId"/> + :project-path="file.projectId" + /> <diff-viewer v-if="showDiffViewer" :diff-mode="file.mrChange.diffMode" @@ -276,6 +266,7 @@ export default { :new-sha="currentMergeRequest.sha" :old-path="file.mrChange.old_path" :old-sha="currentMergeRequest.baseCommitSha" - :project-path="file.projectId"/> + :project-path="file.projectId" + /> </div> </template> diff --git a/app/assets/javascripts/ide/components/repo_file_status_icon.vue b/app/assets/javascripts/ide/components/repo_file_status_icon.vue index 97589e116c5..a964d90b090 100644 --- a/app/assets/javascripts/ide/components/repo_file_status_icon.vue +++ b/app/assets/javascripts/ide/components/repo_file_status_icon.vue @@ -25,15 +25,7 @@ export default { </script> <template> - <span - v-if="file.file_lock" - v-tooltip - :title="lockTooltip" - data-container="body" - > - <icon - name="lock" - css-classes="file-status-icon" - /> + <span v-if="file.file_lock" v-tooltip :title="lockTooltip" data-container="body"> + <icon name="lock" css-classes="file-status-icon" /> </span> </template> diff --git a/app/assets/javascripts/ide/components/repo_tab.vue b/app/assets/javascripts/ide/components/repo_tab.vue index d621653d6fd..4b87b83db8a 100644 --- a/app/assets/javascripts/ide/components/repo_tab.vue +++ b/app/assets/javascripts/ide/components/repo_tab.vue @@ -72,41 +72,26 @@ export default { <li :class="{ active: tab.active, - disabled: tab.pending + disabled: tab.pending, }" - @click="clickFile(tab)" + @click="clickFile(tab);" @mouseover="mouseOverTab" @mouseout="mouseOutTab" > - <div - :title="tab.url" - class="multi-file-tab" - > - <file-icon - :file-name="tab.name" - :size="16" - /> + <div :title="tab.url" class="multi-file-tab"> + <file-icon :file-name="tab.name" :size="16" /> {{ tab.name }} - <file-status-icon - :file="tab" - /> + <file-status-icon :file="tab" /> </div> <button :aria-label="closeLabel" :disabled="tab.pending" type="button" class="multi-file-tab-close" - @click.stop.prevent="closeFile(tab)" + @click.stop.prevent="closeFile(tab);" > - <icon - v-if="!showChangedIcon" - :size="12" - name="close" - /> - <changed-file-icon - v-else - :file="tab" - /> + <icon v-if="!showChangedIcon" :size="12" name="close" /> + <changed-file-icon v-else :file="tab" /> </button> </li> </template> diff --git a/app/assets/javascripts/ide/components/repo_tabs.vue b/app/assets/javascripts/ide/components/repo_tabs.vue index c12a63e26be..4dbc4383894 100644 --- a/app/assets/javascripts/ide/components/repo_tabs.vue +++ b/app/assets/javascripts/ide/components/repo_tabs.vue @@ -51,15 +51,8 @@ export default { <template> <div class="multi-file-tabs"> - <ul - ref="tabsScroller" - class="list-unstyled append-bottom-0" - > - <repo-tab - v-for="tab in files" - :key="tab.key" - :tab="tab" - /> + <ul ref="tabsScroller" class="list-unstyled append-bottom-0"> + <repo-tab v-for="tab in files" :key="tab.key" :tab="tab" /> </ul> </div> </template> diff --git a/app/assets/javascripts/ide/components/resizable_panel.vue b/app/assets/javascripts/ide/components/resizable_panel.vue index 7277fcb7617..a89de56ab5c 100644 --- a/app/assets/javascripts/ide/components/resizable_panel.vue +++ b/app/assets/javascripts/ide/components/resizable_panel.vue @@ -78,8 +78,8 @@ export default { :min-size="minSize" :max-size="$options.maxSize" :side="side === 'right' ? 'left' : 'right'" - @resize-start="setResizingStatus(true)" - @resize-end="setResizingStatus(false)" + @resize-start="setResizingStatus(true);" + @resize-end="setResizingStatus(false);" /> </div> </template> diff --git a/app/assets/javascripts/ide/components/shared/tokened_input.vue b/app/assets/javascripts/ide/components/shared/tokened_input.vue index 30010957a16..f58e08c2cc9 100644 --- a/app/assets/javascripts/ide/components/shared/tokened_input.vue +++ b/app/assets/javascripts/ide/components/shared/tokened_input.vue @@ -72,31 +72,16 @@ export default { <div class="filtered-search-wrapper"> <div class="filtered-search-box"> <div class="tokens-container list-unstyled"> - <div - v-for="token in tokens" - :key="token.label" - class="filtered-search-token" - > + <div v-for="token in tokens" :key="token.label" class="filtered-search-token"> <button class="selectable btn-blank" type="button" - @click.stop="removeToken(token)" - @keyup.delete="removeToken(token)" + @click.stop="removeToken(token);" + @keyup.delete="removeToken(token);" > - <div - class="value-container rounded" - > - <div - class="value" - >{{ token.label }}</div> - <div - class="remove-token inverted" - > - <icon - :size="10" - name="close" - /> - </div> + <div class="value-container rounded"> + <div class="value">{{ token.label }}</div> + <div class="remove-token inverted"><icon :size="10" name="close" /></div> </div> </button> </div> |