diff options
author | Phil Hughes <me@iamphill.com> | 2019-06-28 15:36:18 +0300 |
---|---|---|
committer | Phil Hughes <me@iamphill.com> | 2019-06-28 15:36:18 +0300 |
commit | df3d9361e505db61de41b8e39516470d50c0e851 (patch) | |
tree | bff6fdf02300e8163ccd1b1349fc79b87cc856c5 /app | |
parent | ecb05e59014ffdc2e9b9e933a61684e86f541bf0 (diff) |
Use GraphQL API to fetch last commit data for tree
Diffstat (limited to 'app')
-rw-r--r-- | app/assets/javascripts/lib/graphql.js | 2 | ||||
-rw-r--r-- | app/assets/javascripts/repository/components/last_commit.vue | 135 | ||||
-rw-r--r-- | app/assets/javascripts/repository/index.js | 30 | ||||
-rw-r--r-- | app/assets/javascripts/repository/queries/pathLastCommit.query.graphql | 6 | ||||
-rw-r--r-- | app/views/projects/_files.html.haml | 4 |
5 files changed, 92 insertions, 85 deletions
diff --git a/app/assets/javascripts/lib/graphql.js b/app/assets/javascripts/lib/graphql.js index 5857f9e22ae..c05db4a5c71 100644 --- a/app/assets/javascripts/lib/graphql.js +++ b/app/assets/javascripts/lib/graphql.js @@ -22,7 +22,7 @@ export default (resolvers = {}, config = {}) => { return new ApolloClient({ link: ApolloLink.split( - operation => operation.getContext().hasUpload, + operation => operation.getContext().hasUpload || operation.getContext().isSingleRequest, createUploadLink(httpOptions), new BatchHttpLink(httpOptions), ), diff --git a/app/assets/javascripts/repository/components/last_commit.vue b/app/assets/javascripts/repository/components/last_commit.vue index f25cee9bb57..26493556063 100644 --- a/app/assets/javascripts/repository/components/last_commit.vue +++ b/app/assets/javascripts/repository/components/last_commit.vue @@ -1,10 +1,9 @@ <script> -import { GlTooltipDirective, GlLink, GlButton } from '@gitlab/ui'; +import { GlTooltipDirective, GlLink, GlButton, GlLoadingIcon } from '@gitlab/ui'; import { sprintf, s__ } from '~/locale'; import Icon from '../../vue_shared/components/icon.vue'; import UserAvatarLink from '../../vue_shared/components/user_avatar/user_avatar_link.vue'; import TimeagoTooltip from '../../vue_shared/components/time_ago_tooltip.vue'; -import CommitPipelineStatus from '../../projects/tree/components/commit_pipeline_status_component.vue'; import CiIcon from '../../vue_shared/components/ci_icon.vue'; import ClipboardButton from '../../vue_shared/components/clipboard_button.vue'; import getRefMixin from '../mixins/get_ref'; @@ -16,11 +15,11 @@ export default { Icon, UserAvatarLink, TimeagoTooltip, - CommitPipelineStatus, ClipboardButton, CiIcon, GlLink, GlButton, + GlLoadingIcon, }, directives: { GlTooltip: GlTooltipDirective, @@ -39,7 +38,10 @@ export default { path: this.currentPath.replace(/^\//, ''), }; }, - update: data => data.project.repository.tree.commit, + update: data => data.project.repository.tree.lastCommit, + context: { + isSingleRequest: true, + }, }, }, props: { @@ -59,14 +61,14 @@ export default { computed: { statusTitle() { return sprintf(s__('Commits|Commit: %{commitText}'), { - commitText: this.commit.pipeline.detailedStatus.text, + commitText: this.commit.latestPipeline.detailedStatus.text, }); }, isLoading() { return this.$apollo.queries.commit.loading; }, showCommitId() { - return this.commit.id.substr(0, 8); + return this.commit.sha.substr(0, 8); }, }, methods: { @@ -78,68 +80,75 @@ export default { </script> <template> - <div v-if="!isLoading" class="info-well d-none d-sm-flex project-last-commit commit p-3"> - <user-avatar-link - v-if="commit.author" - :link-href="commit.author.webUrl" - :img-src="commit.author.avatarUrl" - :img-size="40" - class="avatar-cell" - /> - <div class="commit-detail flex-list"> - <div class="commit-content qa-commit-content"> - <gl-link :href="commit.webUrl" class="commit-row-message item-title"> - {{ commit.title }} - </gl-link> - <gl-button - v-if="commit.description" - :class="{ open: showDescription }" - :aria-label="__('Show commit description')" - class="text-expander" - @click="toggleShowDescription" - > - <icon name="ellipsis_h" /> - </gl-button> - <div class="committer"> + <div class="info-well d-none d-sm-flex project-last-commit commit p-3"> + <gl-loading-icon v-if="isLoading" size="md" class="mx-auto" /> + <template v-else> + <user-avatar-link + v-if="commit.author" + :link-href="commit.author.webUrl" + :img-src="commit.author.avatarUrl" + :img-size="40" + class="avatar-cell" + /> + <div class="commit-detail flex-list"> + <div class="commit-content qa-commit-content"> + <gl-link :href="commit.webUrl" class="commit-row-message item-title"> + {{ commit.title }} + </gl-link> + <gl-button + v-if="commit.description" + :class="{ open: showDescription }" + :aria-label="__('Show commit description')" + class="text-expander" + @click="toggleShowDescription" + > + <icon name="ellipsis_h" /> + </gl-button> + <div class="committer"> + <gl-link + v-if="commit.author" + :href="commit.author.webUrl" + class="commit-author-link js-user-link" + > + {{ commit.author.name }} + </gl-link> + authored + <timeago-tooltip :time="commit.authoredDate" tooltip-placement="bottom" /> + </div> + <pre + v-if="commit.description" + v-show="showDescription" + class="commit-row-description append-bottom-8" + > + {{ commit.description }} + </pre> + </div> + <div class="commit-actions flex-row"> <gl-link - v-if="commit.author" - :href="commit.author.webUrl" - class="commit-author-link js-user-link" + v-if="commit.latestPipeline" + v-gl-tooltip + :href="commit.latestPipeline.detailedStatus.detailsPath" + :title="statusTitle" + class="js-commit-pipeline" > - {{ commit.author.name }} + <ci-icon + :status="commit.latestPipeline.detailedStatus" + :size="24" + :aria-label="statusTitle" + /> </gl-link> - authored - <timeago-tooltip :time="commit.authoredDate" tooltip-placement="bottom" /> - </div> - <pre - v-if="commit.description" - v-show="showDescription" - class="commit-row-description append-bottom-8" - > - {{ commit.description }} - </pre> - </div> - <div class="commit-actions flex-row"> - <gl-link - v-if="commit.pipeline" - v-gl-tooltip - :href="commit.pipeline.detailedStatus.detailsPath" - :title="statusTitle" - class="js-commit-pipeline" - > - <ci-icon :status="commit.pipeline.detailedStatus" :size="24" :aria-label="statusTitle" /> - </gl-link> - <div class="commit-sha-group d-flex"> - <div class="label label-monospace monospace"> - {{ showCommitId }} + <div class="commit-sha-group d-flex"> + <div class="label label-monospace monospace"> + {{ showCommitId }} + </div> + <clipboard-button + :text="commit.sha" + :title="__('Copy commit SHA to clipboard')" + tooltip-placement="bottom" + /> </div> - <clipboard-button - :text="commit.id" - :title="__('Copy commit SHA to clipboard')" - tooltip-placement="bottom" - /> </div> </div> - </div> + </template> </div> </template> diff --git a/app/assets/javascripts/repository/index.js b/app/assets/javascripts/repository/index.js index 6280977b05b..ea051eaa414 100644 --- a/app/assets/javascripts/repository/index.js +++ b/app/assets/javascripts/repository/index.js @@ -50,23 +50,19 @@ export default function setupVueRepositoryList() { }, }); - const commitEl = document.getElementById('js-last-commit'); - - if (commitEl) { - // eslint-disable-next-line no-new - new Vue({ - el: commitEl, - router, - apolloProvider, - render(h) { - return h(LastCommit, { - props: { - currentPath: this.$route.params.pathMatch, - }, - }); - }, - }); - } + // eslint-disable-next-line no-new + new Vue({ + el: document.getElementById('js-last-commit'), + router, + apolloProvider, + render(h) { + return h(LastCommit, { + props: { + currentPath: this.$route.params.pathMatch, + }, + }); + }, + }); return new Vue({ el, diff --git a/app/assets/javascripts/repository/queries/pathLastCommit.query.graphql b/app/assets/javascripts/repository/queries/pathLastCommit.query.graphql index 90901f54d54..3bdfd979fa4 100644 --- a/app/assets/javascripts/repository/queries/pathLastCommit.query.graphql +++ b/app/assets/javascripts/repository/queries/pathLastCommit.query.graphql @@ -2,8 +2,8 @@ query pathLastCommit($projectPath: ID!, $path: String, $ref: String!) { project(fullPath: $projectPath) { repository { tree(path: $path, ref: $ref) { - commit { - id + lastCommit { + sha title message webUrl @@ -13,7 +13,7 @@ query pathLastCommit($projectPath: ID!, $path: String, $ref: String!) { avatarUrl webUrl } - pipeline { + latestPipeline { detailedStatus { detailsPath icon diff --git a/app/views/projects/_files.html.haml b/app/views/projects/_files.html.haml index 2b0c3985755..6763513f9ae 100644 --- a/app/views/projects/_files.html.haml +++ b/app/views/projects/_files.html.haml @@ -9,7 +9,9 @@ .nav-block = render 'projects/tree/tree_header', tree: @tree - - if commit + - if vue_file_list_enabled? + #js-last-commit + - elsif commit = render 'shared/commit_well', commit: commit, ref: ref, project: project - if is_project_overview |