tangled.org
oppi.li
+37
-45
appview/pages/templates/repo/issues/fragments/editIssueComment.html
+37
-45
appview/pages/templates/repo/issues/fragments/editIssueComment.html
···
1
1
{{ define "repo/issues/fragments/editIssueComment" }}
2
-
{{ with .Comment }}
3
-
<div id="comment-container-{{.CommentId}}">
4
-
<div class="flex items-center gap-2 mb-2 text-gray-500 dark:text-gray-400 text-sm flex-wrap">
5
-
{{ $owner := didOrHandle $.LoggedInUser.Did $.LoggedInUser.Handle }}
6
-
<a href="/{{ $owner }}" class="no-underline hover:underline">{{ $owner }}</a>
2
+
<div id="comment-body-{{.Comment.Id}}" class="pt-2">
3
+
<textarea
4
+
id="edit-textarea-{{ .Comment.Id }}"
5
+
name="body"
6
+
class="w-full p-2 rounded border border-gray-200 dark:border-gray-700"
7
+
rows="5"
8
+
autofocus>{{ .Comment.Body }}</textarea>
7
9
8
-
<!-- show user "hats" -->
9
-
{{ $isIssueAuthor := eq .OwnerDid $.Issue.OwnerDid }}
10
-
{{ if $isIssueAuthor }}
11
-
<span class="before:content-['·']"></span>
12
-
author
13
-
{{ end }}
14
-
15
-
<span class="before:content-['·']"></span>
16
-
<a
17
-
href="#{{ .CommentId }}"
18
-
class="text-gray-500 dark:text-gray-400 hover:text-gray-500 dark:hover:text-gray-400 hover:underline no-underline"
19
-
id="{{ .CommentId }}">
20
-
{{ template "repo/fragments/time" .Created }}
21
-
</a>
22
-
23
-
<button
24
-
class="btn px-2 py-1 flex items-center gap-2 text-sm group"
25
-
hx-post="/{{ $.RepoInfo.FullName }}/issues/{{ .Issue }}/comment/{{ .CommentId }}/edit"
26
-
hx-include="#edit-textarea-{{ .CommentId }}"
27
-
hx-target="#comment-container-{{ .CommentId }}"
28
-
hx-swap="outerHTML">
29
-
{{ i "check" "w-4 h-4" }}
30
-
{{ i "loader-circle" "w-4 h-4 animate-spin hidden group-[.htmx-request]:inline" }}
31
-
</button>
32
-
<button
33
-
class="btn px-2 py-1 flex items-center gap-2 text-sm"
34
-
hx-get="/{{ $.RepoInfo.FullName }}/issues/{{ .Issue }}/comment/{{ .CommentId }}/"
35
-
hx-target="#comment-container-{{ .CommentId }}"
36
-
hx-swap="outerHTML">
37
-
{{ i "x" "w-4 h-4" }}
38
-
</button>
39
-
<span id="comment-{{.CommentId}}-status"></span>
40
-
</div>
10
+
{{ template "editActions" $ }}
11
+
</div>
12
+
{{ end }}
41
13
42
-
<div>
43
-
<textarea
44
-
id="edit-textarea-{{ .CommentId }}"
45
-
name="body"
46
-
class="w-full p-2 border rounded min-h-[100px]">{{ .Body }}</textarea>
47
-
</div>
14
+
{{ define "editActions" }}
15
+
<div class="flex flex-wrap items-center justify-end gap-2 text-gray-500 dark:text-gray-400 text-sm pt-2">
16
+
{{ template "cancel" . }}
17
+
{{ template "save" . }}
48
18
</div>
49
-
{{ end }}
19
+
{{ end }}
20
+
21
+
{{ define "save" }}
22
+
<button
23
+
class="btn-create py-0 flex gap-1 items-center group text-sm"
24
+
hx-post="/{{ .RepoInfo.FullName }}/issues/{{ .Issue.IssueId }}/comment/{{ .Comment.Id }}/edit"
25
+
hx-include="#edit-textarea-{{ .Comment.Id }}"
26
+
hx-target="#comment-body-{{ .Comment.Id }}"
27
+
hx-swap="outerHTML">
28
+
{{ i "check" "size-4" }}
29
+
save
30
+
{{ i "loader-circle" "w-4 h-4 animate-spin hidden group-[.htmx-request]:inline" }}
31
+
</button>
50
32
{{ end }}
51
33
34
+
{{ define "cancel" }}
35
+
<button
36
+
class="btn py-0 text-red-500 dark:text-red-400 flex gap-1 items-center group"
37
+
hx-get="/{{ .RepoInfo.FullName }}/issues/{{ .Issue.IssueId }}/comment/{{ .Comment.Id }}/"
38
+
hx-target="#comment-body-{{ .Comment.Id }}"
39
+
hx-swap="outerHTML">
40
+
{{ i "x" "size-4" }}
41
+
cancel
42
+
</button>
43
+
{{ end }}
-58
appview/pages/templates/repo/issues/fragments/issueComment.html
-58
appview/pages/templates/repo/issues/fragments/issueComment.html
···
1
-
{{ define "repo/issues/fragments/issueComment" }}
2
-
{{ with .Comment }}
3
-
<div id="comment-container-{{.CommentId}}">
4
-
<div class="flex items-center gap-2 mb-2 text-gray-500 dark:text-gray-400 text-sm flex-wrap">
5
-
{{ template "user/fragments/picHandleLink" .OwnerDid }}
6
-
7
-
<!-- show user "hats" -->
8
-
{{ $isIssueAuthor := eq .OwnerDid $.Issue.OwnerDid }}
9
-
{{ if $isIssueAuthor }}
10
-
<span class="before:content-['·']"></span>
11
-
author
12
-
{{ end }}
13
-
14
-
<span class="before:content-['·']"></span>
15
-
<a
16
-
href="#{{ .CommentId }}"
17
-
class="text-gray-500 dark:text-gray-400 hover:text-gray-500 dark:hover:text-gray-400 hover:underline no-underline"
18
-
id="{{ .CommentId }}">
19
-
{{ if .Deleted }}
20
-
deleted {{ template "repo/fragments/time" .Deleted }}
21
-
{{ else if .Edited }}
22
-
edited {{ template "repo/fragments/time" .Edited }}
23
-
{{ else }}
24
-
{{ template "repo/fragments/time" .Created }}
25
-
{{ end }}
26
-
</a>
27
-
28
-
{{ $isCommentOwner := and $.LoggedInUser (eq $.LoggedInUser.Did .OwnerDid) }}
29
-
{{ if and $isCommentOwner (not .Deleted) }}
30
-
<button
31
-
class="btn px-2 py-1 text-sm"
32
-
hx-get="/{{ $.RepoInfo.FullName }}/issues/{{ .Issue }}/comment/{{ .CommentId }}/edit"
33
-
hx-swap="outerHTML"
34
-
hx-target="#comment-container-{{.CommentId}}"
35
-
>
36
-
{{ i "pencil" "w-4 h-4" }}
37
-
</button>
38
-
<button
39
-
class="btn px-2 py-1 text-sm text-red-500 flex gap-2 items-center group"
40
-
hx-delete="/{{ $.RepoInfo.FullName }}/issues/{{ .Issue }}/comment/{{ .CommentId }}/"
41
-
hx-confirm="Are you sure you want to delete your comment?"
42
-
hx-swap="outerHTML"
43
-
hx-target="#comment-container-{{.CommentId}}"
44
-
>
45
-
{{ i "trash-2" "w-4 h-4" }}
46
-
{{ i "loader-circle" "w-4 h-4 animate-spin hidden group-[.htmx-request]:inline" }}
47
-
</button>
48
-
{{ end }}
49
-
50
-
</div>
51
-
{{ if not .Deleted }}
52
-
<div class="prose dark:prose-invert">
53
-
{{ .Body | markdown }}
54
-
</div>
55
-
{{ end }}
56
-
</div>
57
-
{{ end }}
58
-
{{ end }}