summaryrefslogtreecommitdiff
diff options
context:
space:
mode:
authorSanto Cariotti <santo@dcariotti.me>2021-03-23 15:15:04 +0100
committerGitHub <noreply@github.com>2021-03-23 15:15:04 +0100
commit4bc0c4b4d51281b6dde2f77e33fd6c93dba83d03 (patch)
tree17ef25b0567097346cfb8ba233b9b1d010984676
parent3718df3919de151cc754e273cb56b2e72dbe2caa (diff)
parent08febdd980c06d752d410be1fa982e5507279f6d (diff)
Merge pull request #9 from gico-net/feat/commit-details-page
Commit details page
-rw-r--r--src/components/Commit.vue7
-rw-r--r--src/router.js7
-rw-r--r--src/sass/_commit.sass2
-rw-r--r--src/store.js45
-rw-r--r--src/views/Commit.vue54
5 files changed, 113 insertions, 2 deletions
diff --git a/src/components/Commit.vue b/src/components/Commit.vue
index 63e1764..a60f40e 100644
--- a/src/components/Commit.vue
+++ b/src/components/Commit.vue
@@ -32,10 +32,13 @@
| <{{data.committer_email}}></b>
.text
- p
+ p(v-if="!expand")
| {{ first_line(data.text) }}
span.middot ยท
span.date {{ data.date | moment("ddd, D MMM YYYY HH:mm:ss ZZ") }}
+ p(v-else)
+ pre {{ data.text }}
+ span.date {{ data.date | moment("ddd, D MMM YYYY HH:mm:ss ZZ") }}
</template>
<script>
@@ -43,7 +46,7 @@ export default {
name: 'Commit',
// `author` is the hash md5 of the author's gravatar
// `committer` is the hash md5 of the committer's gravatar
- props: ['data', 'author', 'committer'],
+ props: ['data', 'author', 'committer', 'expand'],
methods: {
first_line(text) {
return text.split('\n')[0]
diff --git a/src/router.js b/src/router.js
index 5dc4e51..9363d15 100644
--- a/src/router.js
+++ b/src/router.js
@@ -2,6 +2,7 @@ import Vue from 'vue'
import VueRouter from 'vue-router'
import Home from '@/views/Home.vue'
+import Commit from '@/views/Commit.vue'
Vue.use(VueRouter)
@@ -10,6 +11,12 @@ const routes = [
path: '/',
name: 'Home',
component: Home,
+ },
+ {
+ path: '/commit/:hash',
+ name: 'Commit',
+ component: Commit,
+ props: true
}
]
diff --git a/src/sass/_commit.sass b/src/sass/_commit.sass
index d59afa0..514d82b 100644
--- a/src/sass/_commit.sass
+++ b/src/sass/_commit.sass
@@ -72,6 +72,8 @@
color: $secondary
white-space: pre
display: inline-block
+ pre
+ margin-top: 20px
.repo a
color: #fff
diff --git a/src/store.js b/src/store.js
index 79bdaff..98a4417 100644
--- a/src/store.js
+++ b/src/store.js
@@ -11,6 +11,9 @@ export default new Vuex.Store({
commits: [],
top_authors: [],
emails: {},
+ commit_data: {},
+ author_avatar: "",
+ committer_avatar: "",
},
getters: {
loading: state => {
@@ -28,6 +31,15 @@ export default new Vuex.Store({
emails: state => {
return state.emails
},
+ commit: state => {
+ return state.commit_data
+ },
+ author_avatar: state => {
+ return state.author_avatar
+ },
+ committer_avatar: state => {
+ return state.committer_avatar
+ },
},
mutations: {
loading_state: (state, value) => {
@@ -45,6 +57,15 @@ export default new Vuex.Store({
load_emails: (state, value) => {
state.emails = value
},
+ load_commit: (state, value) => {
+ state.commit_data = value
+ },
+ load_author_avatar: (state, value) => {
+ state.author_avatar = value.hash_md5
+ },
+ load_committer_avatar: (state, value) => {
+ state.committer_avatar = value.hash_md5
+ },
},
actions: {
// Get all commits from the api backend
@@ -78,6 +99,30 @@ export default new Vuex.Store({
commit('load_top_authors', await response.json());
})
commit('loading_top_authors_state', false)
+ },
+ // Get commit by hash
+ async get_commit({commit}, hash) {
+ await fetch(`${this.state.api}/commit/${hash}/`)
+ .then(async response => {
+ commit('load_commit', await response.json());
+ })
+ },
+ // Get email
+ async get_email({commit}, data) {
+ await fetch(`${this.state.api}/email/search/?q=${data.email}`)
+ .then(async response => {
+ if(await response.status == 200) {
+ commit(`load_${data.type}_avatar`, await response.json());
+ }
+ })
+ },
+ // Set committer avatar
+ async set_committer({commit}, avatar) {
+ commit('load_committer_avatar', avatar);
+ },
+ // Set loading state
+ async set_loading({commit}, status) {
+ commit('loading_state', status);
}
},
modules: {
diff --git a/src/views/Commit.vue b/src/views/Commit.vue
new file mode 100644
index 0000000..d8b0050
--- /dev/null
+++ b/src/views/Commit.vue
@@ -0,0 +1,54 @@
+<template lang="pug">
+ main
+ header-blue
+ b-container(v-if="loading")
+ b-overlay(:show="true" spinner-large)
+ b-container(v-else)
+ commit-card(
+ :data="commit"
+ :author="author_avatar"
+ :committer="committer_avatar"
+ :expand="true"
+ )
+</template>
+
+<script>
+import HeaderBlue from '@/components/HeaderBlue';
+import Commit from '@/components/Commit';
+
+export default {
+ name: "Commit",
+ props: ["hash"],
+ components: {
+ 'header-blue': HeaderBlue,
+ 'commit-card': Commit,
+ },
+ async mounted() {
+ this.$store.dispatch('set_loading', true);
+ await this.$store.dispatch('get_commit', this.hash);
+ await this.$store.dispatch('get_email',
+ {type: 'author', email: this.commit.author_email});
+ if(this.commit.author_email != this.commit.committer_email) {
+ await this.$store.dispatch('get_email',
+ {type: 'committer', email: this.commit.committer_email});
+ } else {
+ await this.$store.dispatch('set_committer', this.author_avatar)
+ }
+ this.$store.dispatch('set_loading', false);
+ },
+ computed: {
+ loading: function() {
+ return this.$store.getters.loading;
+ },
+ commit: function() {
+ return this.$store.getters.commit;
+ },
+ author_avatar: function() {
+ return this.$store.getters.author_avatar;
+ },
+ committer_avatar: function() {
+ return this.$store.getters.committer_avatar;
+ },
+ },
+}
+</script>