1{{ define "title" }}settings{{ end }}
2
3{{ define "content" }}
4 <div class="p-6">
5 <p class="text-xl font-bold dark:text-white">Settings</p>
6 </div>
7 <div class="flex flex-col">
8 {{ block "profile" . }} {{ end }}
9 {{ block "keys" . }} {{ end }}
10 {{ block "emails" . }} {{ end }}
11 </div>
12{{ end }}
13
14{{ define "profile" }}
15<h2 class="text-sm font-bold py-2 px-6 uppercase dark:text-gray-300">profile</h2>
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 {{ if .LoggedInUser.Handle }}
19 <dt class="font-bold">handle</dt>
20 <dd>@{{ .LoggedInUser.Handle }}</dd>
21 {{ end }}
22 <dt class="font-bold">did</dt>
23 <dd>{{ .LoggedInUser.Did }}</dd>
24 <dt class="font-bold">pds</dt>
25 <dd>{{ .LoggedInUser.Pds }}</dd>
26 </dl>
27</section>
28{{ end }}
29
30{{ define "keys" }}
31<h2 class="text-sm font-bold py-2 px-6 uppercase dark:text-gray-300">ssh keys</h2>
32<section class="rounded bg-white dark:bg-gray-800 drop-shadow-sm px-6 py-4 mb-6 w-full lg:w-fit">
33 <p class="mb-8 dark:text-gray-300">SSH public keys added here will be broadcasted to knots that you are a member of, <br> allowing you to push to repositories there.</p>
34 <div id="key-list" class="flex flex-col gap-6 mb-8">
35 {{ range $index, $key := .PubKeys }}
36 <div class="grid grid-cols-[minmax(0,1fr)_auto] items-center gap-4">
37 <div class="flex flex-col gap-1">
38 <div class="inline-flex items-center gap-4">
39 {{ i "key" "w-3 h-3 dark:text-gray-300" }}
40 <p class="font-bold dark:text-white">{{ .Name }}</p>
41 </div>
42 <p class="text-sm text-gray-500 dark:text-gray-400">added {{ .Created | timeFmt }}</p>
43 <div class="overflow-x-auto whitespace-nowrap flex-1 max-w-full">
44 <code class="text-sm text-gray-500 dark:text-gray-400">{{ .Key }}</code>
45 </div>
46 </div>
47 <button
48 class="btn text-red-500 hover:text-red-700 dark:text-red-400 dark:hover:text-red-300 gap-2"
49 title="Delete key"
50 hx-delete="/settings/keys?name={{urlquery .Name}}&rkey={{urlquery .Rkey}}&key={{urlquery .Key}}"
51 hx-confirm="Are you sure you want to delete the key '{{ .Name }}'?">
52 {{ i "trash-2" "w-5 h-5" }}
53 <span class="hidden md:inline">delete</span>
54 </button>
55 </div>
56 {{ end }}
57 </div>
58 <form
59 hx-put="/settings/keys"
60 hx-swap="none"
61 class="max-w-2xl mb-8 space-y-4"
62 >
63 <input
64 type="text"
65 id="name"
66 name="name"
67 placeholder="key name"
68 required
69 class="w-full dark:bg-gray-700 dark:text-white dark:border-gray-600 dark:placeholder-gray-400"/>
70
71 <input
72 id="key"
73 name="key"
74 placeholder="ssh-rsa AAAAAA..."
75 required
76 class="w-full dark:bg-gray-700 dark:text-white dark:border-gray-600 dark:placeholder-gray-400"/>
77
78 <button class="btn dark:bg-gray-700 dark:text-white dark:hover:bg-gray-600" type="submit">add key</button>
79
80 <div id="settings-keys" class="error dark:text-red-400"></div>
81 </form>
82</section>
83{{ end }}
84
85{{ define "emails" }}
86<h2 class="text-sm font-bold py-2 px-6 uppercase dark:text-gray-300">email addresses</h2>
87<section class="rounded bg-white dark:bg-gray-800 drop-shadow-sm px-6 py-4 mb-6 w-full lg:w-fit">
88<p class="mb-8 dark:text-gray-300">Commits authored using emails listed here will be associated with your Tangled profile.</p>
89 <div id="email-list" class="flex flex-col gap-6 mb-8">
90 {{ range $index, $email := .Emails }}
91 <div class="grid grid-cols-[minmax(0,1fr)_auto] items-center gap-4">
92 <div class="flex flex-col gap-2">
93 <div class="inline-flex items-center gap-4">
94 {{ i "mail" "w-3 h-3 dark:text-gray-300" }}
95 <p class="font-bold dark:text-white">{{ .Address }}</p>
96 <div class="inline-flex items-center gap-1">
97 {{ if .Verified }}
98 <span class="text-xs bg-green-100 text-green-800 dark:bg-green-900 dark:text-green-200 px-2 py-1 rounded">verified</span>
99 {{ else }}
100 <span class="text-xs bg-yellow-100 text-yellow-800 dark:bg-yellow-900 dark:text-yellow-200 px-2 py-1 rounded">unverified</span>
101 {{ end }}
102 {{ if .Primary }}
103 <span class="text-xs bg-blue-100 text-blue-800 dark:bg-blue-900 dark:text-blue-200 px-2 py-1 rounded">primary</span>
104 {{ end }}
105 </div>
106 </div>
107 <p class="text-sm text-gray-500 dark:text-gray-400">added {{ .CreatedAt | timeFmt }}</p>
108 </div>
109 <div class="flex gap-2 items-center">
110 {{ if not .Verified }}
111 <button
112 class="btn flex gap-2 dark:bg-gray-700 dark:text-white dark:hover:bg-gray-600"
113 hx-post="/settings/emails/verify/resend"
114 hx-swap="none"
115 href="#"
116 hx-vals='{"email": "{{ .Address }}"}'>
117 {{ i "rotate-cw" "w-5 h-5" }}
118 <span class="hidden md:inline">resend</span>
119 </button>
120 {{ end }}
121 {{ if and (not .Primary) .Verified }}
122 <a
123 class="text-sm dark:text-blue-400 dark:hover:text-blue-300"
124 hx-post="/settings/emails/primary"
125 hx-swap="none"
126 href="#"
127 hx-vals='{"email": "{{ .Address }}"}'>
128 set as primary
129 </a>
130 {{ end }}
131 {{ if not .Primary }}
132 <form hx-delete="/settings/emails" hx-confirm="Are you sure you wish to delete the email '{{ .Address }}'?">
133 <input type="hidden" name="email" value="{{ .Address }}">
134 <button
135 class="btn text-red-500 hover:text-red-700 dark:text-red-400 dark:hover:text-red-300"
136 title="Delete email"
137 type="submit">
138 {{ i "trash-2" "w-5 h-5" }}
139 <span class="hidden md:inline">delete</span>
140 </button>
141 </form>
142 {{ end }}
143 </div>
144 </div>
145 {{ end }}
146 </div>
147 <form
148 hx-put="/settings/emails"
149 hx-swap="none"
150 class="max-w-2xl mb-8 space-y-4"
151 >
152 <input
153 type="email"
154 id="email"
155 name="email"
156 placeholder="your@email.com"
157 required
158 class="w-full dark:bg-gray-700 dark:text-white dark:border-gray-600 dark:placeholder-gray-400"/>
159
160 <button class="btn dark:bg-gray-700 dark:text-white dark:hover:bg-gray-600" type="submit">add email</button>
161
162 <div id="settings-emails-error" class="error dark:text-red-400"></div>
163 <div id="settings-emails-success" class="success dark:text-green-400"></div>
164
165 </form>
166</section>
167{{ end }}