From 33329c3aa11b32456019fe4504a5debb48785830 Mon Sep 17 00:00:00 2001
From: Olivier Vernin <olivier.vernin@suse.com>
Date: Wed, 6 Nov 2024 17:27:25 +0100
Subject: [PATCH] feat: allow to filter reports by scmid

Signed-off-by: Olivier Vernin <olivier.vernin@suse.com>
---
 src/components/scm/_filter.vue     | 125 +++++++++++++++++++++++++++++
 src/components/scm/_summary.vue    |  52 ++++++++++++
 src/views/pipeline/ReportsView.vue |  17 +++-
 3 files changed, 191 insertions(+), 3 deletions(-)
 create mode 100644 src/components/scm/_filter.vue
 create mode 100644 src/components/scm/_summary.vue

diff --git a/src/components/scm/_filter.vue b/src/components/scm/_filter.vue
new file mode 100644
index 000000000..1652f0f36
--- /dev/null
+++ b/src/components/scm/_filter.vue
@@ -0,0 +1,125 @@
+<template>
+  <v-container
+      class="py-8 px-6"
+      fluid
+  >
+    <v-form v-model="filterForm" @submit.prevent="applyFilter">
+      <!-- Repository Dropdown -->
+       <v-select
+        label="Git Repository"
+        :items="repositories"
+        :rules="[v => !!v || 'Git repository is required']"
+        v-model="repository"
+        ></v-select>
+
+       <v-select
+        label="Git Branch"
+        :items="branches"
+        :rules="[v => !!v || 'Git branch is required']"
+        v-model="branch"
+        ></v-select>
+      
+        <!-- Filter repository-->
+        <!--<v-btn type="submit" color="primary" :disabled="!filterForm">Filter</v-btn>-->
+    </v-form>
+
+  </v-container>
+</template>
+
+<script>
+export default {
+  name: 'PipelineSCMS',
+
+  props: {
+    scmid: {},
+  },
+
+  data: () => ({
+    isLoading: true,
+    filterForm: false,
+    scms: [],
+    repository: "",
+    repositories : [],
+    branches: [],
+    branch : "",
+  }),
+
+  beforeUnmount() {
+    this.cancelAutoUpdate();
+  },
+
+  computed: {
+  },
+
+  methods: {
+    async getSCMSData() {
+      const token = await this.$auth0.getAccessTokenSilently();
+      const response = await fetch('/api/pipeline/scms', {
+          headers: {
+          Authorization: `Bearer ${token}`
+        }
+      });
+      const data = await response.json();
+      this.isLoading = false
+      this.scms = data.scms
+      this.repositories = this.scms.map(scm => scm.URL)
+
+      if (this.repositories.length > 0) {
+        this.repository = this.repositories[0]
+      }
+    },
+
+    getScmID(url, branch) {
+      return this.scms.find(scm => scm.URL === url && scm.Branch === branch).ID
+    },
+
+    applyFilter() {
+      var scmid = this.getScmID(this.repository, this.branch)
+      this.$emit('update-scmid', scmid)
+    },
+
+    cancelAutoUpdate() {
+      clearInterval(this.timer);
+    },
+  },
+
+  watch: {
+      isLoading (val) {
+        val && setTimeout(() => {
+          this.isLoading = false
+        }, 3000)
+      },
+
+      repository (val) {
+        var b = []
+        for (var i =0 ; i < this.scms.length; i++) {
+          if (this.scms[i].URL == val) {
+              if (this.scms[i].Branch == "main") {
+                this.branch = "main"
+              }
+
+              if (this.scms[i].Branch == "master" && this.branch == "" ){  
+                this.branch = "master"
+              }
+            b.push(this.scms[i].Branch)
+          }
+        }
+
+        this.branches = b
+        this.applyFilter()
+      },
+
+      branch () {
+        this.applyFilter()
+      },
+  },
+
+  async created() {
+    try {
+      this.getSCMSData()
+    } catch (error) {
+      console.log(error);
+    }
+  },
+}
+</script>
diff --git a/src/components/scm/_summary.vue b/src/components/scm/_summary.vue
new file mode 100644
index 000000000..5fe727732
--- /dev/null
+++ b/src/components/scm/_summary.vue
@@ -0,0 +1,52 @@
+<template>
+    <v-card>
+        <v-card-title
+            class="text-center"
+        >
+            <h2>{{ sanitizeURL(data.URL) }} - {{ data.Branch }}</h2>
+        </v-card-title>
+    </v-card>
+</template>
+
+<script>
+export default {
+    name: "SCMSummary",
+    props: {
+        scmid: {},
+    },
+
+    data: () => ({
+        data: {},
+    }),
+
+    methods: {
+        sanitizeURL: function(url) {
+            if (url === undefined) {
+                return "";
+            }
+
+            url = url.replace(/https?:\/\//, '');
+            url = url.replace(/http?:\/\//, '');
+            url = url.replace(/\/$/, '');
+            url = url.replace(/\.git$/, '');
+
+            return url;
+        },
+    },
+
+    async created() {
+        try {
+            const token = await this.$auth0.getAccessTokenSilently();
+            const response = await fetch(`/api/pipeline/scms?scmid=${this.scmid}`, {
+                headers: {
+                    Authorization: `Bearer ${token}`
+                }
+            });
+            const data = await response.json();
+            this.data = data.scms[0];
+        } catch (error) {
+            console.error(error);
+        }
+    },
+}
+</script>
\ No newline at end of file
diff --git a/src/views/pipeline/ReportsView.vue b/src/views/pipeline/ReportsView.vue
index 8ce616352..f040c1a8f 100644
--- a/src/views/pipeline/ReportsView.vue
+++ b/src/views/pipeline/ReportsView.vue
@@ -19,7 +19,8 @@
           </v-col>
         </v-row>
       </v-container>
-      <PipelineReports/>
+      <PipelineSCMFilter :scmid="scmid" @update-scmid="updateSCMID"/>
+      <PipelineReports :scmid="scmid" @update-scmid="updateSCMID"/>
     </v-main>
 
     <ReleaseFooter/>
@@ -33,6 +34,8 @@ import SideNavigation from '../../components/SideNavigation.vue';
 import HeadNavigation from '../../components/HeadNavigation.vue';
 import PipelineReports from '../../components/pipeline/reports.vue';
 
+import PipelineSCMSFilter from '../../components/scm/_filter.vue';
+
 export default {
   name: 'PipelineReportsView',
   components: {
@@ -40,6 +43,7 @@ export default {
     SideNavigation,
     HeadNavigation,
     PipelineReports,
+    PipelineSCMFilter: PipelineSCMSFilter,
   },
   data: () => ({
     links:[
@@ -48,7 +52,14 @@ export default {
       to: "https://www.updatecli.io",
       icon: "mdi-arrow-right-circle",
       },
-  ]
-  })
+  ],
+    scmid: "",
+  }),
+
+  methods: {
+    updateSCMID(scmid) {
+      this.scmid = scmid;
+    },
+  }
 }
 </script>