forked from
tangled.org/core
Monorepo for Tangled
1{{ define "fragments/comment/reply" }}
2 <form
3 class="p-2 group w-full border-t border-gray-200 dark:border-gray-700 flex flex-col gap-2"
4 hx-post="/comment"
5 hx-swap="none"
6 hx-trigger="submit, keydown[(ctrlKey || metaKey) && key=='Enter'] from:find textarea"
7 hx-on::after-request="if(event.detail.successful) this.reset()"
8 hx-disabled-elt="find button[type='submit']"
9 >
10 {{ template "user/fragments/picHandleLink" .LoggedInUser.Did }}
11 <textarea
12 name="body"
13 class="w-full p-2"
14 placeholder="Leave a reply..."
15 autofocus
16 rows="3"></textarea>
17 <div id="comment-error" class="error"></div>
18 {{ template "replyActions" . }}
19 </form>
20{{ end }}
21
22{{ define "replyActions" }}
23 <div class="flex flex-wrap items-stretch justify-end gap-2 text-gray-500 dark:text-gray-400 text-sm">
24 {{ template "cancel" . }}
25 {{ template "reply" . }}
26 </div>
27{{ end }}
28
29{{ define "cancel" }}
30 <button
31 class="btn text-red-500 dark:text-red-400 flex gap-2 items-center group"
32 hx-get="/comment/reply/placeholder"
33 hx-target="closest form"
34 hx-swap="outerHTML"
35 >
36 {{ i "x" "size-4" }}
37 cancel
38 </button>
39{{ end }}
40
41{{ define "reply" }}
42 <button
43 type="submit"
44 class="btn-create flex items-center gap-2 no-underline hover:no-underline"
45 >
46 {{ i "reply" "w-4 h-4 inline group-[.htmx-request]:hidden" }}
47 {{ i "loader-circle" "w-4 h-4 animate-spin hidden group-[.htmx-request]:inline" }}
48 reply
49 </button>
50{{ end }}