BigW Consortium Gitlab

Skip to content

G
gitlab-ce
Unverified Commit 349d0668 by Filipa Lacerda
Options

Fix more eslint rules

parent e2b759a2
Showing with 402 additions and 353 deletions
app/assets/javascripts/clusters/components/application_row.vue
......@@ -71,7 +71,8 @@
// Avoid the potential for the real-time data to say APPLICATION_INSTALLABLE but
// we already made a request to install and are just waiting for the real-time
// to sync up.
return (this.status !== APPLICATION_INSTALLABLE && this.status !== APPLICATION_ERROR) ||
return (this.status !== APPLICATION_INSTALLABLE
&& this.status !== APPLICATION_ERROR) ||
this.requestStatus === REQUEST_LOADING ||
this.requestStatus === REQUEST_SUCCESS;
},
......@@ -83,7 +84,8 @@
this.status === APPLICATION_ERROR
) {
label = s__('ClusterIntegration|Install');
} else if (this.status === APPLICATION_SCHEDULED || this.status === APPLICATION_INSTALLING) {
} else if (this.status === APPLICATION_SCHEDULED ||
this.status === APPLICATION_INSTALLING) {
label = s__('ClusterIntegration|Installing');
} else if (this.status === APPLICATION_INSTALLED) {
label = s__('ClusterIntegration|Installed');
......@@ -92,7 +94,8 @@
return label;
},
hasError() {
return this.status === APPLICATION_ERROR || this.requestStatus === REQUEST_FAILURE;
return this.status === APPLICATION_ERROR ||
this.requestStatus === REQUEST_FAILURE;
},
generalErrorDescription() {
return sprintf(
......
app/assets/javascripts/cycle_analytics/components/banner.vue
......@@ -43,7 +43,8 @@
{{ __('Introducing Cycle Analytics') }}
</h4>
<p>
{{ __('Cycle Analytics gives an overview of how much time it takes to go from idea to production in your project.') }}
{{ __(`Cycle Analytics gives an overview
of how much time it takes to go from idea to production in your project.`) }}
</p>
<p>
<a
......
app/assets/javascripts/cycle_analytics/components/total_time_component.vue
......@@ -45,5 +45,5 @@
<template v-else>
--
</template>
</span>
</span>
</template>
app/assets/javascripts/environments/components/empty_state.vue
......@@ -24,7 +24,8 @@
{{ s__("Environments|You don't have any environments right now.") }}
</h2>
<p class="blank-state-text">
{{ s__("Environments|Environments are places where code gets deployed, such as staging or production.") }}
{{ s__(`Environments|Environments are places where
code gets deployed, such as staging or production.`) }}
<br />
<a :href="helpPath">
{{ s__("Environments|Read more about environments") }}
......
app/assets/javascripts/environments/components/environments_table.vue
......@@ -30,20 +30,16 @@ export default {
default: false,
},
},
computed: {
shouldRenderFolderContent() {
return this.model.isFolder &&
this.model.isOpen &&
this.model.children &&
this.model.children.length > 0;
},
},
methods: {
folderUrl(model) {
return `${window.location.pathname}/folders/${model.folderName}`;
},
shouldRenderFolderContent(env) {
return env.isFolder &&
env.isOpen &&
env.children &&
env.children.length > 0;
},
},
};
</script>
......@@ -99,7 +95,7 @@ export default {
/>
<template
v-if="shouldRenderFolderContent"
v-if="shouldRenderFolderContent(model)"
>
<div
v-if="model.isLoadingFolderContent"
......@@ -110,11 +106,11 @@ export default {
<template v-else>
<div
is="environment-item"
v-for="children in model.children"
v-for="(children, index) in model.children"
:model="children"
:can-create-deployment="canCreateDeployment"
:can-read-environment="canReadEnvironment"
:key="i"
:key="index"
/>
<div :key="i">
......
app/assets/javascripts/groups/components/group_item.vue
......@@ -75,7 +75,7 @@ export default {
:id="groupDomId"
:class="rowClass"
class="group-row"
>
>
<div
class="group-row-contents"
:class="{ 'project-row-contents': !isGroup }">
......@@ -88,7 +88,8 @@ export default {
:item="group"
/>
<div
class="folder-toggle-wrap">
class="folder-toggle-wrap"
>
<item-caret
:is-group-open="group.isOpen"
/>
......@@ -113,13 +114,14 @@ export default {
<identicon
v-else
size-class="s24"
:entity-id=group.id
:entity-id="group.id"
:entity-name="group.name"
/>
</a>
</div>
<div
class="title namespace-title">
class="title namespace-title"
>
<a
v-tooltip
:href="group.relativePath"
......@@ -135,7 +137,7 @@ export default {
v-if="group.permission"
class="user-access-role"
>
{{group.permission}}
{{ group.permission }}
</span>
</div>
<div
......
app/assets/javascripts/ide/components/ide.vue
<script>
import { mapState, mapGetters } from 'vuex';
import ideSidebar from './ide_side_bar.vue';
import ideContextbar from './ide_context_bar.vue';
import repoTabs from './repo_tabs.vue';
import repoFileButtons from './repo_file_buttons.vue';
import ideStatusBar from './ide_status_bar.vue';
import repoPreview from './repo_preview.vue';
import repoEditor from './repo_editor.vue';
import { mapState, mapGetters } from 'vuex';
import ideSidebar from './ide_side_bar.vue';
import ideContextbar from './ide_context_bar.vue';
import repoTabs from './repo_tabs.vue';
import repoFileButtons from './repo_file_buttons.vue';
import ideStatusBar from './ide_status_bar.vue';
import repoPreview from './repo_preview.vue';
import repoEditor from './repo_editor.vue';
export default {
props: {
emptyStateSvgPath: {
type: String,
required: true,
export default {
components: {
ideSidebar,
ideContextbar,
repoTabs,
repoFileButtons,
ideStatusBar,
repoEditor,
repoPreview,
},
},
computed: {
...mapState([
'currentBlobView',
'selectedFile',
]),
...mapGetters([
'changedFiles',
'activeFile',
]),
},
components: {
ideSidebar,
ideContextbar,
repoTabs,
repoFileButtons,
ideStatusBar,
repoEditor,
repoPreview,
},
mounted() {
const returnValue = 'Are you sure you want to lose unsaved changes?';
window.onbeforeunload = (e) => {
if (!this.changedFiles.length) return undefined;
props: {
emptyStateSvgPath: {
type: String,
required: true,
},
},
computed: {
...mapState([
'currentBlobView',
'selectedFile',
]),
...mapGetters([
'changedFiles',
'activeFile',
]),
},
mounted() {
const returnValue = 'Are you sure you want to lose unsaved changes?';
window.onbeforeunload = (e) => {
if (!this.changedFiles.length) return undefined;
Object.assign(e, {
returnValue,
});
return returnValue;
};
},
};
Object.assign(e, {
returnValue,
});
return returnValue;
};
},
};
</script>
<template>
<div
class="ide-view"
>
<ide-sidebar/>
<ide-sidebar />
<div
class="multi-file-edit-pane"
>
<template
v-if="activeFile">
v-if="activeFile"
>
<repo-tabs/>
<component
class="multi-file-edit-pane-content"
:is="currentBlobView"
/>
<repo-file-buttons/>
<repo-file-buttons />
<ide-status-bar
:file="selectedFile"/>
:file="selectedFile"
/>
</template>
<template
v-else>
v-else
>
<div class="ide-empty-state">
<div class="row js-empty-state">
<div class="col-xs-12">
<div class="svg-content svg-250">
<img :src="emptyStateSvgPath">
<img :src="emptyStateSvgPath" />
</div>
</div>
<div class="col-xs-12">
......@@ -82,7 +85,8 @@ export default {
Welcome to the GitLab IDE
</h4>
<p>
You can select a file in the left sidebar to begin editing and use the right sidebar to commit your changes.
You can select a file in the left sidebar to begin
editing and use the right sidebar to commit your changes.
</p>
</div>
</div>
......
app/assets/javascripts/ide/components/ide_repo_tree.vue
......@@ -44,28 +44,31 @@ export default {
</script>
<template>
<div>
<div class="ide-file-list">
<table class="table">
<tbody
v-if="treeId">
<repo-previous-directory
v-if="hasPreviousDirectory"
/>
<div
class="multi-file-loading-container"
v-if="showLoading"
v-for="n in 3"
:key="n">
<skeleton-loading-container/>
</div>
<repo-file
v-for="file in fetchedList"
:key="file.key"
:file="file"
/>
</tbody>
</table>
<div>
<div class="ide-file-list">
<table class="table">
<tbody
v-if="treeId"
>
<repo-previous-directory
v-if="hasPreviousDirectory"
/>
<template v-if="showLoading">
<div
class="multi-file-loading-container"
v-for="n in 3"
:key="n"
>
<skeleton-loading-container />
</div>
</template>
<repo-file
v-for="file in fetchedList"
:key="file.key"
:file="file"
/>
</tbody>
</table>
</div>
</div>
</div>
</template>
app/assets/javascripts/ide/components/ide_side_bar.vue
<script>
import { mapState, mapActions } from 'vuex';
import projectTree from './ide_project_tree.vue';
import icon from '../../vue_shared/components/icon.vue';
import panelResizer from '../../vue_shared/components/panel_resizer.vue';
import skeletonLoadingContainer from '../../vue_shared/components/skeleton_loading_container.vue';
import { mapState, mapActions } from 'vuex';
import projectTree from './ide_project_tree.vue';
import icon from '../../vue_shared/components/icon.vue';
import panelResizer from '../../vue_shared/components/panel_resizer.vue';
import skeletonLoadingContainer from '../../vue_shared/components/skeleton_loading_container.vue';
export default {
components: {
projectTree,
icon,
panelResizer,
skeletonLoadingContainer,
},
data() {
return {
width: 290,
};
},
computed: {
...mapState([
'loading',
'projects',
'leftPanelCollapsed',
]),
currentIcon() {
return this.leftPanelCollapsed ? 'angle-double-right' : 'angle-double-left';
export default {
components: {
projectTree,
icon,
panelResizer,
skeletonLoadingContainer,
},
maxSize() {
return window.innerWidth / 2;
data() {
return {
width: 290,
};
},
panelStyle() {
if (!this.leftPanelCollapsed) {
return { width: `${this.width}px` };
}
return {};
computed: {
...mapState([
'loading',
'projects',
'leftPanelCollapsed',
]),
currentIcon() {
return this.leftPanelCollapsed ? 'angle-double-right' : 'angle-double-left';
},
maxSize() {
return window.innerWidth / 2;
},
panelStyle() {
if (!this.leftPanelCollapsed) {
return { width: `${this.width}px` };
}
return {};
},
showLoading() {
return this.loading;
},
},
showLoading() {
return this.loading;
methods: {
...mapActions([
'setPanelCollapsedStatus',
'setResizingStatus',
]),
toggleCollapsed() {
this.setPanelCollapsedStatus({
side: 'left',
collapsed: !this.leftPanelCollapsed,
});
},
resizingStarted() {
this.setResizingStatus(true);
},
resizingEnded() {
this.setResizingStatus(false);
},
},
},
methods: {
...mapActions([
'setPanelCollapsedStatus',
'setResizingStatus',
]),
toggleCollapsed() {
this.setPanelCollapsedStatus({
side: 'left',
collapsed: !this.leftPanelCollapsed,
});
},
resizingStarted() {
this.setResizingStatus(true);
},
resizingEnded() {
this.setResizingStatus(false);
},
},
};
};
</script>
<template>
......@@ -69,13 +69,15 @@ export default {
:style="panelStyle"
>
<div class="multi-file-commit-panel-inner">
<div
class="multi-file-loading-container"
v-if="showLoading"
v-for="n in 3"
:key="n">
<skeleton-loading-container/>
</div>
<template v-if="showLoading">
<div
class="multi-file-loading-container"
v-for="n in 3"
:key="n"
>
<skeleton-loading-container />
</div>
</template>
<project-tree
v-for="project in projects"
:key="project.id"
......
app/assets/javascripts/ide/components/repo_commit_section.vue
......@@ -111,7 +111,8 @@ export default {
:primary-button-label="__('Create new branch')"
kind="primary"
:title="__('Branch has changed')"
:text="__('This branch has changed since you started editing. Would you like to create a new branch?')"
:text="__(`This branch has changed since
you started editing. Would you like to create a new branch?`)"
@cancel="showNewBranchModal = false"
@submit="makeCommit(true)"
/>
......
app/assets/javascripts/ide/components/repo_file.vue
......@@ -60,6 +60,11 @@
};
},
},
updated() {
if (this.file.type === 'blob' && this.file.active) {
this.$el.scrollIntoView();
}
},
methods: {
clickFile(row) {
// Manual Action if a tree is selected/opened
......@@ -72,11 +77,6 @@
this.$router.push(`/project${row.url}`);
},
},
updated() {
if (this.file.type === 'blob' && this.file.active) {
this.$el.scrollIntoView();
}
},
};
</script>
......
app/assets/javascripts/jobs/components/header.vue
......@@ -31,7 +31,7 @@
return !this.isLoading && Object.keys(this.job).length;
},
jobStarted() {
return this.job.started;
return this.job.started !== undefined;
},
},
watch: {
......
app/assets/javascripts/monitoring/components/graph.vue
......@@ -17,6 +17,15 @@
const d3 = { scaleLinear, scaleTime, axisLeft, axisBottom, max, extent, select };
export default {
components: {
GraphLegend,
GraphFlag,
GraphDeployment,
GraphPath,
},
mixins: [MonitoringMixin],
props: {
graphData: {
type: Object,
......@@ -45,8 +54,6 @@
},
},
mixins: [MonitoringMixin],
data() {
return {
baseGraphHeight: 450,
......@@ -74,13 +81,6 @@
};
},
components: {
GraphLegend,
GraphFlag,
GraphDeployment,
GraphPath,
},
computed: {
outerViewBox() {
return `0 0 ${this.baseGraphWidth} ${this.baseGraphHeight}`;
......@@ -105,6 +105,26 @@
},
},
watch: {
updateAspectRatio() {
if (this.updateAspectRatio) {
this.graphHeight = 450;
this.graphWidth = 600;
this.measurements = measurements.large;
this.draw();
eventHub.$emit('toggleAspectRatio');
}
},
hoverData() {
this.positionFlag();
},
},
mounted() {
this.draw();
},
methods: {
draw() {
const breakpointSize = bp.getBreakpointSize();
......@@ -197,26 +217,6 @@
}); // This will select all of the ticks once they're rendered
},
},
watch: {
updateAspectRatio() {
if (this.updateAspectRatio) {
this.graphHeight = 450;
this.graphWidth = 600;
this.measurements = measurements.large;
this.draw();
eventHub.$emit('toggleAspectRatio');
}
},
hoverData() {
this.positionFlag();
},
},
mounted() {
this.draw();
},
};
</script>
......@@ -224,24 +224,27 @@
<div
class="prometheus-graph"
@mouseover="showFlagContent = true"
@mouseleave="showFlagContent = false">
@mouseleave="showFlagContent = false"
>
<h5 class="text-center graph-title">
{{graphData.title}}
{{ graphData.title }}
</h5>
<div
class="prometheus-svg-container"
:style="paddingBottomRootSvg">
:style="paddingBottomRootSvg"
>
<svg
:viewBox="outerViewBox"
ref="baseSvg">
ref="baseSvg"
>
<g
class="x-axis"
:transform="axisTransform">
</g>
:transform="axisTransform"
/>
<g
class="y-axis"
transform="translate(70, 20)">
</g>
transform="translate(70, 20)"
/>
<graph-legend
:graph-width="graphWidth"
:graph-height="graphHeight"
......@@ -256,29 +259,30 @@
<svg
class="graph-data"
:viewBox="innerViewBox"
ref="graphData">
<graph-path
v-for="(path, index) in timeSeries"
:key="index"
:generated-line-path="path.linePath"
:generated-area-path="path.areaPath"
:line-style="path.lineStyle"
:line-color="path.lineColor"
:area-color="path.areaColor"
/>
<graph-deployment
:deployment-data="reducedDeploymentData"
:graph-height="graphHeight"
:graph-height-offset="graphHeightOffset"
/>
<rect
class="prometheus-graph-overlay"
:width="(graphWidth - 70)"
:height="(graphHeight - 100)"
transform="translate(-5, 20)"
ref="graphOverlay"
@mousemove="handleMouseOverGraph($event)">
</rect>
ref="graphData"
>
<graph-path
v-for="(path, index) in timeSeries"
:key="index"
:generated-line-path="path.linePath"
:generated-area-path="path.areaPath"
:line-style="path.lineStyle"
:line-color="path.lineColor"
:area-color="path.areaColor"
/>
<graph-deployment
:deployment-data="reducedDeploymentData"
:graph-height="graphHeight"
:graph-height-offset="graphHeightOffset"
/>
<rect
class="prometheus-graph-overlay"
:width="(graphWidth - 70)"
:height="(graphHeight - 100)"
transform="translate(-5, 20)"
ref="graphOverlay"
@mousemove="handleMouseOverGraph($event)"
/>
</svg>
</svg>
<graph-flag
......
app/assets/javascripts/monitoring/components/graph/deployment.vue
......@@ -39,33 +39,35 @@
y="0"
:height="calculatedHeight"
width="3"
fill="url(#shadow-gradient)">
</rect>
fill="url(#shadow-gradient)"
/>
<line
class="deployment-line"
x1="0"
y1="0"
x2="0"
:y2="calculatedHeight"
stroke="#000">
</line>
stroke="#000"
/>
</g>
<svg
height="0"
width="0">
width="0"
>
<defs>
<linearGradient
id="shadow-gradient">
id="shadow-gradient"
>
<stop
offset="0%"
stop-color="#000"
stop-opacity="0.4">
</stop>
stop-opacity="0.4"
/>
<stop
offset="100%"
stop-color="#000"
stop-opacity="0">
</stop>
stop-opacity="0"
/>
</linearGradient>
</defs>
</svg>
......
app/assets/javascripts/monitoring/components/graph/flag.vue
<script>
import { dateFormat, timeFormat } from '../../utils/date_time_formatters';
import { formatRelevantDigits } from '../../../lib/utils/number_utils';
import Icon from '../../../vue_shared/components/icon.vue';
import icon from '../../../vue_shared/components/icon.vue';
export default {
components: {
icon,
},
props: {
currentXCoordinate: {
type: Number,
......@@ -52,10 +55,6 @@
},
},
components: {
Icon,
},
computed: {
formatTime() {
return this.deploymentFlagData ?
......@@ -137,33 +136,34 @@
>
<div class="arrow"></div>
<div class="popover-title">
<h5 v-if="this.deploymentFlagData">
<h5 v-if="deploymentFlagData">
Deployed
</h5>
{{formatDate}} at
<strong>{{formatTime}}</strong>
{{ formatDate }} at
<strong>{{ formatTime }}</strong>
</div>
<div
v-if="this.deploymentFlagData"
v-if="deploymentFlagData"
class="popover-content deploy-meta-content"
>
<div>
<icon
name="commit"
:size="12">
</icon>
:size="12"
/>
<a :href="deploymentFlagData.commitUrl">
{{deploymentFlagData.sha.slice(0, 8)}}
{{ deploymentFlagData.sha.slice(0, 8) }}
</a>
</div>
<div
v-if="deploymentFlagData.tag">
v-if="deploymentFlagData.tag"
>
<icon
name="label"
:size="12">
</icon>
:size="12"
/>
<a :href="deploymentFlagData.tagUrl">
{{deploymentFlagData.ref}}
{{ deploymentFlagData.ref }}
</a>
</div>
</div>
......@@ -174,7 +174,10 @@
:key="index"
>
<td>
<svg width="15" height="6">
<svg
width="15"
height="6"
>
<line
:stroke="series.lineColor"
:stroke-dasharray="strokeDashArray(series.lineStyle)"
......@@ -182,13 +185,13 @@
x1="0"
x2="15"
y1="2"
y2="2">
</line>
y2="2"
/>
</svg>
</td>
<td>{{seriesMetricLabel(index, series)}}</td>
<td>{{ seriesMetricLabel(index, series) }}</td>
<td>
<strong>{{seriesMetricValue(series)}}</strong>
<strong>{{ seriesMetricValue(series) }}</strong>
</td>
</tr>
</table>
......
app/assets/javascripts/notes/components/comment_form.vue
......@@ -291,7 +291,8 @@ Please check your network connection and try again.`;
<textarea
id="note-body"
name="note[note]"
class="note-textarea js-vue-comment-form js-gfm-input js-autosize markdown-area js-vue-textarea"
class="note-textarea js-vue-comment-form
js-gfm-input js-autosize markdown-area js-vue-textarea"
data-supports-quick-actions="true"
aria-label="Description"
v-model="note"
......@@ -304,7 +305,8 @@ Please check your network connection and try again.`;
</textarea>
</markdown-field>
<div class="note-form-actions">
<div class="pull-left btn-group append-right-10 comment-type-dropdown js-comment-type-dropdown droplab-dropdown">
<div class="pull-left btn-group
append-right-10 comment-type-dropdown js-comment-type-dropdown droplab-dropdown">
<button
@click.prevent="handleSave()"
:disabled="isSubmitButtonDisabled"
......
app/assets/javascripts/notes/components/note_form.vue
......@@ -146,7 +146,8 @@
<textarea
id="note_note"
name="note[note]"
class="note-textarea js-gfm-input js-autosize markdown-area js-vue-issue-note-form js-vue-textarea"
class="note-textarea js-gfm-input
js-autosize markdown-area js-vue-issue-note-form js-vue-textarea"
:data-supports-quick-actions="!isEditing"
aria-label="Description"
v-model="note"
......
app/assets/javascripts/pipeline_schedules/components/pipeline_schedules_callout.vue
......@@ -48,7 +48,9 @@
<div class="user-callout-copy">
<h4>{{ __('Scheduling Pipelines') }}</h4>
<p>
{{ __('The pipelines schedule runs pipelines in the future, repeatedly, for specific branches or tags. Those scheduled pipelines will inherit limited project access based on their associated user.') }}
{{ __(`The pipelines schedule runs pipelines in the future,
repeatedly, for specific branches or tags.
Those scheduled pipelines will inherit limited project access based on their associated user.`) }}
</p>
<p> {{ __('Learn more in the') }}
<a
......
app/assets/javascripts/pipelines/components/empty_state.vue
......@@ -26,7 +26,9 @@
{{ s__("Pipelines|Build with confidence") }}
</h4>
<p>
{{ s__("Pipelines|Continous Integration can help catch bugs by running your tests automatically, while Continuous Deployment can help you deliver code to your product environment.") }}
{{ s__(`Pipelines|Continous Integration can help
catch bugs by running your tests automatically,
while Continuous Deployment can help you deliver code to your product environment.`) }}
</p>
<div class="text-center">
<a
......
app/assets/javascripts/pipelines/components/pipelines.vue
......@@ -197,7 +197,8 @@
<div class="pipelines-container">
<div
class="top-area scrolling-tabs-container inner-page-scroll-tabs"
v-if="!shouldRenderEmptyState">
v-if="!shouldRenderEmptyState"
>
<div class="fade-left">
<i
class="fa fa-angle-left"
......@@ -221,7 +222,7 @@
:new-pipeline-path="newPipelinePath"
:has-ci-enabled="hasCiEnabled"
:help-page-path="helpPagePath"
:resetCachePath="resetCachePath"
:reset-cache-path="resetCachePath"
:ci-lint-path="ciLintPath"
:can-create-pipeline="canCreatePipelineParsed "
/>
......
app/assets/javascripts/projects/permissions/components/settings_panel.vue
......@@ -40,14 +40,17 @@
visibilityHelpPath: {
type: String,
required: false,
default: '',
},
lfsHelpPath: {
type: String,
required: false,
default: '',
},
registryHelpPath: {
type: String,
required: false,
default: '',
},
},
......
app/assets/javascripts/projects_dropdown/components/projects_list_item.vue
......@@ -9,6 +9,7 @@
matcher: {
type: String,
required: false,
default: '',
},
projectId: {
type: Number,
......@@ -27,6 +28,7 @@
required: true,
},
avatarUrl: {
type: String,
required: true,
validator(value) {
return value === null || typeof value === 'string';
......@@ -38,7 +40,7 @@
return this.avatarUrl !== null;
},
highlightedProjectName() {
if (this.matcher) {
if (this.matcher !== '') {
const matcherRegEx = new RegExp(this.matcher, 'gi');
const matches = this.projectName.match(matcherRegEx);
......
app/assets/javascripts/registry/components/app.vue
......@@ -55,7 +55,8 @@
/>
<p v-else-if="!isLoading && !repos.length">
{{ __("No container images stored for this project. Add one by following the instructions above.") }}
{{ __(`No container images stored for this project.
Add one by following the instructions above.`) }}
</p>
</div>
</template>
app/assets/javascripts/vue_merge_request_widget/components/states/mr_widget_rebase.vue
......@@ -105,7 +105,9 @@
</span>
</template>
<template v-if="!mr.rebaseInProgress && mr.canPushToSourceBranch && !isMakingRequest">
<div class="accept-merge-holder clearfix js-toggle-container accept-action media space-children">
<div
class="accept-merge-holder clearfix
js-toggle-container accept-action media space-children">
<button
type="button"
class="btn btn-sm btn-reopen btn-success"
......
app/assets/javascripts/vue_shared/components/header_ci_component.vue
<script>
import ciIconBadge from './ci_badge_link.vue';
import loadingIcon from './loading_icon.vue';
import timeagoTooltip from './time_ago_tooltip.vue';
import tooltip from '../directives/tooltip';
import userAvatarImage from './user_avatar/user_avatar_image.vue';
/**
* Renders header component for job and pipeline page based on UI mockups
*
* Used in:
* - job show page
* - pipeline show page
*/
export default {
props: {
status: {
type: Object,
required: true,
},
itemName: {
type: String,
required: true,
},
itemId: {
type: Number,
required: true,
},
time: {
type: String,
required: true,
},
user: {
type: Object,
required: false,
default: () => ({}),
import ciIconBadge from './ci_badge_link.vue';
import loadingIcon from './loading_icon.vue';
import timeagoTooltip from './time_ago_tooltip.vue';
import tooltip from '../directives/tooltip';
import userAvatarImage from './user_avatar/user_avatar_image.vue';
/**
* Renders header component for job and pipeline page based on UI mockups
*
* Used in:
* - job show page
* - pipeline show page
*/
export default {
components: {
ciIconBadge,
loadingIcon,
timeagoTooltip,
userAvatarImage,
},
actions: {
type: Array,
required: false,
default: () => [],
directives: {
tooltip,
},
hasSidebarButton: {
type: Boolean,
required: false,
default: false,
props: {
status: {
type: Object,
required: true,
},
itemName: {
type: String,
required: true,
},
itemId: {
type: Number,
required: true,
},
time: {
type: String,
required: true,
},
user: {
type: Object,
required: false,
default: () => ({}),
},
actions: {
type: Array,
required: false,
default: () => [],
},
hasSidebarButton: {
type: Boolean,
required: false,
default: false,
},
shouldRenderTriggeredLabel: {
type: Boolean,
required: false,
default: true,
},
},
shouldRenderTriggeredLabel: {
type: Boolean,
required: false,
default: true,
},
},
directives: {
tooltip,
},
components: {
ciIconBadge,
loadingIcon,
timeagoTooltip,
userAvatarImage,
},
computed: {
userAvatarAltText() {
return `${this.user.name}'s avatar`;
computed: {
userAvatarAltText() {
return `${this.user.name}'s avatar`;
},
},
},
methods: {
onClickAction(action) {
this.$emit('actionClicked', action);
methods: {
onClickAction(action) {
this.$emit('actionClicked', action);
},
},
},
};
};
</script>
<template>
......@@ -84,7 +82,7 @@ export default {
<ci-icon-badge :status="status" />
<strong>
{{itemName}} #{{itemId}}
{{ itemName }} #{{ itemId }}
</strong>
<template v-if="shouldRenderTriggeredLabel">
......@@ -103,16 +101,17 @@ export default {
v-tooltip
:href="user.path"
:title="user.email"
class="js-user-link commit-committer-link">
class="js-user-link commit-committer-link"
>
<user-avatar-image
:img-src="user.avatar_url"
:img-alt="userAvatarAltText"
:tooltip-text="user.name"
:img-size="24"
/>
/>
{{user.name}}
{{ user.name }}
</a>
</template>
</section>
......@@ -121,12 +120,15 @@ export default {
class="header-action-buttons"
v-if="actions.length">
<template
v-for="action in actions">
v-for="(action, i) in actions"
>
<a
v-if="action.type === 'link'"
:href="action.path"
:class="action.cssClass">
{{action.label}}
:class="action.cssClass"
:key="i"
>
{{ action.label }}
</a>
<a
......@@ -134,8 +136,10 @@ export default {
:href="action.path"
data-method="post"
rel="nofollow"
:class="action.cssClass">
{{action.label}}
:class="action.cssClass"
:key="i"
>
{{ action.label }}
</a>
<button
......@@ -143,25 +147,31 @@ export default {
@click="onClickAction(action)"
:disabled="action.isLoading"
:class="action.cssClass"
type="button">
{{action.label}}
type="button"
:key="i"
>
{{ action.label }}
<i
v-show="action.isLoading"
class="fa fa-spin fa-spinner"
aria-hidden="true">
aria-hidden="true"
>
</i>
</button>
</template>
<button
v-if="hasSidebarButton"
type="button"
class="btn btn-default visible-xs-block visible-sm-block sidebar-toggle-btn js-sidebar-build-toggle js-sidebar-build-toggle-header"
class="btn btn-default visible-xs-block
visible-sm-block sidebar-toggle-btn js-sidebar-build-toggle js-sidebar-build-toggle-header"
aria-label="Toggle Sidebar"
id="toggleSidebar">
id="toggleSidebar"
>
<i
class="fa fa-angle-double-left"
aria-hidden="true"
aria-labelledby="toggleSidebar">
aria-labelledby="toggleSidebar"
>
</i>
</button>
</section>
......
app/assets/javascripts/vue_shared/components/issue/issue_warning.vue
......@@ -45,7 +45,8 @@
<span v-if="isLockedAndConfidential">
{{ __('This issue is confidential and locked.') }}
{{ __('People without permission will never get a notification and won\'t be able to comment.') }}
{{ __(`People without permission will never
get a notification and won't be able to comment.`) }}
</span>
<span v-else-if="isConfidential">
......
app/assets/javascripts/vue_shared/components/loading_icon.vue
......@@ -32,7 +32,7 @@
</script>
<template>
<component
:is="this.rootElementType"
:is="rootElementType"
class="text-center">
<i
class="fa fa-spin fa-spinner"
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment