this repo has no description
tangled.org
1{{ define "repo/fragments/pipelineStatusSymbol" }}
2 <div class="group relative inline-block">
3 {{ block "icon" $ }} {{ end }}
4 {{ block "tooltip" $ }} {{ end }}
5 </div>
6{{ end }}
7
8{{ define "icon" }}
9<div class="cursor-pointer">
10 {{ $c := .Counts }}
11 {{ $statuses := .Statuses }}
12 {{ $total := len $statuses }}
13 {{ $success := index $c "success" }}
14 {{ $allPass := eq $success $total }}
15
16 {{ if $allPass }}
17 <div class="flex gap-1 items-center">
18 {{ i "check" "size-4 text-green-600 dark:text-green-400 " }}
19 <span>{{ $total }}/{{ $total }}</span>
20 </div>
21 {{ else }}
22 {{ $radius := f64 8 }}
23 {{ $circumference := mulf64 2.0 (mulf64 3.1416 $radius) }}
24 {{ $offset := 0.0 }}
25 <div class="flex gap-1 items-center">
26 <svg class="w-4 h-4 transform -rotate-90" viewBox="0 0 20 20">
27 <circle cx="10" cy="10" r="{{ $radius }}" fill="none" stroke="#f3f4f633" stroke-width="2"/>
28
29 {{ range $kind, $count := $c }}
30 {{ $color := "" }}
31 {{ if or (eq $kind "pending") (eq $kind "running") }}
32 {{ $color = "#eab308" }}
33 {{ else if eq $kind "success" }}
34 {{ $color = "#10b981" }}
35 {{ else if eq $kind "cancelled" }}
36 {{ $color = "#6b7280" }}
37 {{ else }}
38 {{ $color = "#ef4444" }}
39 {{ end }}
40
41 {{ $percent := divf64 (f64 $count) (f64 $total) }}
42 {{ $length := mulf64 $percent $circumference }}
43
44 <circle
45 cx="10" cy="10" r="{{ $radius }}"
46 fill="none"
47 stroke="{{ $color }}"
48 stroke-width="2"
49 stroke-dasharray="{{ printf "%.2f %.2f" $length (subf64 $circumference $length) }}"
50 stroke-dashoffset="{{ printf "%.2f" (negf64 $offset) }}"
51 />
52 {{ $offset = addf64 $offset $length }}
53 {{ end }}
54 </svg>
55 <span>{{$success}}/{{ $total }}</span>
56 </div>
57 {{ end }}
58</div>
59{{ end }}
60
61{{ define "tooltip" }}
62<div class="absolute z-[9999] hidden group-hover:block bg-white dark:bg-gray-900 text-sm text-black dark:text-white rounded-md shadow p-2 w-80 top-full mt-2">
63 <div class="flex flex-col divide-y divide-gray-200 dark:divide-gray-700">
64 {{ range $name, $all := .Statuses }}
65 <div class="flex items-center justify-between p-1">
66 {{ $lastStatus := $all.Latest }}
67 {{ $kind := $lastStatus.Status.String }}
68
69 {{ $icon := "dot" }}
70 {{ $color := "text-gray-600 dark:text-gray-500" }}
71 {{ $text := "Failed" }}
72 {{ $time := "" }}
73
74 {{ if eq $kind "pending" }}
75 {{ $icon = "circle-dashed" }}
76 {{ $color = "text-yellow-600 dark:text-yellow-500" }}
77 {{ $text = "Queued" }}
78 {{ $time = timeFmt $lastStatus.Created }}
79 {{ else if eq $kind "running" }}
80 {{ $icon = "circle-dashed" }}
81 {{ $color = "text-yellow-600 dark:text-yellow-500" }}
82 {{ $text = "Running" }}
83 {{ $time = timeFmt $lastStatus.Created }}
84 {{ else if eq $kind "success" }}
85 {{ $icon = "check" }}
86 {{ $color = "text-green-600 dark:text-green-500" }}
87 {{ $text = "Success" }}
88 {{ with $all.TimeTaken }}
89 {{ $time = durationFmt . }}
90 {{ end }}
91 {{ else if eq $kind "cancelled" }}
92 {{ $icon = "circle-slash" }}
93 {{ $color = "text-gray-600 dark:text-gray-500" }}
94 {{ $text = "Cancelled" }}
95 {{ with $all.TimeTaken }}
96 {{ $time = durationFmt . }}
97 {{ end }}
98 {{ else }}
99 {{ $icon = "x" }}
100 {{ $color = "text-red-600 dark:text-red-500" }}
101 {{ $text = "Failed" }}
102 {{ with $all.TimeTaken }}
103 {{ $time = durationFmt . }}
104 {{ end }}
105 {{ end }}
106
107 <div id="left" class="flex items-center gap-2 flex-shrink-0">
108 {{ i $icon "size-4" $color }}
109 {{ $name }}
110 </div>
111 <div id="right" class="flex items-center gap-2 flex-shrink-0">
112 <span class="font-bold">{{ $text }}</span>
113 <time class="text-gray-400 dark:text-gray-600">{{ $time }}</time>
114 </div>
115 </div>
116 {{ end }}
117 </div>
118</div>
119{{ end }}