From da26bbc6c0ee01cebdfd183fa7f7c33cd88e2c15 Mon Sep 17 00:00:00 2001 From: Andreas Nedbal Date: Sun, 9 Jan 2022 00:56:01 +0100 Subject: [PATCH] Port comment toggle functionality to TypeScript --- .../retrospring/features/answerbox/comment/toggle.ts | 6 ++++++ app/views/application/_answerbox.haml | 2 +- 2 files changed, 7 insertions(+), 1 deletion(-) create mode 100644 app/javascript/retrospring/features/answerbox/comment/toggle.ts diff --git a/app/javascript/retrospring/features/answerbox/comment/toggle.ts b/app/javascript/retrospring/features/answerbox/comment/toggle.ts new file mode 100644 index 00000000..578351f8 --- /dev/null +++ b/app/javascript/retrospring/features/answerbox/comment/toggle.ts @@ -0,0 +1,6 @@ +export function commentToggleHandler(event: Event): void { + const button = event.target as HTMLButtonElement; + const id = button.dataset.aId; + + document.querySelector(`#ab-comments-section-${id}`).classList.toggle('d-none'); +} \ No newline at end of file diff --git a/app/views/application/_answerbox.haml b/app/views/application/_answerbox.haml index e33da4b8..58217090 100644 --- a/app/views/application/_answerbox.haml +++ b/app/views/application/_answerbox.haml @@ -35,6 +35,6 @@ = link_to(raw(t('views.answerbox.time', time: time_tooltip(a))), show_user_answer_path(a.user.screen_name, a.id), class: 'answerbox__permalink') .col-md-6.d-md-flex.answerbox__actions = render 'answerbox/actions', a: a, display_all: display_all - .card-footer{ id: "ab-comments-section-#{a.id}", style: display_all.nil? ? 'display: none' : nil } + .card-footer{ id: "ab-comments-section-#{a.id}", class: display_all.nil? ? 'd-none' : nil } %div{ id: "ab-smiles-#{a.id}" }= render 'answerbox/smiles', a: a %div{ id: "ab-comments-#{a.id}" }= render 'answerbox/comments', a: a