diff options
Diffstat (limited to 'app')
56 files changed, 643 insertions, 657 deletions
diff --git a/app/assets/images/auth_buttons/signin_with_google.png b/app/assets/images/auth_buttons/signin_with_google.png Binary files differindex b1327b4f7b4..f27bb243304 100644 --- a/app/assets/images/auth_buttons/signin_with_google.png +++ b/app/assets/images/auth_buttons/signin_with_google.png diff --git a/app/assets/javascripts/boards/components/board_sidebar.js b/app/assets/javascripts/boards/components/board_sidebar.js index 7f3afefc9cc..c1f902a785a 100644 --- a/app/assets/javascripts/boards/components/board_sidebar.js +++ b/app/assets/javascripts/boards/components/board_sidebar.js @@ -9,6 +9,7 @@ import Flash from '../../flash'; import eventHub from '../../sidebar/event_hub'; import AssigneeTitle from '../../sidebar/components/assignees/assignee_title'; import Assignees from '../../sidebar/components/assignees/assignees'; +import DueDateSelectors from '../../due_date_select'; import './sidebar/remove_issue'; const Store = gl.issueBoards.BoardsStore; @@ -113,7 +114,7 @@ gl.issueBoards.BoardSidebar = Vue.extend({ mounted () { new IssuableContext(this.currentUser); new MilestoneSelect(); - new gl.DueDateSelectors(); + new DueDateSelectors(); new LabelsSelect(); new Sidebar(); gl.Subscription.bindAll('.subscription'); diff --git a/app/assets/javascripts/clusters.js b/app/assets/javascripts/clusters.js index 50dbeb06362..180aa30e98c 100644 --- a/app/assets/javascripts/clusters.js +++ b/app/assets/javascripts/clusters.js @@ -3,7 +3,8 @@ import Visibility from 'visibilityjs'; import axios from 'axios'; import Poll from './lib/utils/poll'; import { s__ } from './locale'; -import './flash'; +import initSettingsPanels from './settings_panels'; +import Flash from './flash'; /** * Cluster page has 2 separate parts: @@ -24,6 +25,8 @@ class ClusterService { export default class Clusters { constructor() { + initSettingsPanels(); + const dataset = document.querySelector('.js-edit-cluster-form').dataset; this.state = { diff --git a/app/assets/javascripts/dispatcher.js b/app/assets/javascripts/dispatcher.js index b66652db33b..2885923aeda 100644 --- a/app/assets/javascripts/dispatcher.js +++ b/app/assets/javascripts/dispatcher.js @@ -86,6 +86,7 @@ import ShortcutsIssuable from './shortcuts_issuable'; import U2FAuthenticate from './u2f/authenticate'; import Members from './members'; import memberExpirationDate from './member_expiration_date'; +import DueDateSelectors from './due_date_select'; (function() { var Dispatcher; @@ -232,7 +233,7 @@ import memberExpirationDate from './member_expiration_date'; case 'groups:milestones:edit': case 'groups:milestones:update': new ZenMode(); - new gl.DueDateSelectors(); + new DueDateSelectors(); new GLForm($('.milestone-form'), true); break; case 'projects:compare:show': @@ -532,7 +533,7 @@ import memberExpirationDate from './member_expiration_date'; break; case 'profiles:personal_access_tokens:index': case 'admin:impersonation_tokens:index': - new gl.DueDateSelectors(); + new DueDateSelectors(); break; case 'projects:clusters:show': import(/* webpackChunkName: "clusters" */ './clusters') diff --git a/app/assets/javascripts/due_date_select.js b/app/assets/javascripts/due_date_select.js index ee71728184f..ada985913bb 100644 --- a/app/assets/javascripts/due_date_select.js +++ b/app/assets/javascripts/due_date_select.js @@ -1,8 +1,7 @@ -/* eslint-disable wrap-iife, func-names, space-before-function-paren, comma-dangle, prefer-template, consistent-return, class-methods-use-this, arrow-body-style, no-unused-vars, no-underscore-dangle, no-new, max-len, no-sequences, no-unused-expressions, no-param-reassign */ /* global dateFormat */ import Pikaday from 'pikaday'; -import DateFix from './lib/utils/datefix'; +import { parsePikadayDate, pikadayToString } from './lib/utils/datefix'; class DueDateSelect { constructor({ $dropdown, $loading } = {}) { @@ -17,8 +16,8 @@ class DueDateSelect { this.$value = $block.find('.value'); this.$valueContent = $block.find('.value-content'); this.$sidebarValue = $('.js-due-date-sidebar-value', $block); - this.fieldName = $dropdown.data('field-name'), - this.abilityName = $dropdown.data('ability-name'), + this.fieldName = $dropdown.data('field-name'); + this.abilityName = $dropdown.data('ability-name'); this.issueUpdateURL = $dropdown.data('issue-update'); this.rawSelectedDate = null; @@ -39,20 +38,20 @@ class DueDateSelect { hidden: () => { this.$selectbox.hide(); this.$value.css('display', ''); - } + }, }); } initDatePicker() { const $dueDateInput = $(`input[name='${this.fieldName}']`); - const dateFix = DateFix.dashedFix($dueDateInput.val()); const calendar = new Pikaday({ field: $dueDateInput.get(0), theme: 'gitlab-theme', format: 'yyyy-mm-dd', + parse: dateString => parsePikadayDate(dateString), + toString: date => pikadayToString(date), onSelect: (dateText) => { - const formattedDate = dateFormat(new Date(dateText), 'yyyy-mm-dd'); - $dueDateInput.val(formattedDate); + $dueDateInput.val(calendar.toString(dateText)); if (this.$dropdown.hasClass('js-issue-boards-due-date')) { gl.issueBoards.BoardsStore.detail.issue.dueDate = $dueDateInput.val(); @@ -60,10 +59,10 @@ class DueDateSelect { } else { this.saveDueDate(true); } - } + }, }); - calendar.setDate(dateFix); + calendar.setDate(parsePikadayDate($dueDateInput.val())); this.$datePicker.append(calendar.el); this.$datePicker.data('pikaday', calendar); } @@ -79,8 +78,8 @@ class DueDateSelect { gl.issueBoards.BoardsStore.detail.issue.dueDate = ''; this.updateIssueBoardIssue(); } else { - $("input[name='" + this.fieldName + "']").val(''); - return this.saveDueDate(false); + $(`input[name='${this.fieldName}']`).val(''); + this.saveDueDate(false); } }); } @@ -111,7 +110,7 @@ class DueDateSelect { this.datePayload = datePayload; } - updateIssueBoardIssue () { + updateIssueBoardIssue() { this.$loading.fadeIn(); this.$dropdown.trigger('loading.gl.dropdown'); this.$selectbox.hide(); @@ -149,8 +148,8 @@ class DueDateSelect { return selectedDateValue.length ? $('.js-remove-due-date-holder').removeClass('hidden') : $('.js-remove-due-date-holder').addClass('hidden'); - } - }).done((data) => { + }, + }).done(() => { if (isDropdown) { this.$dropdown.trigger('loaded.gl.dropdown'); this.$dropdown.dropdown('toggle'); @@ -160,27 +159,28 @@ class DueDateSelect { } } -class DueDateSelectors { +export default class DueDateSelectors { constructor() { this.initMilestoneDatePicker(); this.initIssuableSelect(); } - + // eslint-disable-next-line class-methods-use-this initMilestoneDatePicker() { - $('.datepicker').each(function() { + $('.datepicker').each(function initPikadayMilestone() { const $datePicker = $(this); - const dateFix = DateFix.dashedFix($datePicker.val()); const calendar = new Pikaday({ field: $datePicker.get(0), theme: 'gitlab-theme animate-picker', format: 'yyyy-mm-dd', container: $datePicker.parent().get(0), + parse: dateString => parsePikadayDate(dateString), + toString: date => pikadayToString(date), onSelect(dateText) { - $datePicker.val(dateFormat(new Date(dateText), 'yyyy-mm-dd')); - } + $datePicker.val(calendar.toString(dateText)); + }, }); - calendar.setDate(dateFix); + calendar.setDate(parsePikadayDate($datePicker.val())); $datePicker.data('pikaday', calendar); }); @@ -191,19 +191,17 @@ class DueDateSelectors { calendar.setDate(null); }); } - + // eslint-disable-next-line class-methods-use-this initIssuableSelect() { const $loading = $('.js-issuable-update .due_date').find('.block-loading').hide(); $('.js-due-date-select').each((i, dropdown) => { const $dropdown = $(dropdown); + // eslint-disable-next-line no-new new DueDateSelect({ $dropdown, - $loading + $loading, }); }); } } - -window.gl = window.gl || {}; -window.gl.DueDateSelectors = DueDateSelectors; diff --git a/app/assets/javascripts/filtered_search/filtered_search_visual_tokens.js b/app/assets/javascripts/filtered_search/filtered_search_visual_tokens.js index dd24fc44d2a..d2f92929b8a 100644 --- a/app/assets/javascripts/filtered_search/filtered_search_visual_tokens.js +++ b/app/assets/javascripts/filtered_search/filtered_search_visual_tokens.js @@ -123,8 +123,8 @@ class FilteredSearchVisualTokens { /* eslint-disable no-param-reassign */ tokenValueContainer.dataset.originalValue = tokenValue; tokenValueElement.innerHTML = ` - <img class="avatar s20" src="${user.avatar_url}" alt="${user.name}'s avatar"> - ${user.name} + <img class="avatar s20" src="${user.avatar_url}" alt=""> + ${_.escape(user.name)} `; /* eslint-enable no-param-reassign */ }) diff --git a/app/assets/javascripts/init_issuable_sidebar.js b/app/assets/javascripts/init_issuable_sidebar.js index 29e3d2ea94e..32a1a269f9a 100644 --- a/app/assets/javascripts/init_issuable_sidebar.js +++ b/app/assets/javascripts/init_issuable_sidebar.js @@ -4,6 +4,8 @@ /* global IssuableContext */ /* global Sidebar */ +import DueDateSelectors from './due_date_select'; + export default () => { const sidebarOptions = JSON.parse(document.querySelector('.js-sidebar-options').innerHTML); @@ -13,6 +15,6 @@ export default () => { new LabelsSelect(); new IssuableContext(sidebarOptions.currentUser); gl.Subscription.bindAll('.subscription'); - new gl.DueDateSelectors(); + new DueDateSelectors(); window.sidebar = new Sidebar(); }; diff --git a/app/assets/javascripts/issuable_form.js b/app/assets/javascripts/issuable_form.js index 470c39c6f76..cd2562bc6a9 100644 --- a/app/assets/javascripts/issuable_form.js +++ b/app/assets/javascripts/issuable_form.js @@ -1,12 +1,12 @@ /* eslint-disable func-names, space-before-function-paren, no-var, prefer-rest-params, wrap-iife, no-use-before-define, no-useless-escape, no-new, quotes, object-shorthand, no-unused-vars, comma-dangle, no-alert, consistent-return, no-else-return, prefer-template, one-var, one-var-declaration-per-line, curly, max-len */ /* global GitLab */ /* global Autosave */ -/* global dateFormat */ import Pikaday from 'pikaday'; import UsersSelect from './users_select'; import GfmAutoComplete from './gfm_auto_complete'; import ZenMode from './zen_mode'; +import { parsePikadayDate, pikadayToString } from './lib/utils/datefix'; (function() { this.IssuableForm = (function() { @@ -38,11 +38,13 @@ import ZenMode from './zen_mode'; theme: 'gitlab-theme animate-picker', format: 'yyyy-mm-dd', container: $issuableDueDate.parent().get(0), + parse: dateString => parsePikadayDate(dateString), + toString: date => pikadayToString(date), onSelect: function(dateText) { - $issuableDueDate.val(dateFormat(new Date(dateText), 'yyyy-mm-dd')); + $issuableDueDate.val(calendar.toString(dateText)); } }); - calendar.setDate(new Date($issuableDueDate.val())); + calendar.setDate(parsePikadayDate($issuableDueDate.val())); } } diff --git a/app/assets/javascripts/issue_show/components/app.vue b/app/assets/javascripts/issue_show/components/app.vue index eecb56cb185..d1aa83ea57f 100644 --- a/app/assets/javascripts/issue_show/components/app.vue +++ b/app/assets/javascripts/issue_show/components/app.vue @@ -24,6 +24,11 @@ export default { required: true, type: Boolean, }, + showInlineEditButton: { + type: Boolean, + required: false, + default: false, + }, issuableRef: { type: String, required: true, @@ -222,20 +227,25 @@ export default { <div v-else> <title-component :issuable-ref="issuableRef" + :can-update="canUpdate" :title-html="state.titleHtml" - :title-text="state.titleText" /> + :title-text="state.titleText" + :show-inline-edit-button="showInlineEditButton" + /> <description-component v-if="state.descriptionHtml" :can-update="canUpdate" :description-html="state.descriptionHtml" :description-text="state.descriptionText" :updated-at="state.updatedAt" - :task-status="state.taskStatus" /> + :task-status="state.taskStatus" + /> <edited-component v-if="hasUpdated" :updated-at="state.updatedAt" :updated-by-name="state.updatedByName" - :updated-by-path="state.updatedByPath" /> + :updated-by-path="state.updatedByPath" + /> </div> </div> </template> diff --git a/app/assets/javascripts/issue_show/components/title.vue b/app/assets/javascripts/issue_show/components/title.vue index a9dabd4cff1..00002709ac6 100644 --- a/app/assets/javascripts/issue_show/components/title.vue +++ b/app/assets/javascripts/issue_show/components/title.vue @@ -1,5 +1,8 @@ <script> import animateMixin from '../mixins/animate'; + import eventHub from '../event_hub'; + import tooltip from '../../vue_shared/directives/tooltip'; + import { spriteIcon } from '../../lib/utils/common_utils'; export default { mixins: [animateMixin], @@ -15,6 +18,11 @@ type: String, required: true, }, + canUpdate: { + required: false, + type: Boolean, + default: false, + }, titleHtml: { type: String, required: true, @@ -23,6 +31,14 @@ type: String, required: true, }, + showInlineEditButton: { + type: Boolean, + required: false, + default: false, + }, + }, + directives: { + tooltip, }, watch: { titleHtml() { @@ -30,24 +46,46 @@ this.animateChange(); }, }, + computed: { + pencilIcon() { + return spriteIcon('pencil', 'link-highlight'); + }, + }, methods: { setPageTitle() { const currentPageTitleScope = this.titleEl.innerText.split('·'); currentPageTitleScope[0] = `${this.titleText} (${this.issuableRef}) `; this.titleEl.textContent = currentPageTitleScope.join('·'); }, + edit() { + eventHub.$emit('open.form'); + }, }, }; </script> <template> - <h2 - class="title" - :class="{ - 'issue-realtime-pre-pulse': preAnimation, - 'issue-realtime-trigger-pulse': pulseAnimation - }" - v-html="titleHtml" - > - </h2> + <div class="title-container"> + <h2 + class="title" + :class="{ + 'issue-realtime-pre-pulse': preAnimation, + 'issue-realtime-trigger-pulse': pulseAnimation + }" + v-html="titleHtml" + > + </h2> + <button + v-tooltip + v-if="showInlineEditButton && canUpdate" + type="button" + class="btn-blank btn-edit note-action-button" + v-html="pencilIcon" + title="Edit title and description" + data-placement="bottom" + data-container="body" + @click="edit" + > + </button> + </div> </template> diff --git a/app/assets/javascripts/lib/utils/datefix.js b/app/assets/javascripts/lib/utils/datefix.js index 990dc3f6d1a..e98c9068367 100644 --- a/app/assets/javascripts/lib/utils/datefix.js +++ b/app/assets/javascripts/lib/utils/datefix.js @@ -1,8 +1,29 @@ -const DateFix = { - dashedFix(val) { - const [y, m, d] = val.split('-'); - return new Date(y, m - 1, d); - }, + +export const pad = (val, len = 2) => (`0${val}`).slice(-len); + +/** + * Formats dates in Pickaday + * @param {String} dateString Date in yyyy-mm-dd format + * @return {Date} UTC format + */ +export const parsePikadayDate = (dateString) => { + const parts = dateString.split('-'); + const year = parseInt(parts[0], 10); + const month = parseInt(parts[1] - 1, 10); + const day = parseInt(parts[2], 10); + + return new Date(year, month, day); }; -export default DateFix; +/** + * Used `onSelect` method in pickaday + * @param {Date} date UTC format + * @return {String} Date formated in yyyy-mm-dd + */ +export const pikadayToString = (date) => { + const day = pad(date.getDate()); + const month = pad(date.getMonth() + 1); + const year = date.getFullYear(); + + return `${year}-${month}-${day}`; +}; diff --git a/app/assets/javascripts/main.js b/app/assets/javascripts/main.js index 2fc47d5963b..4cf07e99161 100644 --- a/app/assets/javascripts/main.js +++ b/app/assets/javascripts/main.js @@ -51,8 +51,6 @@ import './confirm_danger_modal'; import './copy_as_gfm'; import './copy_to_clipboard'; import './diff'; -import './dropzone_input'; -import './due_date_select'; import './files_comment_button'; import Flash, { removeFlashClickListener } from './flash'; import './gl_dropdown'; diff --git a/app/assets/javascripts/member_expiration_date.js b/app/assets/javascripts/member_expiration_date.js index 26b24fdafda..84e70e35bad 100644 --- a/app/assets/javascripts/member_expiration_date.js +++ b/app/assets/javascripts/member_expiration_date.js @@ -1,6 +1,5 @@ -/* global dateFormat */ - import Pikaday from 'pikaday'; +import { parsePikadayDate, pikadayToString } from './lib/utils/datefix'; // Add datepickers to all `js-access-expiration-date` elements. If those elements are // children of an element with the `clearable-input` class, and have a sibling @@ -22,8 +21,10 @@ export default function memberExpirationDate(selector = '.js-access-expiration-d format: 'yyyy-mm-dd', minDate: new Date(), container: $input.parent().get(0), + parse: dateString => parsePikadayDate(dateString), + toString: date => pikadayToString(date), onSelect(dateText) { - $input.val(dateFormat(new Date(dateText), 'yyyy-mm-dd')); + $input.val(calendar.toString(dateText)); $input.trigger('change'); @@ -31,7 +32,7 @@ export default function memberExpirationDate(selector = '.js-access-expiration-d }, }); - calendar.setDate(new Date($input.val())); + calendar.setDate(parsePikadayDate($input.val())); $input.data('pikaday', calendar); }); diff --git a/app/assets/javascripts/registry/stores/mutations.js b/app/assets/javascripts/registry/stores/mutations.js index e40382e7afc..208c3c39866 100644 --- a/app/assets/javascripts/registry/stores/mutations.js +++ b/app/assets/javascripts/registry/stores/mutations.js @@ -38,7 +38,7 @@ export default { tag: element.name, revision: element.revision, shortRevision: element.short_revision, - size: element.size, + size: element.total_size, layers: element.layers, location: element.location, createdAt: element.created_at, diff --git a/app/assets/javascripts/repo/components/repo.vue b/app/assets/javascripts/repo/components/repo.vue index cc60aa5939c..0a89a9f16cb 100644 --- a/app/assets/javascripts/repo/components/repo.vue +++ b/app/assets/javascripts/repo/components/repo.vue @@ -11,7 +11,9 @@ import Helper from '../helpers/repo_helper'; import MonacoLoaderHelper from '../helpers/monaco_loader_helper'; export default { - data: () => Store, + data() { + return Store; + }, mixins: [RepoMixin], components: { RepoSidebar, diff --git a/app/assets/javascripts/repo/components/repo_commit_section.vue b/app/assets/javascripts/repo/components/repo_commit_section.vue index c0dc4c8cd8b..185cd90ac06 100644 --- a/app/assets/javascripts/repo/components/repo_commit_section.vue +++ b/app/assets/javascripts/repo/components/repo_commit_section.vue @@ -9,7 +9,9 @@ import { visitUrl } from '../../lib/utils/url_utility'; export default { mixins: [RepoMixin], - data: () => Store, + data() { + return Store; + }, components: { PopupDialog, diff --git a/app/assets/javascripts/repo/components/repo_edit_button.vue b/app/assets/javascripts/repo/components/repo_edit_button.vue index 353142edeb7..e6e8b2e5205 100644 --- a/app/assets/javascripts/repo/components/repo_edit_button.vue +++ b/app/assets/javascripts/repo/components/repo_edit_button.vue @@ -3,7 +3,9 @@ import Store from '../stores/repo_store'; import RepoMixin from '../mixins/repo_mixin'; export default { - data: () => Store, + data() { + return Store; + }, mixins: [RepoMixin], computed: { buttonLabel() { diff --git a/app/assets/javascripts/repo/components/repo_editor.vue b/app/assets/javascripts/repo/components/repo_editor.vue index 2c597a3cd65..4639bee6d66 100644 --- a/app/assets/javascripts/repo/components/repo_editor.vue +++ b/app/assets/javascripts/repo/components/repo_editor.vue @@ -5,7 +5,9 @@ import Service from '../services/repo_service'; import Helper from '../helpers/repo_helper'; const RepoEditor = { - data: () => Store, + data() { + return Store; + }, destroyed() { if (Helper.monacoInstance) { @@ -93,7 +95,7 @@ const RepoEditor = { }, blobRaw() { - if (Helper.monacoInstance && !this.isTree) { + if (Helper.monacoInstance) { this.setupEditor(); } }, diff --git a/app/assets/javascripts/repo/components/repo_file.vue b/app/assets/javascripts/repo/components/repo_file.vue index 8b9cbd23456..c7e69340f17 100644 --- a/app/assets/javascripts/repo/components/repo_file.vue +++ b/app/assets/javascripts/repo/components/repo_file.vue @@ -1,107 +1,78 @@ <script> -import TimeAgoMixin from '../../vue_shared/mixins/timeago'; + import timeAgoMixin from '../../vue_shared/mixins/timeago'; + import eventHub from '../event_hub'; + import repoMixin from '../mixins/repo_mixin'; -const RepoFile = { - mixins: [TimeAgoMixin], - props: { - file: { - type: Object, - required: true, + export default { + mixins: [ + repoMixin, + timeAgoMixin, + ], + props: { + file: { + type: Object, + required: true, + }, }, - isMini: { - type: Boolean, - required: false, - default: false, + computed: { + fileIcon() { + const classObj = { + 'fa-spinner fa-spin': this.file.loading, + [this.file.icon]: !this.file.loading, + 'fa-folder-open': !this.file.loading && this.file.opened, + }; + return classObj; + }, + levelIndentation() { + return { + marginLeft: `${this.file.level * 16}px`, + }; + }, }, - loading: { - type: Object, - required: false, - default() { return { tree: false }; }, + methods: { + linkClicked(file) { + eventHub.$emit('fileNameClicked', file); + }, }, - hasFiles: { - type: Boolean, - required: false, - default: false, - }, - activeFile: { - type: Object, - required: true, - }, - }, - - computed: { - canShowFile() { - return !this.loading.tree || this.hasFiles; - }, - - fileIcon() { - const classObj = { - 'fa-spinner fa-spin': this.file.loading, - [this.file.icon]: !this.file.loading, - }; - return classObj; - }, - - fileIndentation() { - return { - 'margin-left': `${this.file.level * 10}px`, - }; - }, - - activeFileClass() { - return { - active: this.activeFile.url === this.file.url, - }; - }, - }, - - methods: { - linkClicked(file) { - this.$emit('linkclicked', file); - }, - }, -}; - -export default RepoFile; + }; </script> <template> -<tr - v-if="canShowFile" - class="file" - :class="activeFileClass" - @click.prevent="linkClicked(file)"> - <td> - <i - class="fa fa-fw file-icon" - :class="fileIcon" - :style="fileIndentation" - aria-label="file icon"> - </i> - <a - :href="file.url" - class="repo-file-name" - :title="file.url"> - {{file.name}} - </a> - </td> + <tr + class="file" + @click.prevent="linkClicked(file)"> + <td> + <i + class="fa fa-fw file-icon" + :class="fileIcon" + :style="levelIndentation" + aria-hidden="true" + > + </i> + <a + :href="file.url" + class="repo-file-name" + > + {{ file.name }} + </a> + </td> - <template v-if="!isMini"> - <td class="hidden-sm hidden-xs"> - <div class="commit-message"> - <a @click.stop :href="file.lastCommitUrl"> - {{file.lastCommitMessage}} + <template v-if="!isMini"> + <td class="hidden-sm hidden-xs"> + <a + @click.stop + :href="file.lastCommit.url" + class="commit-message" + > + {{ file.lastCommit.message }} </a> - </div> - </td> + </td> - <td class="hidden-xs text-right"> - <span - class="commit-update" - :title="tooltipTitle(file.lastCommitUpdate)"> - {{timeFormated(file.lastCommitUpdate)}} - </span> - </td> - </template> -</tr> + <td class="commit-update hidden-xs text-right"> + <span :title="tooltipTitle(file.lastCommit.updatedAt)"> + {{ timeFormated(file.lastCommit.updatedAt) }} + </span> + </td> + </template> + </tr> </template> diff --git a/app/assets/javascripts/repo/components/repo_file_buttons.vue b/app/assets/javascripts/repo/components/repo_file_buttons.vue index e43ef366f47..03cd219e718 100644 --- a/app/assets/javascripts/repo/components/repo_file_buttons.vue +++ b/app/assets/javascripts/repo/components/repo_file_buttons.vue @@ -4,7 +4,9 @@ import Helper from '../helpers/repo_helper'; import RepoMixin from '../mixins/repo_mixin'; const RepoFileButtons = { - data: () => Store, + data() { + return Store; + }, mixins: [RepoMixin], diff --git a/app/assets/javascripts/repo/components/repo_file_options.vue b/app/assets/javascripts/repo/components/repo_file_options.vue deleted file mode 100644 index 6a15755f029..00000000000 --- a/app/assets/javascripts/repo/components/repo_file_options.vue +++ /dev/null @@ -1,25 +0,0 @@ -<script> -const RepoFileOptions = { - props: { - isMini: { - type: Boolean, - required: false, - default: false, - }, - projectName: { - type: String, - required: true, - }, - }, -}; - -export default RepoFileOptions; -</script> - -<template> - <tr v-if="isMini" class="repo-file-options"> - <td> - <span class="title">{{projectName}}</span> - </td> - </tr> -</template> diff --git a/app/assets/javascripts/repo/components/repo_loading_file.vue b/app/assets/javascripts/repo/components/repo_loading_file.vue index bc8c64c8362..832b45b2b29 100644 --- a/app/assets/javascripts/repo/components/repo_loading_file.vue +++ b/app/assets/javascripts/repo/components/repo_loading_file.vue @@ -1,43 +1,23 @@ <script> -const RepoLoadingFile = { - props: { - loading: { - type: Object, - required: false, - default: {}, - }, - hasFiles: { - type: Boolean, - required: false, - default: false, - }, - isMini: { - type: Boolean, - required: false, - default: false, - }, - }, - - computed: { - showGhostLines() { - return this.loading.tree && !this.hasFiles; - }, - }, + import repoMixin from '../mixins/repo_mixin'; - methods: { - lineOfCode(n) { - return `skeleton-line-${n}`; + export default { + mixins: [ + repoMixin, + ], + methods: { + lineOfCode(n) { + return `skeleton-line-${n}`; + }, }, - }, -}; - -export default RepoLoadingFile; + }; </script> <template> <tr - v-if="showGhostLines" - class="loading-file"> + class="loading-file" + aria-label="Loading files" + > <td> <div class="animation-container animation-container-small"> @@ -48,29 +28,28 @@ export default RepoLoadingFile; </div> </div> </td> - - <td - v-if="!isMini" - class="hidden-sm hidden-xs"> - <div class="animation-container"> - <div - v-for="n in 6" - :key="n" - :class="lineOfCode(n)"> + <template v-if="!isMini"> + <td + class="hidden-sm hidden-xs"> + <div class="animation-container"> + <div + v-for="n in 6" + :key="n" + :class="lineOfCode(n)"> + </div> </div> - </div> - </td> + </td> - <td - v-if="!isMini" - class="hidden-xs"> - <div class="animation-container animation-container-small"> - <div - v-for="n in 6" - :key="n" - :class="lineOfCode(n)"> + <td + class="hidden-xs"> + <div class="animation-container animation-container-small animation-container-right"> + <div + v-for="n in 6" + :key="n" + :class="lineOfCode(n)"> + </div> </div> - </div> - </td> + </td> + </template> </tr> </template> diff --git a/app/assets/javascripts/repo/components/repo_prev_directory.vue b/app/assets/javascripts/repo/components/repo_prev_directory.vue index bbdbdc61e38..c4bf6dcdec2 100644 --- a/app/assets/javascripts/repo/components/repo_prev_directory.vue +++ b/app/assets/javascripts/repo/components/repo_prev_directory.vue @@ -1,38 +1,38 @@ <script> -import RepoMixin from '../mixins/repo_mixin'; + import eventHub from '../event_hub'; + import repoMixin from '../mixins/repo_mixin'; -const RepoPreviousDirectory = { - props: { - prevUrl: { - type: String, - required: true, + export default { + mixins: [ + repoMixin, + ], + props: { + prevUrl: { + type: String, + required: true, + }, }, - }, - - mixins: [RepoMixin], - - computed: { - colSpanCondition() { - return this.isMini ? undefined : 3; + computed: { + colSpanCondition() { + return this.isMini ? undefined : 3; + }, }, - }, - - methods: { - linkClicked(file) { - this.$emit('linkclicked', file); + methods: { + linkClicked(file) { + eventHub.$emit('goToPreviousDirectoryClicked', file); + }, }, - }, -}; - -export default RepoPreviousDirectory; + }; </script> <template> -<tr class="prev-directory"> - <td - :colspan="colSpanCondition" - @click.prevent="linkClicked(prevUrl)"> - <a :href="prevUrl">..</a> - </td> -</tr> + <tr class="file prev-directory"> + <td + :colspan="colSpanCondition" + class="table-cell" + @click.prevent="linkClicked(prevUrl)" + > + <a :href="prevUrl">...</a> + </td> + </tr> </template> diff --git a/app/assets/javascripts/repo/components/repo_preview.vue b/app/assets/javascripts/repo/components/repo_preview.vue index a87bef6084a..b5be771d539 100644 --- a/app/assets/javascripts/repo/components/repo_preview.vue +++ b/app/assets/javascripts/repo/components/repo_preview.vue @@ -4,7 +4,9 @@ import Store from '../stores/repo_store'; export default { - data: () => Store, + data() { + return Store; + }, computed: { html() { return this.activeFile.html; diff --git a/app/assets/javascripts/repo/components/repo_sidebar.vue b/app/assets/javascripts/repo/components/repo_sidebar.vue index e0f3c33003a..5832e603907 100644 --- a/app/assets/javascripts/repo/components/repo_sidebar.vue +++ b/app/assets/javascripts/repo/components/repo_sidebar.vue @@ -1,9 +1,10 @@ <script> +import _ from 'underscore'; import Service from '../services/repo_service'; import Helper from '../helpers/repo_helper'; import Store from '../stores/repo_store'; +import eventHub from '../event_hub'; import RepoPreviousDirectory from './repo_prev_directory.vue'; -import RepoFileOptions from './repo_file_options.vue'; import RepoFile from './repo_file.vue'; import RepoLoadingFile from './repo_loading_file.vue'; import RepoMixin from '../mixins/repo_mixin'; @@ -11,21 +12,35 @@ import RepoMixin from '../mixins/repo_mixin'; export default { mixins: [RepoMixin], components: { - 'repo-file-options': RepoFileOptions, 'repo-previous-directory': RepoPreviousDirectory, 'repo-file': RepoFile, 'repo-loading-file': RepoLoadingFile, }, - created() { window.addEventListener('popstate', this.checkHistory); }, destroyed() { + eventHub.$off('fileNameClicked', this.fileClicked); + eventHub.$off('goToPreviousDirectoryClicked', this.goToPreviousDirectoryClicked); window.removeEventListener('popstate', this.checkHistory); }, + mounted() { + eventHub.$on('fileNameClicked', this.fileClicked); + eventHub.$on('goToPreviousDirectoryClicked', this.goToPreviousDirectoryClicked); + }, + data() { + return Store; + }, + computed: { + flattendFiles() { + const mapFiles = arr => (!arr.files.length ? [] : _.map(arr.files, a => [a, mapFiles(a)])); - data: () => Store, - + return _.chain(this.files) + .map(arr => [arr, mapFiles(arr)]) + .flatten() + .value(); + }, + }, methods: { checkHistory() { let selectedFile = this.files.find(file => location.pathname.indexOf(file.url) > -1); @@ -52,21 +67,21 @@ export default { }, fileClicked(clickedFile, lineNumber) { - let file = clickedFile; + const file = clickedFile; + if (file.loading) return; - file.loading = true; if (file.type === 'tree' && file.opened) { - file = Store.removeChildFilesOfTree(file); - file.loading = false; + Helper.setDirectoryToClosed(file); Store.setActiveLine(lineNumber); } else { const openFile = Helper.getFileFromPath(file.url); + if (openFile) { - file.loading = false; Store.setActiveFiles(openFile); Store.setActiveLine(lineNumber); } else { + file.loading = true; Service.url = file.url; Helper.getContent(file) .then(() => { @@ -81,7 +96,7 @@ export default { goToPreviousDirectoryClicked(prevURL) { Service.url = prevURL; - Helper.getContent(null) + Helper.getContent(null, true) .then(() => Helper.scrollTabsRight()) .catch(Helper.loadingError); }, @@ -92,38 +107,43 @@ export default { <template> <div id="sidebar" :class="{'sidebar-mini' : isMini}"> <table class="table"> - <thead v-if="!isMini"> + <thead> <tr> - <th class="name">Name</th> - <th class="hidden-sm hidden-xs last-commit">Last commit</th> - <th class="hidden-xs last-update text-right">Last update</th> + <th + v-if="isMini" + class="repo-file-options title" + > + <strong class="clgray"> + {{ projectName }} + </strong> + </th> + <template v-else> + <th class="name"> + Name + </th> + <th class="hidden-sm hidden-xs last-commit"> + Last commit + </th> + <th class="hidden-xs last-update text-right"> + Last update + </th> + </template> </tr> </thead> <tbody> - <repo-file-options - :is-mini="isMini" - :project-name="projectName" - /> <repo-previous-directory - v-if="isRoot" + v-if="!isRoot && !loading.tree" :prev-url="prevURL" - @linkclicked="goToPreviousDirectoryClicked(prevURL)"/> + /> <repo-loading-file + v-if="!flattendFiles.length && loading.tree" v-for="n in 5" :key="n" - :loading="loading" - :has-files="!!files.length" - :is-mini="isMini" /> <repo-file - v-for="file in files" + v-for="file in flattendFiles" :key="file.id" :file="file" - :is-mini="isMini" - @linkclicked="fileClicked(file)" - :is-tree="isTree" - :has-files="!!files.length" - :active-file="activeFile" /> </tbody> </table> diff --git a/app/assets/javascripts/repo/components/repo_tab.vue b/app/assets/javascripts/repo/components/repo_tab.vue index 0d0c34ec741..098715915b0 100644 --- a/app/assets/javascripts/repo/components/repo_tab.vue +++ b/app/assets/javascripts/repo/components/repo_tab.vue @@ -26,11 +26,13 @@ const RepoTab = { }, methods: { - tabClicked: Store.setActiveFiles, - + tabClicked(file) { + Store.setActiveFiles(file); + }, closeTab(file) { if (file.changed) return; - this.$emit('tabclosed', file); + + Store.removeFromOpenedFiles(file); }, }, }; @@ -39,25 +41,28 @@ export default RepoTab; </script> <template> -<li @click="tabClicked(tab)"> - <a - href="#0" - class="close" - @click.stop.prevent="closeTab(tab)" - :aria-label="closeLabel"> - <i - class="fa" - :class="changedClass" - aria-hidden="true"> - </i> - </a> + <li + :class="{ active : tab.active }" + @click="tabClicked(tab)" + > + <button + type="button" + class="close-btn" + @click.stop.prevent="closeTab(tab)" + :aria-label="closeLabel"> + <i + class="fa" + :class="changedClass" + aria-hidden="true"> + </i> + </button> - <a - href="#" - class="repo-tab" - :title="tab.url" - @click.prevent="tabClicked(tab)"> - {{tab.name}} - </a> -</li> + <a + href="#" + class="repo-tab" + :title="tab.url" + @click.prevent="tabClicked(tab)"> + {{tab.name}} + </a> + </li> </template> diff --git a/app/assets/javascripts/repo/components/repo_tabs.vue b/app/assets/javascripts/repo/components/repo_tabs.vue index 9c5bfc5d0cf..b57cd0960de 100644 --- a/app/assets/javascripts/repo/components/repo_tabs.vue +++ b/app/assets/javascripts/repo/components/repo_tabs.vue @@ -1,36 +1,29 @@ <script> -import Store from '../stores/repo_store'; -import RepoTab from './repo_tab.vue'; -import RepoMixin from '../mixins/repo_mixin'; + import Store from '../stores/repo_store'; + import RepoTab from './repo_tab.vue'; + import RepoMixin from '../mixins/repo_mixin'; -const RepoTabs = { - mixins: [RepoMixin], - - components: { - 'repo-tab': RepoTab, - }, - - data: () => Store, - - methods: { - tabClosed(file) { - Store.removeFromOpenedFiles(file); + export default { + mixins: [RepoMixin], + components: { + 'repo-tab': RepoTab, }, - }, -}; - -export default RepoTabs; + data() { + return Store; + }, + }; </script> <template> -<ul id="tabs"> - <repo-tab - v-for="tab in openedFiles" - :key="tab.id" - :tab="tab" - :class="{'active' : tab.active}" - @tabclosed="tabClosed" - /> - <li class="tabs-divider" /> -</ul> + <ul + id="tabs" + class="list-unstyled" + > + <repo-tab + v-for="tab in openedFiles" + :key="tab.id" + :tab="tab" + /> + <li class="tabs-divider" /> + </ul> </template> diff --git a/app/assets/javascripts/repo/event_hub.js b/app/assets/javascripts/repo/event_hub.js new file mode 100644 index 00000000000..0948c2e5352 --- /dev/null +++ b/app/assets/javascripts/repo/event_hub.js @@ -0,0 +1,3 @@ +import Vue from 'vue'; + +export default new Vue(); diff --git a/app/assets/javascripts/repo/helpers/repo_helper.js b/app/assets/javascripts/repo/helpers/repo_helper.js index 46204598e1d..dfaf9caaee7 100644 --- a/app/assets/javascripts/repo/helpers/repo_helper.js +++ b/app/assets/javascripts/repo/helpers/repo_helper.js @@ -1,3 +1,4 @@ +import { convertPermissionToBoolean } from '../../lib/utils/common_utils'; import Service from '../services/repo_service'; import Store from '../stores/repo_store'; import Flash from '../../flash'; @@ -25,10 +26,6 @@ const RepoHelper = { key: '', - isTree(data) { - return Object.hasOwnProperty.call(data, 'blobs'); - }, - Time: window.performance && window.performance.now ? window.performance @@ -58,13 +55,20 @@ const RepoHelper = { }, setDirectoryOpen(tree, title) { - const file = tree; - if (!file) return undefined; + if (!tree) return; + + Object.assign(tree, { + opened: true, + }); + + RepoHelper.updateHistoryEntry(tree.url, title); + }, - file.opened = true; - file.icon = 'fa-folder-open'; - RepoHelper.updateHistoryEntry(file.url, title); - return file; + setDirectoryToClosed(entry) { + Object.assign(entry, { + opened: false, + files: [], + }); }, isRenderable() { @@ -81,63 +85,23 @@ const RepoHelper = { .catch(RepoHelper.loadingError); }, - // when you open a directory you need to put the directory files under - // the directory... This will merge the list of the current directory and the new list. - getNewMergedList(inDirectory, currentList, newList) { - const newListSorted = newList.sort(this.compareFilesCaseInsensitive); - if (!inDirectory) return newListSorted; - const indexOfFile = currentList.findIndex(file => file.url === inDirectory.url); - if (!indexOfFile) return newListSorted; - return RepoHelper.mergeNewListToOldList(newListSorted, currentList, inDirectory, indexOfFile); - }, - - // within the get new merged list this does the merging of the current list of files - // and the new list of files. The files are never "in" another directory they just - // appear like they are because of the margin. - mergeNewListToOldList(newList, oldList, inDirectory, indexOfFile) { - newList.reverse().forEach((newFile) => { - const fileIndex = indexOfFile + 1; - const file = newFile; - file.level = inDirectory.level + 1; - oldList.splice(fileIndex, 0, file); - }); - - return oldList; - }, - - compareFilesCaseInsensitive(a, b) { - const aName = a.name.toLowerCase(); - const bName = b.name.toLowerCase(); - if (a.level > 0) return 0; - if (aName < bName) { return -1; } - if (aName > bName) { return 1; } - return 0; - }, + getContent(treeOrFile, emptyFiles = false) { + let file = treeOrFile; - isRoot(url) { - // the url we are requesting -> split by the project URL. Grab the right side. - const isRoot = !!url.split(Store.projectUrl)[1] - // remove the first "/" - .slice(1) - // split this by "/" - .split('/') - // remove the first two items of the array... usually /tree/master. - .slice(2) - // we want to know the length of the array. - // If greater than 0 not root. - .length; - return isRoot; - }, + if (!Store.files.length) { + Store.loading.tree = true; + } - getContent(treeOrFile) { - let file = treeOrFile; return Service.getContent() .then((response) => { const data = response.data; if (response.headers && response.headers['page-title']) data.pageTitle = response.headers['page-title']; + if (response.headers && response.headers['is-root'] && !Store.isInitialRoot) { + Store.isRoot = convertPermissionToBoolean(response.headers['is-root']); + Store.isInitialRoot = Store.isRoot; + } - Store.isTree = RepoHelper.isTree(data); - if (!Store.isTree) { + if (file && file.type === 'blob') { if (!file) file = data; Store.binary = data.binary; @@ -145,38 +109,40 @@ const RepoHelper = { // file might be undefined RepoHelper.setBinaryDataAsBase64(data); Store.setViewToPreview(); - } else if (!Store.isPreviewView()) { - if (!data.render_error) { - Service.getRaw(data.raw_path) - .then((rawResponse) => { - Store.blobRaw = rawResponse.data; - data.plain = rawResponse.data; - RepoHelper.setFile(data, file); - }).catch(RepoHelper.loadingError); - } + } else if (!Store.isPreviewView() && !data.render_error) { + Service.getRaw(data.raw_path) + .then((rawResponse) => { + Store.blobRaw = rawResponse.data; + data.plain = rawResponse.data; + RepoHelper.setFile(data, file); + }).catch(RepoHelper.loadingError); } if (Store.isPreviewView()) { RepoHelper.setFile(data, file); } + } else { + Store.loading.tree = false; + RepoHelper.setDirectoryOpen(file, data.pageTitle || data.name); - // if the file tree is empty - if (Store.files.length === 0) { - const parentURL = Service.blobURLtoParentTree(Service.url); - Service.url = parentURL; - RepoHelper.getContent(); + if (emptyFiles) { + Store.files = []; } - } else { - // it's a tree - if (!file) Store.isRoot = RepoHelper.isRoot(Service.url); - file = RepoHelper.setDirectoryOpen(file, data.pageTitle || data.name); - const newDirectory = RepoHelper.dataToListOfFiles(data); - Store.addFilesToDirectory(file, Store.files, newDirectory); + + this.addToDirectory(file, data); + Store.prevURL = Service.blobURLtoParentTree(Service.url); } }).catch(RepoHelper.loadingError); }, + addToDirectory(file, data) { + const tree = file || Store; + const files = tree.files.concat(this.dataToListOfFiles(data, file ? file.level + 1 : 0)); + + tree.files = files; + }, + setFile(data, file) { const newFile = data; newFile.url = file.url || Service.url; // Grab the URL from service, happens on page refresh. @@ -190,57 +156,39 @@ const RepoHelper = { Store.setActiveFiles(newFile); }, - serializeBlob(blob) { - const simpleBlob = RepoHelper.serializeRepoEntity('blob', blob); - simpleBlob.lastCommitMessage = blob.last_commit.message; - simpleBlob.lastCommitUpdate = blob.last_commit.committed_date; - simpleBlob.loading = false; - - return simpleBlob; - }, - - serializeTree(tree) { - return RepoHelper.serializeRepoEntity('tree', tree); - }, - - serializeSubmodule(submodule) { - return RepoHelper.serializeRepoEntity('submodule', submodule); - }, - - serializeRepoEntity(type, entity) { + serializeRepoEntity(type, entity, level = 0) { const { url, name, icon, last_commit } = entity; - const returnObj = { + + return { type, name, url, + level, icon: `fa-${icon}`, - level: 0, + files: [], loading: false, + opened: false, + // eslint-disable-next-line camelcase + lastCommit: last_commit ? { + url: `${Store.projectUrl}/commit/${last_commit.id}`, + message: last_commit.message, + updatedAt: last_commit.committed_date, + } : {}, }; - - if (entity.last_commit) { - returnObj.lastCommitUrl = `${Store.projectUrl}/commit/${last_commit.id}`; - } else { - returnObj.lastCommitUrl = ''; - } - return returnObj; }, scrollTabsRight() { - // wait for the transition. 0.1 seconds. - setTimeout(() => { - const tabs = document.getElementById('tabs'); - if (!tabs) return; - tabs.scrollLeft = tabs.scrollWidth; - }, 200); + const tabs = document.getElementById('tabs'); + if (!tabs) return; + tabs.scrollLeft = tabs.scrollWidth; }, - dataToListOfFiles(data) { + dataToListOfFiles(data, level) { const { blobs, trees, submodules } = data; return [ - ...blobs.map(blob => RepoHelper.serializeBlob(blob)), - ...trees.map(tree => RepoHelper.serializeTree(tree)), - ...submodules.map(submodule => RepoHelper.serializeSubmodule(submodule)), + ...trees.map(tree => RepoHelper.serializeRepoEntity('tree', tree, level)), + ...submodules.map(submodule => RepoHelper.serializeRepoEntity('submodule', submodule, level)), + ...blobs.map(blob => RepoHelper.serializeRepoEntity('blob', blob, level)), ]; }, diff --git a/app/assets/javascripts/repo/index.js b/app/assets/javascripts/repo/index.js index 1a09f411b22..65dee7d5fd1 100644 --- a/app/assets/javascripts/repo/index.js +++ b/app/assets/javascripts/repo/index.js @@ -1,5 +1,6 @@ import $ from 'jquery'; import Vue from 'vue'; +import { convertPermissionToBoolean } from '../lib/utils/common_utils'; import Service from './services/repo_service'; import Store from './stores/repo_store'; import Repo from './components/repo.vue'; @@ -33,6 +34,8 @@ function setInitialStore(data) { Store.onTopOfBranch = data.onTopOfBranch; Store.newMrTemplateUrl = decodeURIComponent(data.newMrTemplateUrl); Store.customBranchURL = decodeURIComponent(data.blobUrl); + Store.isRoot = convertPermissionToBoolean(data.root); + Store.isInitialRoot = convertPermissionToBoolean(data.root); Store.currentBranch = $('button.dropdown-menu-toggle').attr('data-ref'); Store.checkIsCommitable(); Store.setBranchHash(); diff --git a/app/assets/javascripts/repo/stores/repo_store.js b/app/assets/javascripts/repo/stores/repo_store.js index f8d29af7ffe..49d7317a17e 100644 --- a/app/assets/javascripts/repo/stores/repo_store.js +++ b/app/assets/javascripts/repo/stores/repo_store.js @@ -2,14 +2,13 @@ import Helper from '../helpers/repo_helper'; import Service from '../services/repo_service'; const RepoStore = { - monaco: {}, monacoLoading: false, service: '', canCommit: false, onTopOfBranch: false, editMode: false, - isTree: false, - isRoot: false, + isRoot: null, + isInitialRoot: null, prevURL: '', projectId: '', projectName: '', @@ -39,23 +38,11 @@ const RepoStore = { newMrTemplateUrl: '', branchChanged: false, commitMessage: '', - binaryTypes: { - png: false, - md: false, - svg: false, - unknown: false, - }, loading: { tree: false, blob: false, }, - resetBinaryTypes() { - Object.keys(RepoStore.binaryTypes).forEach((key) => { - RepoStore.binaryTypes[key] = false; - }); - }, - setBranchHash() { return Service.getBranch() .then((data) => { @@ -72,10 +59,6 @@ const RepoStore = { RepoStore.isCommitable = RepoStore.onTopOfBranch && RepoStore.canCommit; }, - addFilesToDirectory(inDirectory, currentList, newList) { - RepoStore.files = Helper.getNewMergedList(inDirectory, currentList, newList); - }, - toggleRawPreview() { RepoStore.activeFile.raw = !RepoStore.activeFile.raw; RepoStore.activeFileLabel = RepoStore.activeFile.raw ? 'Display rendered file' : 'Display source'; @@ -129,30 +112,6 @@ const RepoStore = { RepoStore.activeFileLabel = 'Display source'; }, - removeChildFilesOfTree(tree) { - let foundTree = false; - const treeToClose = tree; - let canStopSearching = false; - RepoStore.files = RepoStore.files.filter((file) => { - const isItTheTreeWeWant = file.url === treeToClose.url; - // if it's the next tree - if (foundTree && file.type === 'tree' && !isItTheTreeWeWant && file.level === treeToClose.level) { - canStopSearching = true; - return true; - } - if (canStopSearching) return true; - - if (isItTheTreeWeWant) foundTree = true; - - if (foundTree) return file.level <= treeToClose.level; - return true; - }); - - treeToClose.opened = false; - treeToClose.icon = 'fa-folder'; - return treeToClose; - }, - removeFromOpenedFiles(file) { if (file.type === 'tree') return; let foundIndex; @@ -186,6 +145,7 @@ const RepoStore = { if (openedFilesAlreadyExists) return; openFile.changed = false; + openFile.active = true; RepoStore.openedFiles.push(openFile); }, diff --git a/app/assets/javascripts/vue_shared/components/user_avatar/user_avatar_image.vue b/app/assets/javascripts/vue_shared/components/user_avatar/user_avatar_image.vue index dd9a2ebb184..1ac61a3c39b 100644 --- a/app/assets/javascripts/vue_shared/components/user_avatar/user_avatar_image.vue +++ b/app/assets/javascripts/vue_shared/components/user_avatar/user_avatar_image.vue @@ -7,6 +7,7 @@ Sample configuration: <user-avatar-image + :lazy="true" :img-src="userAvatarSrc" :img-alt="tooltipText" :tooltip-text="tooltipText" @@ -16,11 +17,17 @@ */ import defaultAvatarUrl from 'images/no_avatar.png'; +import { placeholderImage } from '../../../lazy_loader'; import tooltip from '../../directives/tooltip'; export default { name: 'UserAvatarImage', props: { + lazy: { + type: Boolean, + required: false, + default: false, + }, imgSrc: { type: String, required: false, @@ -56,18 +63,21 @@ export default { tooltip, }, computed: { + // API response sends null when gravatar is disabled and + // we provide an empty string when we use it inside user avatar link. + // In both cases we should render the defaultAvatarUrl + sanitizedSource() { + return this.imgSrc === '' || this.imgSrc === null ? defaultAvatarUrl : this.imgSrc; + }, + resultantSrcAttribute() { + return this.lazy ? placeholderImage : this.sanitizedSource; + }, tooltipContainer() { return this.tooltipText ? 'body' : null; }, avatarSizeClass() { return `s${this.size}`; }, - // API response sends null when gravatar is disabled and - // we provide an empty string when we use it inside user avatar link. - // In both cases we should render the defaultAvatarUrl - imageSource() { - return this.imgSrc === '' || this.imgSrc === null ? defaultAvatarUrl : this.imgSrc; - }, }, }; </script> @@ -76,11 +86,16 @@ export default { <img v-tooltip class="avatar" - :class="[avatarSizeClass, cssClasses]" - :src="imageSource" + :class="{ + lazy, + [avatarSizeClass]: true, + [cssClasses]: true + }" + :src="resultantSrcAttribute" :width="size" :height="size" :alt="imgAlt" + :data-src="sanitizedSource" :data-container="tooltipContainer" :data-placement="tooltipPlacement" :title="tooltipText" diff --git a/app/assets/stylesheets/framework/animations.scss b/app/assets/stylesheets/framework/animations.scss index f0e6b23757f..374988bb590 100644 --- a/app/assets/stylesheets/framework/animations.scss +++ b/app/assets/stylesheets/framework/animations.scss @@ -198,6 +198,13 @@ a { height: 12px; } + &.animation-container-right { + .skeleton-line-2 { + left: 0; + right: 150px; + } + } + &::before { animation-duration: 1s; animation-fill-mode: forwards; diff --git a/app/assets/stylesheets/framework/new-sidebar.scss b/app/assets/stylesheets/framework/new-sidebar.scss index 78972717932..17fa31c450d 100644 --- a/app/assets/stylesheets/framework/new-sidebar.scss +++ b/app/assets/stylesheets/framework/new-sidebar.scss @@ -466,7 +466,7 @@ $new-sidebar-collapsed-width: 50px; @media (max-width: $screen-xs-max) { + .breadcrumbs-links { - padding-left: 17px; + padding-left: $gl-padding; border-left: 1px solid $gl-text-color-quaternary; } } diff --git a/app/assets/stylesheets/pages/clusters.scss b/app/assets/stylesheets/pages/clusters.scss index 5538e46a6c4..8d6f30e3b84 100644 --- a/app/assets/stylesheets/pages/clusters.scss +++ b/app/assets/stylesheets/pages/clusters.scss @@ -4,6 +4,6 @@ } .alert-block { - margin-bottom: 20px; + margin-bottom: 10px; } } diff --git a/app/assets/stylesheets/pages/issuable.scss b/app/assets/stylesheets/pages/issuable.scss index c93c4e93af5..48532503263 100644 --- a/app/assets/stylesheets/pages/issuable.scss +++ b/app/assets/stylesheets/pages/issuable.scss @@ -72,12 +72,22 @@ } } + .title-container { + display: flex; + } + .title { padding: 0; margin-bottom: 16px; border-bottom: none; } + .btn-edit { + margin-left: auto; + // Set height to match title height + height: 2em; + } + // Border around images in issue and MR descriptions. .description img:not(.emoji) { border: 1px solid $white-normal; diff --git a/app/assets/stylesheets/pages/notes.scss b/app/assets/stylesheets/pages/notes.scss index 96b7db3b85d..ebad429c2ba 100644 --- a/app/assets/stylesheets/pages/notes.scss +++ b/app/assets/stylesheets/pages/notes.scss @@ -531,14 +531,13 @@ ul.notes { padding: 0; min-width: 16px; color: $gray-darkest; + fill: $gray-darkest; .fa { position: relative; font-size: 16px; } - - svg { height: 16px; width: 16px; @@ -566,6 +565,7 @@ ul.notes { .link-highlight { color: $gl-link-color; + fill: $gl-link-color; svg { fill: $gl-link-color; diff --git a/app/assets/stylesheets/pages/repo.scss b/app/assets/stylesheets/pages/repo.scss index c36fe25f74d..ea37ccf5e3d 100644 --- a/app/assets/stylesheets/pages/repo.scss +++ b/app/assets/stylesheets/pages/repo.scss @@ -153,28 +153,13 @@ overflow-x: auto; li { - animation: swipeRightAppear ease-in 0.1s; - animation-iteration-count: 1; - transform-origin: 0% 50%; - list-style-type: none; + position: relative; background: $gray-normal; - display: inline-block; padding: #{$gl-padding / 2} $gl-padding; border-right: 1px solid $white-dark; border-bottom: 1px solid $white-dark; - white-space: nowrap; cursor: pointer; - &.remove { - animation: swipeRightDissapear ease-in 0.1s; - animation-iteration-count: 1; - transform-origin: 0% 50%; - - a { - width: 0; - } - } - &.active { background: $white-light; border-bottom: none; @@ -182,17 +167,21 @@ a { @include str-truncated(100px); - color: $black; + color: $gl-text-color; vertical-align: middle; text-decoration: none; margin-right: 12px; + } - &.close { - width: auto; - font-size: 15px; - opacity: 1; - margin-right: -6px; - } + .close-btn { + position: absolute; + right: 8px; + top: 50%; + padding: 0; + background: none; + border: 0; + font-size: $gl-font-size; + transform: translateY(-50%); } .close-icon:hover { @@ -201,9 +190,6 @@ .close-icon, .unsaved-icon { - float: right; - margin-top: 3px; - margin-left: 15px; color: $gray-darkest; } @@ -222,9 +208,7 @@ #repo-file-buttons { background-color: $white-light; - border-bottom: 1px solid $white-normal; padding: 5px 10px; - position: relative; border-top: 1px solid $white-normal; } @@ -287,37 +271,23 @@ overflow: auto; } - table { + .table { margin-bottom: 0; } tr { - animation: fadein 0.5s; - cursor: pointer; - - &.repo-file-options td { - padding: 0; - border-top: none; - background: $gray-light; + .repo-file-options { + padding: 2px 16px; width: 100%; - display: inline-block; - - &:first-child { - border-top-left-radius: 2px; - } + } - .title { - display: inline-block; - font-size: 10px; - text-transform: uppercase; - font-weight: $gl-font-weight-bold; - color: $gray-darkest; - white-space: nowrap; - overflow: hidden; - text-overflow: ellipsis; - vertical-align: middle; - padding: 2px 16px; - } + .title { + font-size: 10px; + text-transform: uppercase; + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; + vertical-align: middle; } .file-icon { @@ -329,11 +299,13 @@ } } + .file { + cursor: pointer; + } + a { @include str-truncated(250px); color: $almost-black; - display: inline-block; - vertical-align: middle; } } } diff --git a/app/controllers/projects/application_controller.rb b/app/controllers/projects/application_controller.rb index d7dd8ddcb7d..9e79852e378 100644 --- a/app/controllers/projects/application_controller.rb +++ b/app/controllers/projects/application_controller.rb @@ -2,7 +2,6 @@ class Projects::ApplicationController < ApplicationController include RoutableActions skip_before_action :authenticate_user! - before_action :redirect_git_extension before_action :project before_action :repository layout 'project' @@ -11,15 +10,6 @@ class Projects::ApplicationController < ApplicationController private - def redirect_git_extension - # Redirect from - # localhost/group/project.git - # to - # localhost/group/project - # - redirect_to url_for(params.merge(format: nil)) if params[:format] == 'git' - end - def project return @project if @project return nil unless params[:project_id] || params[:id] diff --git a/app/controllers/projects/tree_controller.rb b/app/controllers/projects/tree_controller.rb index f3719059f88..756f7e5df8c 100644 --- a/app/controllers/projects/tree_controller.rb +++ b/app/controllers/projects/tree_controller.rb @@ -36,6 +36,7 @@ class Projects::TreeController < Projects::ApplicationController format.json do page_title @path.presence || _("Files"), @ref, @project.name_with_namespace + response.header['is-root'] = @path.empty? # n+1: https://gitlab.com/gitlab-org/gitlab-ce/issues/38261 Gitlab::GitalyClient.allow_n_plus_1_calls do diff --git a/app/controllers/projects_controller.rb b/app/controllers/projects_controller.rb index e90b75672ae..db543d688a0 100644 --- a/app/controllers/projects_controller.rb +++ b/app/controllers/projects_controller.rb @@ -4,6 +4,7 @@ class ProjectsController < Projects::ApplicationController include PreviewMarkdown before_action :authenticate_user!, except: [:index, :show, :activity, :refs] + before_action :redirect_git_extension, only: [:show] before_action :project, except: [:index, :new, :create] before_action :repository, except: [:index, :new, :create] before_action :assign_ref_vars, only: [:show], if: :repo_exists? @@ -125,7 +126,7 @@ class ProjectsController < Projects::ApplicationController return access_denied! unless can?(current_user, :remove_project, @project) ::Projects::DestroyService.new(@project, current_user, {}).async_execute - flash[:alert] = _("Project '%{project_name}' will be deleted.") % { project_name: @project.name_with_namespace } + flash[:notice] = _("Project '%{project_name}' is in the process of being deleted.") % { project_name: @project.name_with_namespace } redirect_to dashboard_projects_path, status: 302 rescue Projects::DestroyService::DestroyError => ex @@ -389,4 +390,13 @@ class ProjectsController < Projects::ApplicationController def project_export_enabled render_404 unless current_application_settings.project_export_enabled? end + + def redirect_git_extension + # Redirect from + # localhost/group/project.git + # to + # localhost/group/project + # + redirect_to request.original_url.sub(/\.git\/?\Z/, '') if params[:format] == 'git' + end end diff --git a/app/helpers/preferences_helper.rb b/app/helpers/preferences_helper.rb index 0d7347ed30d..8e822ed0ea2 100644 --- a/app/helpers/preferences_helper.rb +++ b/app/helpers/preferences_helper.rb @@ -36,7 +36,8 @@ module PreferencesHelper def project_view_choices [ ['Files and Readme (default)', :files], - ['Activity', :activity] + ['Activity', :activity], + ['Readme', :readme] ] end diff --git a/app/models/application_setting.rb b/app/models/application_setting.rb index a93b777a9bc..d3b8debb0fd 100644 --- a/app/models/application_setting.rb +++ b/app/models/application_setting.rb @@ -33,6 +33,8 @@ class ApplicationSetting < ActiveRecord::Base attr_accessor :domain_whitelist_raw, :domain_blacklist_raw + default_value_for :id, 1 + validates :uuid, presence: true validates :session_expire_delay, diff --git a/app/models/concerns/storage/legacy_namespace.rb b/app/models/concerns/storage/legacy_namespace.rb index 5ab5c80a2f5..b3020484738 100644 --- a/app/models/concerns/storage/legacy_namespace.rb +++ b/app/models/concerns/storage/legacy_namespace.rb @@ -7,6 +7,8 @@ module Storage raise Gitlab::UpdatePathError.new('Namespace cannot be moved, because at least one project has tags in container registry') end + expires_full_path_cache + # Move the namespace directory in all storage paths used by member projects repository_storage_paths.each do |repository_storage_path| # Ensure old directory exists before moving it diff --git a/app/models/note.rb b/app/models/note.rb index ceded9f2aef..8939e590ef1 100644 --- a/app/models/note.rb +++ b/app/models/note.rb @@ -169,7 +169,7 @@ class Note < ActiveRecord::Base end def cross_reference? - system? && SystemNoteService.cross_reference?(note) + system? && matches_cross_reference_regex? end def diff_note? diff --git a/app/models/project.rb b/app/models/project.rb index 6e1cf9e31ee..4689b588906 100644 --- a/app/models/project.rb +++ b/app/models/project.rb @@ -1272,7 +1272,7 @@ class Project < ActiveRecord::Base # self.forked_from_project will be nil before the project is saved, so # we need to go through the relation - original_project = forked_project_link.forked_from_project + original_project = forked_project_link&.forked_from_project return true unless original_project level <= original_project.visibility_level diff --git a/app/models/user.rb b/app/models/user.rb index 533a776bc65..9459b6d4fa4 100644 --- a/app/models/user.rb +++ b/app/models/user.rb @@ -182,13 +182,8 @@ class User < ActiveRecord::Base enum dashboard: [:projects, :stars, :project_activity, :starred_project_activity, :groups, :todos] # User's Project preference - # - # Note: When adding an option, it MUST go on the end of the hash with a - # number higher than the current max. We cannot move options and/or change - # their numbers. - # - # We skip 0 because this was used by an option that has since been removed. - enum project_view: { activity: 1, files: 2 } + # Note: When adding an option, it MUST go on the end of the array. + enum project_view: [:readme, :activity, :files] alias_attribute :private_token, :authentication_token diff --git a/app/serializers/container_tag_entity.rb b/app/serializers/container_tag_entity.rb index ec1fc349586..26a68c43807 100644 --- a/app/serializers/container_tag_entity.rb +++ b/app/serializers/container_tag_entity.rb @@ -1,7 +1,7 @@ class ContainerTagEntity < Grape::Entity include RequestAwareEntity - expose :name, :location, :revision, :total_size, :created_at + expose :name, :location, :revision, :short_revision, :total_size, :created_at expose :destroy_path, if: -> (*) { can_destroy? } do |tag| project_registry_repository_tag_path(project, tag.repository, tag.name, format: :json) diff --git a/app/services/projects/unlink_fork_service.rb b/app/services/projects/unlink_fork_service.rb index abe414d0c05..2b82e5732e4 100644 --- a/app/services/projects/unlink_fork_service.rb +++ b/app/services/projects/unlink_fork_service.rb @@ -15,8 +15,8 @@ module Projects refresh_forks_count(@project.forked_from_project) - @project.forked_project_link.destroy @project.fork_network_member.destroy + @project.forked_project_link.destroy end def refresh_forks_count(project) diff --git a/app/services/system_note_service.rb b/app/services/system_note_service.rb index 0bce20ae5b7..69bd19c1977 100644 --- a/app/services/system_note_service.rb +++ b/app/services/system_note_service.rb @@ -162,7 +162,6 @@ module SystemNoteService # "changed time estimate to 3d 5h" # # Returns the created Note object - def change_time_estimate(noteable, project, author) parsed_time = Gitlab::TimeTrackingFormatter.output(noteable.time_estimate) body = if noteable.time_estimate == 0 @@ -188,7 +187,6 @@ module SystemNoteService # "added 2h 30m of time spent" # # Returns the created Note object - def change_time_spent(noteable, project, author) time_spent = noteable.time_spent @@ -453,10 +451,6 @@ module SystemNoteService end end - def cross_reference?(note_text) - note_text =~ /\A#{cross_reference_note_prefix}/i - end - # Check if a cross-reference is disallowed # # This method prevents adding a "mentioned in !1" note on every single commit @@ -486,7 +480,6 @@ module SystemNoteService # mentioner - Mentionable object # # Returns Boolean - def cross_reference_exists?(noteable, mentioner) # Initial scope should be system notes of this noteable type notes = Note.system.where(noteable_type: noteable.class) diff --git a/app/views/discussions/_parallel_diff_discussion.html.haml b/app/views/discussions/_parallel_diff_discussion.html.haml index 253cd336882..079d9083dff 100644 --- a/app/views/discussions/_parallel_diff_discussion.html.haml +++ b/app/views/discussions/_parallel_diff_discussion.html.haml @@ -4,7 +4,7 @@ %td.notes_line.old %td.notes_content.parallel.old .content{ class: ('hide' unless discussions_left.any?(&:expanded?)) } - = render partial: "discussions/notes", collection: discussions_left, as: :discussion, line_type: 'old' + = render partial: "discussions/notes", collection: discussions_left, as: :discussion, line_type: 'old', locals: { disable_collapse_class: true } - else %td.notes_line.old= ("") %td.notes_content.parallel.old @@ -14,7 +14,7 @@ %td.notes_line.new %td.notes_content.parallel.new .content{ class: ('hide' unless discussions_right.any?(&:expanded?)) } - = render partial: "discussions/notes", collection: discussions_right, as: :discussion, line_type: 'new' + = render partial: "discussions/notes", collection: discussions_right, as: :discussion, line_type: 'new', locals: { disable_collapse_class: true } - else %td.notes_line.new= ("") %td.notes_content.parallel.new diff --git a/app/views/projects/_readme.html.haml b/app/views/projects/_readme.html.haml new file mode 100644 index 00000000000..44aa9eb3826 --- /dev/null +++ b/app/views/projects/_readme.html.haml @@ -0,0 +1,23 @@ +- if (readme = @repository.readme) && readme.rich_viewer + %article.file-holder.readme-holder{ id: 'readme', class: ("limited-width-container" unless fluid_layout) } + .js-file-title.file-title + = blob_icon readme.mode, readme.name + = link_to project_blob_path(@project, tree_join(@ref, readme.path)) do + %strong + = readme.name + = render 'projects/blob/viewer', viewer: readme.rich_viewer, viewer_url: namespace_project_blob_path(@project.namespace, @project, tree_join(@ref, readme.path), viewer: :rich, format: :json) + +- else + .row-content-block.second-block.center + %h3.page-title + This project does not have a README yet + - if can?(current_user, :push_code, @project) + %p + A + %code README + file contains information about other files in a repository and is commonly + distributed with computer software, forming part of its documentation. + %p + We recommend you to + = link_to "add a README", add_special_file_path(@project, file_name: 'README.md'), class: 'underlined-link' + file to the repository and GitLab will render it here instead of this message. diff --git a/app/views/projects/clusters/_advanced_settings.html.haml b/app/views/projects/clusters/_advanced_settings.html.haml new file mode 100644 index 00000000000..6c162481dd8 --- /dev/null +++ b/app/views/projects/clusters/_advanced_settings.html.haml @@ -0,0 +1,14 @@ +- if can?(current_user, :admin_cluster, @cluster) + .append-bottom-20 + %label.append-bottom-10 + = s_('ClusterIntegration|Google Container Engine') + %p + - link_gke = link_to(s_('ClusterIntegration|Google Container Engine'), @cluster.gke_cluster_url, target: '_blank', rel: 'noopener noreferrer') + = s_('ClusterIntegration|Manage your cluster by visiting %{link_gke}').html_safe % { link_gke: link_gke } + + .well.form-group + %label.text-danger + = s_('ClusterIntegration|Remove cluster integration') + %p + = s_('ClusterIntegration|Removing cluster integration will remove the cluster configuration you have added to this project. It will not delete your project.') + = link_to(s_('ClusterIntegration|Remove integration'), namespace_project_cluster_path(@project.namespace, @project, @cluster.id), method: :delete, class: 'btn btn-danger', data: { confirm: "Are you sure you want to remove cluster integration from this project? This will not delete your cluster on Google Container Engine"}) diff --git a/app/views/projects/clusters/login.html.haml b/app/views/projects/clusters/login.html.haml index ae132672b7e..fde030b500b 100644 --- a/app/views/projects/clusters/login.html.haml +++ b/app/views/projects/clusters/login.html.haml @@ -10,7 +10,7 @@ .col-sm-8.col-sm-offset-4.signin-with-google - if @authorize_url = link_to @authorize_url do - = image_tag('auth_buttons/signin_with_google.png') + = image_tag('auth_buttons/signin_with_google.png', width: '191px') - else - link = link_to(s_('ClusterIntegration|properly configured'), help_page_path("integration/google"), target: '_blank', rel: 'noopener noreferrer') = s_('Google authentication is not %{link_to_documentation}. Ask your GitLab administrator if you want to use this service.').html_safe % { link_to_documentation: link } diff --git a/app/views/projects/clusters/show.html.haml b/app/views/projects/clusters/show.html.haml index aee6f904a62..ff76abc3553 100644 --- a/app/views/projects/clusters/show.html.haml +++ b/app/views/projects/clusters/show.html.haml @@ -1,24 +1,37 @@ +- @content_class = "limit-container-width" unless fluid_layout - breadcrumb_title "Cluster" - page_title _("Cluster") +- expanded = Rails.env.test? + - status_path = status_namespace_project_cluster_path(@cluster.project.namespace, @cluster.project, @cluster.id, format: :json) if can?(current_user, :admin_cluster, @cluster) && @cluster.on_creation? -.row.prepend-top-default.edit-cluster-form.js-edit-cluster-form{ data: { status_path: status_path, +.edit-cluster-form.js-edit-cluster-form{ data: { status_path: status_path, toggle_status: @cluster.enabled? ? 'true': 'false', cluster_status: @cluster.status_name, cluster_status_reason: @cluster.status_reason } } - .col-sm-4 - = render 'sidebar' - .col-sm-8 - %label.append-bottom-10{ for: 'enable-cluster-integration' } - = s_('ClusterIntegration|Enable cluster integration') - %p - - if @cluster.enabled? - - if can?(current_user, :update_cluster, @cluster) - = s_('ClusterIntegration|Cluster integration is enabled for this project. Disabling this integration will not affect your cluster, it will only temporarily turn off GitLab\'s connection to it.') + + %section.settings + %h4= s_('ClusterIntegration|Enable cluster integration') + .settings-content.expanded + + .hidden.js-cluster-error.alert.alert-danger.alert-block.append-bottom-10{ role: 'alert' } + = s_('ClusterIntegration|Something went wrong while creating your cluster on Google Container Engine') + %p.js-error-reason + + .hidden.js-cluster-creating.alert.alert-info.alert-block.append-bottom-10{ role: 'alert' } + = s_('ClusterIntegration|Cluster is being created on Google Container Engine...') + + .hidden.js-cluster-success.alert.alert-success.alert-block.append-bottom-10{ role: 'alert' } + = s_('ClusterIntegration|Cluster was successfully created on Google Container Engine') + + %p + - if @cluster.enabled? + - if can?(current_user, :update_cluster, @cluster) + = s_('ClusterIntegration|Cluster integration is enabled for this project. Disabling this integration will not affect your cluster, it will only temporarily turn off GitLab\'s connection to it.') + - else + = s_('ClusterIntegration|Cluster integration is enabled for this project.') - else - = s_('ClusterIntegration|Cluster integration is enabled for this project.') - - else - = s_('ClusterIntegration|Cluster integration is disabled for this project.') + = s_('ClusterIntegration|Cluster integration is disabled for this project.') = form_for [@project.namespace.becomes(Namespace), @project, @cluster] do |field| = form_errors(@cluster) @@ -36,35 +49,28 @@ .form-group = field.submit s_('ClusterIntegration|Save'), class: 'btn btn-success' - - if can?(current_user, :admin_cluster, @cluster) - %label.append-bottom-10{ for: 'google-container-engine' } - = s_('ClusterIntegration|Google Container Engine') - %p - - link_gke = link_to(s_('ClusterIntegration|Google Container Engine'), @cluster.gke_cluster_url, target: '_blank', rel: 'noopener noreferrer') - = s_('ClusterIntegration|Manage your cluster by visiting %{link_gke}').html_safe % { link_gke: link_gke } + %section.settings#js-cluster-details + .settings-header + %h4= s_('ClusterIntegration|Cluster details') + %button.btn.js-settings-toggle + = expanded ? 'Collapse' : 'Expand' + %p= s_('ClusterIntegration|See and edit the details for your cluster') - .hidden.js-cluster-error.alert.alert-danger.alert-block{ role: 'alert' } - = s_('ClusterIntegration|Something went wrong while creating your cluster on Google Container Engine') - %p.js-error-reason - - .hidden.js-cluster-creating.alert.alert-info.alert-block{ role: 'alert' } - = s_('ClusterIntegration|Cluster is being created on Google Container Engine...') - - .hidden.js-cluster-success.alert.alert-success.alert-block{ role: 'alert' } - = s_('ClusterIntegration|Cluster was successfully created on Google Container Engine') + .settings-content.no-animate{ class: ('expanded' if expanded) } - .form_group.append-bottom-20 - %label.append-bottom-10{ for: 'cluter-name' } - = s_('ClusterIntegration|Cluster name') - .input-group - %input.form-control.cluster-name{ value: @cluster.gcp_cluster_name, disabled: true } - %span.input-group-addon.clipboard-addon - = clipboard_button(text: @cluster.gcp_cluster_name, title: s_('ClusterIntegration|Copy cluster name')) + .form_group.append-bottom-20 + %label.append-bottom-10{ for: 'cluter-name' } + = s_('ClusterIntegration|Cluster name') + .input-group + %input.form-control.cluster-name{ value: @cluster.gcp_cluster_name, disabled: true } + %span.input-group-addon.clipboard-addon + = clipboard_button(text: @cluster.gcp_cluster_name, title: s_('ClusterIntegration|Copy cluster name')) - - if can?(current_user, :admin_cluster, @cluster) - .well.form_group - %label.text-danger - = s_('ClusterIntegration|Remove cluster integration') - %p - = s_('ClusterIntegration|Removing cluster integration will remove the cluster configuration you have added to this project. It will not delete your project.') - = link_to(s_('ClusterIntegration|Remove integration'), namespace_project_cluster_path(@project.namespace, @project, @cluster.id), method: :delete, class: 'btn btn-danger', data: { confirm: "Are you sure you want to remove cluster integration from this project? This will not delete your cluster on Google Container Engine"}) + %section.settings#js-cluster-advanced-settings + .settings-header + %h4= s_('ClusterIntegration|Advanced settings') + %button.btn.js-settings-toggle + = expanded ? 'Collapse' : 'Expand' + %p= s_('ClusterIntegration|Manage Cluster integration on your GitLab project') + .settings-content.no-animate{ class: ('expanded' if expanded) } + = render 'advanced_settings' diff --git a/app/views/shared/repo/_repo.html.haml b/app/views/shared/repo/_repo.html.haml index 919f19f2c23..7185f5bcc5b 100644 --- a/app/views/shared/repo/_repo.html.haml +++ b/app/views/shared/repo/_repo.html.haml @@ -1,4 +1,5 @@ -#repo{ data: { url: content_url, +#repo{ data: { root: @path.empty?.to_s, + url: content_url, project_name: project.name, refs_url: refs_project_path(project, format: :json), project_url: project_path(project), |