diff --git a/src/components/runs.vue b/src/components/runs.vue index 9e926a8..08d8c59 100644 --- a/src/components/runs.vue +++ b/src/components/runs.vue @@ -1,8 +1,8 @@ @@ -83,6 +90,8 @@ export default { data() { return { runs: [], + wantedRunsNumber: 25, + hasMoreRuns: false, polling: null, project: null, user: null @@ -151,6 +160,11 @@ export default { this.fetchRuns(); }, + loadMoreRuns() { + this.wantedRunsNumber += 25; + this.fetchRuns(); + }, + // TODO(sgotti) use run events instead of refetching all runs everytime async fetchRuns() { let group; let lastrun = false; @@ -171,12 +185,29 @@ export default { group = "/user/" + this.user.id; } - let { data, error } = await fetchRuns(group, lastrun); - if (error) { - this.$store.dispatch("setError", error); - return; + let newRuns = []; + let hasMoreRuns = false; + let stopFetch = false; + let runCount = 0; + let startRunID = null; + while (!stopFetch) { + let { data, error } = await fetchRuns(group, startRunID, lastrun); + if (error) { + this.$store.dispatch("setError", error); + return; + } + runCount += data.length; + if (runCount >= this.wantedRunsNumber || data.length == 0) { + hasMoreRuns = data.length != 0; + stopFetch = true; + } + newRuns = newRuns.concat(data); + if (newRuns.length) { + startRunID = newRuns[newRuns.length - 1].id; + } } - this.runs = data; + this.runs = newRuns; + this.hasMoreRuns = hasMoreRuns; }, pollData() { clearInterval(this.polling); @@ -210,9 +241,6 @@ export default { } .item-list { - .item { - } - .item-content { margin-bottom: 5px; border: 1px solid $grey-lighter; @@ -277,4 +305,9 @@ export default { font-size: 0.8rem; } } + +.load-more-button { + margin-top: 1rem; + margin-bottom: 2rem; +} diff --git a/src/util/data.js b/src/util/data.js index a22a1bc..9cc1b31 100644 --- a/src/util/data.js +++ b/src/util/data.js @@ -50,7 +50,8 @@ export async function fetchOrgMembers(orgref) { let path = "/orgs/" + orgref + "/members" return await fetch(apiurl(path)); } -export async function fetchRuns(group, lastrun) { + +export async function fetchRuns(group, startRunID, lastrun) { let u = apiurl("/runs"); if (group) { u.searchParams.append("group", group) @@ -58,6 +59,9 @@ export async function fetchRuns(group, lastrun) { if (lastrun) { u.searchParams.append("lastrun", true) } + if (startRunID) { + u.searchParams.append("start", startRunID) + } return await fetch(u) }