Have distinct differense between skipped and canceled status (#6267)

cmd/server/openapi/docs.go

@@ -5557,11 +5557,11 @@ const docTemplate = `{
                 "StatusKilled": "killed by user",
                 "StatusPending": "pending to be executed",
                 "StatusRunning": "currently running",
-                "StatusSkipped": "skipped as another step failed",
+                "StatusSkipped": "skipped as per condition of current workflow failed/success state",
                 "StatusSuccess": "successfully finished"
             },
             "x-enum-descriptions": [
-                "skipped as another step failed",
+                "skipped as per condition of current workflow failed/success state",
                 "pending to be executed",
                 "currently running",
                 "successfully finished",

server/model/const.go

@@ -55,7 +55,7 @@ func (s WebhookEvent) Validate() error {
 type StatusValue string //	@name	StatusValue
 
 const (
-	StatusSkipped  StatusValue = "skipped"  // skipped as another step failed
+	StatusSkipped  StatusValue = "skipped"  // skipped as per condition of current workflow failed/success state
 	StatusPending  StatusValue = "pending"  // pending to be executed
 	StatusRunning  StatusValue = "running"  // currently running
 	StatusSuccess  StatusValue = "success"  // successfully finished

web/src/assets/locales/en.json

@@ -224,6 +224,7 @@
         "cancel": "Cancel",
         "restart": "Restart",
         "canceled": "This step has been canceled.",
+        "skipped": "This step has been skipped.",
         "cancel_success": "Pipeline canceled",
         "deploy": "Deploy",
         "restart_success": "Pipeline restarted",
@@ -258,6 +259,7 @@
         "running": "running",
         "started": "started",
         "skipped": "skipped",
+        "canceled": "canceled",
         "success": "success",
         "declined": "declined",
         "error": "error",

web/src/components/repo/pipeline/PipelineLog.vue

@@ -102,6 +102,7 @@
 
       <div class="text-wp-text-alt-100 m-auto text-xl">
         <span v-if="step?.state === 'canceled'">{{ $t('repo.pipeline.actions.canceled') }}</span>
+        <span v-else-if="step?.state === 'skipped'">{{ $t('repo.pipeline.actions.skipped') }}</span>
         <span v-else-if="!step?.started">{{ $t('repo.pipeline.step_not_started') }}</span>
         <div v-else-if="!loadedLogs">{{ $t('repo.pipeline.loading') }}</div>
         <div v-else-if="log?.length === 0">{{ $t('repo.pipeline.no_logs') }}</div>

web/src/components/repo/pipeline/PipelineStatusIcon.vue

@@ -44,7 +44,7 @@ const statusDescriptions = {
   pending: t('repo.pipeline.status.pending'),
   running: t('repo.pipeline.status.running'),
   skipped: t('repo.pipeline.status.skipped'),
-  canceled: t('repo.pipeline.status.skipped'),
+  canceled: t('repo.pipeline.status.canceled'),
   started: t('repo.pipeline.status.started'),
   success: t('repo.pipeline.status.success'),
 } satisfies {