From 78ebd55acc214607ad91b4f8bb67fb2cf96c375f Mon Sep 17 00:00:00 2001
From: qwerty287 <80460567+qwerty287@users.noreply.github.com>
Date: Sun, 17 Sep 2023 12:32:23 +0200
Subject: [PATCH] Some UI enhancement (#2468)

- Closes #2001
-
https://github.com/woodpecker-ci/woodpecker/discussions/2162#discussioncomment-6666895
- shows prettyRef for deployments
---
 web/.prettierignore                           |  2 +-
 .../pipeline-feed/PipelineFeedItem.vue        |  9 ++++-
 .../repo/pipeline/PipelineStepList.vue        | 35 +++++++++++--------
 web/src/compositions/usePipeline.ts           |  2 +-
 4 files changed, 31 insertions(+), 17 deletions(-)

diff --git a/web/.prettierignore b/web/.prettierignore
index 10541e2f8..894191488 100644
--- a/web/.prettierignore
+++ b/web/.prettierignore
@@ -4,5 +4,5 @@ coverage/
 LICENSE
 components.d.ts
 src/assets/locales/*.json
-src/assets/timeAgoLocales/*.json
+src/assets/timeAgoLocales/
 !src/assets/locales/en.json
diff --git a/web/src/components/pipeline-feed/PipelineFeedItem.vue b/web/src/components/pipeline-feed/PipelineFeedItem.vue
index 3e6b91f22..1d7790bf7 100644
--- a/web/src/components/pipeline-feed/PipelineFeedItem.vue
+++ b/web/src/components/pipeline-feed/PipelineFeedItem.vue
@@ -2,7 +2,14 @@
   <div v-if="pipeline" class="flex text-wp-text-100 w-full">
     <PipelineStatusIcon :status="pipeline.status" class="flex items-center" />
     <div class="flex flex-col ml-4 min-w-0">
-      <span class="underline">{{ repo?.owner }} / {{ repo?.name }}</span>
+      <router-link
+        :to="{
+          name: 'repo',
+          params: { repoId: pipeline.repo_id },
+        }"
+        class="underline"
+        >{{ repo?.owner }} / {{ repo?.name }}</router-link
+      >
       <span class="whitespace-nowrap overflow-hidden overflow-ellipsis" :title="message">{{ title }}</span>
       <div class="flex flex-col mt-2">
         <div class="flex space-x-2 items-center" :title="created">
diff --git a/web/src/components/repo/pipeline/PipelineStepList.vue b/web/src/components/repo/pipeline/PipelineStepList.vue
index 99d45d8ca..11e5e363d 100644
--- a/web/src/components/repo/pipeline/PipelineStepList.vue
+++ b/web/src/components/repo/pipeline/PipelineStepList.vue
@@ -10,21 +10,28 @@
         </div>
         <span>{{ pipeline.author }}</span>
       </div>
-      <div class="flex space-x-1 items-center min-w-0">
+      <a
+        v-if="pipeline.event === 'pull_request'"
+        class="flex items-center space-x-1 text-wp-link-100 hover:text-wp-link-200 min-w-0"
+        :href="pipeline.link_url"
+      >
+        <Icon name="pull_request" />
+        <span class="truncate">{{ prettyRef }}</span>
+      </a>
+      <router-link
+        v-else-if="pipeline.event === 'push' || pipeline.event === 'manual' || pipeline.event === 'deployment'"
+        class="flex items-center space-x-1 text-wp-link-100 hover:text-wp-link-200 min-w-0"
+        :to="{ name: 'repo-branch', params: { branch: prettyRef } }"
+      >
         <Icon v-if="pipeline.event === 'manual'" name="manual-pipeline" />
-        <Icon v-if="pipeline.event === 'push'" name="push" />
-        <Icon v-if="pipeline.event === 'deployment'" name="deployment" />
-        <Icon v-else-if="pipeline.event === 'tag'" name="tag" />
-        <a
-          v-else-if="pipeline.event === 'pull_request'"
-          class="flex items-center space-x-1 text-wp-link-100 hover:text-wp-link-200 min-w-0"
-          :href="pipeline.link_url"
-          target="_blank"
-        >
-          <Icon name="pull_request" />
-          <span class="truncate">{{ prettyRef }}</span>
-        </a>
-        <span v-if="pipeline.event !== 'pull_request'" class="truncate">{{ prettyRef }}</span>
+        <Icon v-else-if="pipeline.event === 'push'" name="push" />
+        <Icon v-else-if="pipeline.event === 'deployment'" name="deployment" />
+        <span class="truncate">{{ prettyRef }}</span>
+      </router-link>
+      <div v-else class="flex space-x-1 items-center min-w-0">
+        <Icon v-if="pipeline.event === 'tag'" name="tag" />
+
+        <span class="truncate">{{ prettyRef }}</span>
       </div>
       <div class="flex items-center flex-shrink-0">
         <template v-if="pipeline.event === 'pull_request'">
diff --git a/web/src/compositions/usePipeline.ts b/web/src/compositions/usePipeline.ts
index e10a7c9f8..c12a1fab0 100644
--- a/web/src/compositions/usePipeline.ts
+++ b/web/src/compositions/usePipeline.ts
@@ -87,7 +87,7 @@ export default (pipeline: Ref<Pipeline | undefined>) => {
   const title = computed(() => message.value.split('\n')[0]);
 
   const prettyRef = computed(() => {
-    if (pipeline.value?.event === 'push') {
+    if (pipeline.value?.event === 'push' || pipeline.value?.event === 'deployment') {
       return pipeline.value.branch;
     }