Feature / Add pr apps list

client/src/components/pipelines/detail.vue

@@ -16,6 +16,12 @@
                             :phase="phase.name"
                             :app="app" />
 
+                        <span v-if="phase.name == 'review'">
+                            <PRcard v-for="pr in pullrequests" :key="pr.number"
+                                :pipeline="pipeline"
+                                :pullrequest="pr" />
+                        </span>
+
                         <v-btn
                         elevation="2"
                         icon
@@ -38,8 +44,19 @@
 <script>
 import axios from "axios";
 import Appcard from "./appcard.vue";
+import PRcard from "./prcard.vue";
 
 export default {
+    sockets: {
+        async updatedApps(instances) {
+            console.log("updatedApps", instances);
+            this.loadPipeline();
+        },
+        async deleteApp(instances) {
+            console.log("deleteApp", instances);
+            this.loadPipeline();
+        },
+    },
     mounted() {
         this.loadPipeline();
     },
@@ -64,6 +81,11 @@ export default {
         ],
         reviewapps: false,
         phases: false,
+        git: {
+            ssh_url: "",
+            provider: ""
+        },
+        pullrequests: [],
     }},
     computed: {
         activePhases() {
@@ -79,6 +101,7 @@ export default {
         }
     },
     components: {
+        PRcard,
         Appcard,
         breadcrumbs: () => import('../breadcrumbs.vue'),
     },
@@ -89,12 +112,48 @@ export default {
         .then(response => {
             self.phases = response.data.phases;
             self.reviewapps = response.data.reviewapps;
+            self.git.ssh_url = response.data.git.repository.ssh_url;
+            self.git.provider = response.data.git.provider;
+            if (self.reviewapps) {
+                self.loadPullrequests();
+            }
             return response.data.phases;
         })
         .catch(error => {
             console.log(error);
         });
       },
+      async loadPullrequests() {
+        const self = this;
+
+        const gitrepoB64 = btoa(this.git.ssh_url);
+
+        axios.get('/api/repo/'+this.git.provider+'/' + gitrepoB64 + '/pullrequests')
+        .then(response => {
+
+            self.pullrequests = [];
+
+            // iterate over response.data and search in self.phases[0].name for a match
+            // if not found, add the pullrequest to the phase.apps array
+            response.data.forEach(pr => {
+                let found = false;
+                self.phases[0].apps.forEach(app => {
+                    if (app.name == pr.branch) {
+                        found = true;
+                    }
+                });
+                if (!found) {
+                    self.pullrequests.push(pr);
+                }
+            });
+
+            //self.pullrequests = response.data;
+            return response.data;
+        })
+        .catch(error => {
+            console.log(error);
+        });
+      },
     },
 }
 </script>

client/src/components/pipelines/prcard.vue

@@ -0,0 +1,145 @@
+<template>
+<v-card
+    :loading="loadingState"
+    class="mt-5 pullrequest"
+    outlined
+    elevation="0"
+    color="cardBackground"
+    v-if="this.deleted === false"
+    >
+    <template slot="progress">
+      <v-progress-linear
+        color="primary"
+        height="2"
+        indeterminate
+      ></v-progress-linear>
+    </template>
+
+    <v-card-actions>
+      <v-list-item class="grow">
+        <v-list-item-avatar color="grey darken-3" style="height: 35px; min-width: 35px; width: 35px;">
+          <v-img
+            class="elevation-6"
+            :alt="this.pullrequest.user.login"
+            :src="this.pullrequest.user.avatar_url"
+          ></v-img>
+        </v-list-item-avatar>
+
+        <v-list-item-content>
+          <v-list-item-subtitle>{{ this.pullrequest.user.login }}</v-list-item-subtitle>
+          <v-list-item-title style="white-space: inherit; min-width: 250px;"><a :href="this.pullrequest.html_url" target="_blank">{{ this.pullrequest.title }}</a></v-list-item-title>
+          <!--
+          <v-list-item-subtitle><v-icon small>mdi-source-pull</v-icon>{{ this.pullrequest.updated_at }}</v-list-item-subtitle>
+          <v-list-item-subtitle><v-icon small>mdi-source-commit-start</v-icon>{{ this.pullrequest.created_at }}</v-list-item-subtitle>
+          -->
+        </v-list-item-content>
+
+
+        <v-list-item-action>
+            <v-btn
+                title="Start Review App"
+                depressed
+                color="primary lighten-2"
+                @click="startReviewApp()"
+                v-if="!this.pullrequest.locked"
+            >
+                <v-icon
+                    color="white"
+                    >mdi-play-box-outline
+                </v-icon>
+            </v-btn>
+            <v-btn
+                title="Start Review App"
+                depressed
+                color="primary lighten-2"
+                disabled
+                v-if="this.pullrequest.locked"
+            >
+                <v-icon
+                    color="white"
+                    >mdi-play-box-lock-outline
+                </v-icon>
+            </v-btn>
+        </v-list-item-action>
+      </v-list-item>
+    </v-card-actions>
+    <v-card-subtitle class="pr-data">
+        <v-row>
+            <v-col>
+                <v-chip label class="mr-1"><span v-if="this.pullrequest.autodeploy">Autodeploy | </span>{{ this.pullrequest.branch }}</v-chip>
+            </v-col>
+            <v-col>
+                <v-icon small>mdi-source-commit-start</v-icon> {{ this.pullrequest.created_at | formatDate}}<br>
+                <v-icon small>mdi-source-pull</v-icon> {{ this.pullrequest.updated_at | formatDate}}
+            </v-col>
+    </v-row>
+    </v-card-subtitle>
+</v-card>
+</template>
+
+
+<script>
+ import axios from "axios";
+
+export default {
+    props: {
+        pipeline: {
+            type: String,
+            default: "MISSSING"
+        },
+        pullrequest: {
+            type: Object,
+            default: () => ({}),
+        }
+    },
+    data: () => ({
+        deleted: false,
+        loadingState: false,
+    }),
+    methods: {
+        async startReviewApp() {
+            console.log("startReviewApp", this.pullrequest.number);
+            this.loadingState = true;
+
+            axios.post("/api/repo/pullrequest/start", {
+                branch: this.pullrequest.branch,
+                title: this.pullrequest.title,
+                ssh_url: this.pullrequest.ssh_url,
+                pipelineName: this.pipeline,
+            }).then((response) => {
+                console.log("startReviewApp", response);
+            }).catch((error) => {
+                console.log("startReviewApp", error);
+            });
+        },
+    }
+}
+</script>
+
+<style>
+.pr-data {
+    font-size: 0.775rem;
+    color: #747474;
+    padding-top: 0px;
+}
+.v-btn.v-size--default {
+    font-size: 0.675rem;
+}
+
+.mr-1.v-chip.v-size--default {
+    font-size: 12px;
+    height: 28px;
+}
+
+.v-application .text-subtitle-1 {
+    font-size: 0.825rem !important;
+}
+
+.v-application .v-card__title {
+    font-size: 1.1rem;
+}
+
+.pullrequest {
+    outline: dashed 1.3px #747474;
+}
+</style>

client/src/main.js

@@ -13,6 +13,12 @@ router.beforeEach((to, from, next) => {
 Vue.config.productionTip = false
 Vue.use(VueRouter)
 
+Vue.filter('formatDate', function(value) {
+  if (value) {
+    return new Date(value).toLocaleString();
+  }
+});
+
 // vcdount is created in index.html by loadin js from CDN
 //https://www.npmjs.com/package/vue-css-donut-chart
 // eslint-disable-next-line no-undef

src/git/bitbucket.ts

@@ -1,6 +1,6 @@
 import debug from 'debug';
 import * as crypto from "crypto"
-import { IWebhook, IRepository, IWebhookR, IDeploykeyR} from './types';
+import { IWebhook, IRepository, IWebhookR, IDeploykeyR, IPullrequest} from './types';
 import { Repo } from './repo';
 import gitUrlParse = require("git-url-parse");
 debug('app:kubero:bitbucket:api')
@@ -313,4 +313,12 @@ export class BitbucketApi extends Repo {
         return [];
 
     }
+
+    public async getPullrequests(gitrepo: string): Promise<IPullrequest[]>{
+
+        let ret: IPullrequest[] = [];
+
+
+        return ret;
+    }
 }

src/git/gitea.ts

@@ -1,6 +1,6 @@
 import debug from 'debug';
 import * as crypto from "crypto"
-import { IWebhook, IRepository, IWebhookR, IDeploykeyR} from './types';
+import { IWebhook, IRepository, IWebhookR, IDeploykeyR, IPullrequest} from './types';
 import { Repo } from './repo';
 import gitUrlParse = require("git-url-parse");
 debug('app:kubero:gitea:api')
@@ -260,10 +260,7 @@ export class GiteaApi extends Repo {
     public async getBranches(gitrepo: string): Promise<string[]>{
         // https://try.gitea.io/api/swagger#/repository/repoListBranches
         let ret: string[] = [];
-
-        //let repo = "template-nodeapp"
-        //let owner = "gicara"
-
+
         let {repo, owner} = this.parseRepo(gitrepo)
         try {
             const branches = await this.gitea.repos.repoListBranches(owner, repo)
@@ -276,4 +273,43 @@ export class GiteaApi extends Repo {
 
         return ret;
     }
+
+    public async getPullrequests(gitrepo: string): Promise<IPullrequest[]>{
+
+        let ret: IPullrequest[] = [];
+
+        let {repo, owner} = this.parseRepo(gitrepo)
+
+        try {
+            const pulls = await this.gitea.repos.repoListPullRequests(owner, repo, {
+                state: "open",
+                sort: "recentupdate"})
+            for (let pr of pulls.data) {
+                const p: IPullrequest = {
+                    html_url: pr.url,
+                    number: pr.number,
+                    title: pr.title,
+                    state: pr.state,
+                    //draft: pr.draft,
+                    user: {
+                        login: pr.user.login,
+                        avatar_url: pr.user.avatar_url,
+                    },
+                    created_at: pr.created_at,
+                    updated_at: pr.updated_at,
+                    closed_at: pr.closed_at,
+                    merged_at: pr.merged_at,
+                    //locked: pr.locked,
+                    branch: pr.head.ref,
+                    ssh_url: pr.head.repo.ssh_url,
+                }
+                ret.push(p)
+            }
+
+        } catch (error) {
+            debug.log(error)
+        }
+
+        return ret;
+    }
 }