1{{ define "title" }}{{ .Registration.Domain }}{{ end }}
2
3{{ define "content" }}
4 <div class="p-6">
5 <p class="text-xl font-bold dark:text-white">{{ .Registration.Domain }}</p>
6 </div>
7
8 <div class="flex flex-col">
9 {{ block "registration-info" . }} {{ end }}
10 {{ block "members" . }} {{ end }}
11 {{ block "add-member" . }} {{ end }}
12 </div>
13{{ end }}
14
15{{ define "registration-info" }}
16<section class="rounded bg-white dark:bg-gray-800 drop-shadow-sm px-6 py-4 mb-6 w-full lg:w-fit">
17 <dl class="grid grid-cols-[auto_1fr] gap-x-4 dark:text-gray-200">
18 <dt class="font-bold">opened by</dt>
19 <dd>
20 <span>
21 {{ index $.DidHandleMap .Registration.ByDid }} <span class="text-gray-500 dark:text-gray-400 font-mono">{{ .Registration.ByDid }}</span>
22 </span>
23 {{ if eq $.LoggedInUser.Did $.Registration.ByDid }}
24 <span class="text-xs bg-blue-100 dark:bg-blue-900 text-blue-800 dark:text-blue-200 px-2 py-1 rounded ml-2">you</span>
25 {{ end }}
26 </dd>
27
28 <dt class="font-bold">opened</dt>
29 <dd>{{ .Registration.Created | timeFmt }}</dd>
30
31 {{ if .Registration.Registered }}
32 <dt class="font-bold">registered</dt>
33 <dd>{{ .Registration.Registered | timeFmt }}</dd>
34 {{ else }}
35 <dt class="font-bold">status</dt>
36 <dd class="text-yellow-800 dark:text-yellow-200 bg-yellow-100 dark:bg-yellow-900 rounded px-2 py-1 inline-block">
37 Pending Registration
38 </dd>
39 {{ end }}
40 </dl>
41
42 {{ if not .Registration.Registered }}
43 <div class="mt-4">
44 <button
45 class="btn dark:bg-gray-700 dark:text-white dark:hover:bg-gray-600"
46 hx-post="/knots/{{.Domain}}/init"
47 hx-swap="none">
48 Initialize Registration
49 </button>
50 </div>
51 {{ end }}
52</section>
53{{ end }}
54
55{{ define "members" }}
56<h2 class="text-sm font-bold py-2 px-6 uppercase dark:text-gray-300">members</h2>
57<section class="rounded bg-white dark:bg-gray-800 drop-shadow-sm px-6 py-4 mb-6 w-full lg:w-fit">
58 {{ if .Registration.Registered }}
59 <div id="member-list" class="flex flex-col gap-4">
60 {{ range $.Members }}
61 <div class="inline-flex items-center gap-4">
62 {{ i "user" "w-4 h-4 dark:text-gray-300" }}
63 <a href="/{{index $.DidHandleMap .}}" class="text-gray-900 dark:text-white">{{index $.DidHandleMap .}}
64 <span class="text-gray-500 dark:text-gray-400 font-mono">{{.}}</span>
65 </a>
66 </div>
67 {{ else }}
68 <p class="text-gray-500 dark:text-gray-400">No members have been added yet.</p>
69 {{ end }}
70 </div>
71 {{ else }}
72 <p class="text-gray-500 dark:text-gray-400">Members can be added after registration is complete.</p>
73 {{ end }}
74</section>
75{{ end }}
76
77{{ define "add-member" }}
78{{ if $.IsOwner }}
79<h2 class="text-sm font-bold py-2 px-6 uppercase dark:text-gray-300">add member</h2>
80<section class="rounded bg-white dark:bg-gray-800 drop-shadow-sm px-6 py-4 mb-6 w-full lg:w-fit">
81 <form
82 hx-put="/knots/{{.Registration.Domain}}/member"
83 class="max-w-2xl space-y-4">
84 <input
85 type="text"
86 id="member"
87 name="member"
88 placeholder="did or handle"
89 required
90 class="w-full dark:bg-gray-700 dark:text-white dark:border-gray-600 dark:placeholder-gray-400"/>
91
92 <button class="btn dark:bg-gray-700 dark:text-white dark:hover:bg-gray-600" type="submit">add member</button>
93
94 <div id="add-member-error" class="error dark:text-red-400"></div>
95 </form>
96</section>
97{{ end }}
98{{ end }}