{{ define "comment" }}<article class="comment" id="comment-{{ .ID }}">    <div class="comment-body">        {{ if .DeletedAt }}        <span class="deleted">[deleted]</span>        {{ else }} {{ .Body }} {{ end }}    </div>    <div class="comment-meta" x-data="{ replyOpen: false }">        <span> {{ .AuthorUsername }} </span>        <span> | {{ timeago .CreatedAt }} </span>        {{ if .Session }} |        <button            class="comment-reply-toggle"            @click="replyOpen = !replyOpen"            x-text="replyOpen ? 'cancel' : 'reply'"        >            reply        </button>        <form            class="comment-reply-form"            action="/p/{{ .PostID }}/comment"            method="post"            hx-post="/p/{{ .PostID }}/comment"            hx-target="#comment-children-{{ .ID }}"            hx-swap="beforeend"            x-show="replyOpen"        >            <input type="hidden" name="parent_id" value="{{ .ID }}" />            {{ .ID }}            <textarea name="body" id="body"></textarea>            <!-- @click to close form after comment -->            <button                class="comment-reply-submit"                type="submit"                @click="replyOpen = false"            >                reply            </button>        </form>        {{ end }}    </div>    <div class="comment-children" id="comment-children-{{ .ID }}">        {{ range .Children }} {{ template "comment" . }} {{ end }}    </div></article>{{ end }}