<div class="flex flex-col mb-4" ...attributes>
    <Textarea @value={{this.input}} class="form-input w-full" placeholder={{t "component.comment-thread.comment-input-placeholder"}} rows={{3}} disabled={{not this.publishComment.isIdle}} />
    <div class="flex flex-row items-center justify-end mt-2">
        <Button @type="primary" @buttonType="button" @icon="paper-plane" @text={{t "component.comment-thread.publish-comment-button-text"}} @onClick={{perform this.publishComment}} @disabled={{or (not this.publishComment.isIdle) (not this.input)}} />
    </div>
</div>
<div>
    {{#each this.comments as |comment|}}
        {{#if (has-block)}}
            {{yield (component "comment-thread/comment" comment=comment contextApi=this.context) comment}}
        {{else}}
            <CommentThread::Comment @comment={{comment}} @contextApi={{this.context}} />
        {{/if}}
    {{/each}}
</div>