kot.pink
1{{ define "title" }}{{.Spindle.Instance}} · spindles{{ end }}
2
3{{ define "content" }}
4<div class="px-6 py-4">
5 <div class="flex justify-between items-center">
6 <h1 class="text-xl font-bold dark:text-white">{{ .Spindle.Instance }}</h1>
7 <div id="right-side" class="flex gap-2">
8 {{ $style := "px-2 py-1 rounded flex items-center flex-shrink-0 gap-2" }}
9 {{ $isOwner := and .LoggedInUser (eq .LoggedInUser.Did .Spindle.Owner) }}
10 {{ if .Spindle.Verified }}
11 <span class="bg-green-100 text-green-800 dark:bg-green-900 dark:text-green-200 {{$style}}">{{ i "shield-check" "w-4 h-4" }} verified</span>
12 {{ if $isOwner }}
13 {{ template "spindles/fragments/addMemberModal" .Spindle }}
14 {{ end }}
15 {{ else }}
16 <span class="bg-red-100 text-red-800 dark:bg-red-900 dark:text-red-200 {{$style}}">{{ i "shield-off" "w-4 h-4" }} unverified</span>
17 {{ if $isOwner }}
18 {{ block "retryButton" .Spindle }} {{ end }}
19 {{ end }}
20 {{ end }}
21
22 {{ if $isOwner }}
23 {{ block "deleteButton" .Spindle }} {{ end }}
24 {{ end }}
25 </div>
26 </div>
27 <div id="operation-error" class="dark:text-red-400"></div>
28</div>
29
30{{ if .Members }}
31 <section class="bg-white dark:bg-gray-800 p-6 rounded relative w-full mx-auto drop-shadow-sm dark:text-white">
32 <div class="flex flex-col gap-2">
33 {{ block "member" . }} {{ end }}
34 </div>
35 </section>
36{{ end }}
37{{ end }}
38
39
40{{ define "member" }}
41 {{ range .Members }}
42 <div>
43 <div class="flex justify-between items-center">
44 <div class="flex items-center gap-2">
45 {{ template "user/fragments/picHandleLink" . }}
46 </div>
47 {{ if ne $.LoggedInUser.Did . }}
48 {{ block "removeMemberButton" (list $ . ) }} {{ end }}
49 {{ end }}
50 </div>
51 <div class="ml-2 pl-2 pt-2 border-l border-gray-200 dark:border-gray-700">
52 {{ $repos := index $.Repos . }}
53 {{ range $repos }}
54 <div class="flex gap-2 items-center">
55 {{ i "book-marked" "size-4" }}
56 <a href="/{{ .Did }}/{{ .Name }}">
57 {{ .Name }}
58 </a>
59 </div>
60 {{ else }}
61 <div class="text-gray-500 dark:text-gray-400">
62 No repositories configured yet.
63 </div>
64 {{ end }}
65 </div>
66 </div>
67 {{ end }}
68{{ end }}
69
70{{ define "deleteButton" }}
71 <button
72 class="btn text-red-500 hover:text-red-700 dark:text-red-400 dark:hover:text-red-300 gap-2 group"
73 title="Delete spindle"
74 hx-delete="/spindles/{{ .Instance }}"
75 hx-swap="outerHTML"
76 hx-confirm="Are you sure you want to delete the spindle '{{ .Instance }}'?"
77 hx-headers='{"shouldRedirect": "true"}'
78 >
79 {{ i "trash-2" "w-5 h-5" }}
80 <span class="hidden md:inline">delete</span>
81 {{ i "loader-circle" "w-4 h-4 animate-spin hidden group-[.htmx-request]:inline" }}
82 </button>
83{{ end }}
84
85
86{{ define "retryButton" }}
87 <button
88 class="btn gap-2 group"
89 title="Retry spindle verification"
90 hx-post="/spindles/{{ .Instance }}/retry"
91 hx-swap="none"
92 hx-headers='{"shouldRefresh": "true"}'
93 >
94 {{ i "rotate-ccw" "w-5 h-5" }}
95 <span class="hidden md:inline">retry</span>
96 {{ i "loader-circle" "w-4 h-4 animate-spin hidden group-[.htmx-request]:inline" }}
97 </button>
98{{ end }}
99
100
101{{ define "removeMemberButton" }}
102 {{ $root := index . 0 }}
103 {{ $member := index . 1 }}
104 <button
105 class="btn text-red-500 hover:text-red-700 dark:text-red-400 dark:hover:text-red-300 gap-2 group"
106 title="Remove member"
107 hx-post="/spindles/{{ $root.Spindle.Instance }}/remove"
108 hx-swap="none"
109 hx-vals='{"member": "{{$member}}" }'
110 hx-confirm="Are you sure you want to remove {{ resolve $member }} from this instance?"
111 >
112 {{ i "user-minus" "w-4 h-4" }}
113 remove
114 {{ i "loader-circle" "w-4 h-4 animate-spin hidden group-[.htmx-request]:inline" }}
115 </button>
116{{ end }}
117