add interaction counters

3 files changed, 21 insertions, 8 deletions

diff --git a/templates/interaction_button.php b/templates/interaction_button.php
index 9115435..edd1a25 100644
--- a/templates/interaction_button.php
+++ b/templates/interaction_button.php
@@ -10,6 +10,13 @@ $icon = match ($action) {
     'dislike' => 'heart_broken',
     'reshare' => $active ? 'repeat_on' : 'repeat'
 };
+$id = "interactButton-$action-$note->id";
 ?>
-<button title="<?= $tooltip ?>" class="icon material-symbols-outlined <?= $action . ($active ? ' active' : '') ?>"
-    hx-post="<?= "/fragment/note/$note->id/$action" ?>" hx-swap="outerHTML" hx-disabled-elt="this"><?= $icon ?></button>
\ No newline at end of file
+<div class="interactButtonContainer <?= $action . ($active ? ' active' : '') ?>">
+    <button title="<?= $tooltip ?>" class="icon material-symbols-outlined <?= $active ? 'active' : '' ?>"
+        hx-post="<?= "/fragment/note/$note->id/$action" ?>" hx-swap="outerHTML"
+        hx-target="closest .interactButtonContainer" hx-disabled-elt="this" id="<?= $id ?>">
+        <?= $icon ?>
+    </button>
+    <label for="<?= $id ?>" class="interactionCount"><?= $count ?? '' ?></label>
+</div>
\ No newline at end of file
diff --git a/templates/note.php b/templates/note.php
index 1fb03a9..0a19475 100644
--- a/templates/note.php
+++ b/templates/note.php
@@ -9,7 +9,7 @@ if ($user != null) {
     $interKinds = array_map(fn($inter) => $inter->kind, $interactions);
 }
 ?>
-<article class="note <?= $selected ? 'selected' : '' ?>">
+<article class="note <?= ($selected ?? false) ? 'selected' : '' ?>">
     <a href="/@/<?= $note->author->getFullHandle() ?>">
         <?php call_template('actor_avatar', ['actor' => $note->author]); ?>
     </a>
@@ -41,13 +41,15 @@ if ($user != null) {
         </div>
         <div class="buttons">
             <?php foreach (['like', 'dislike', 'reshare'] as $action) {
+                $kind = InteractionKind::from($action);
                 call_template('interaction_button', [
                     'action' => $action,
                     'note' => $note,
-                    'active' => in_array(InteractionKind::from($action), $interKinds)
+                    'active' => in_array($kind, $interKinds),
+                    'count' => $note->countInteractionsOfKind($kind)
                 ]);
             }
-            call_template('reply_button', ['note' => $note]);
+            call_template('reply_button', ['note' => $note, 'count' => $note->countReplies()]);
             ?>
         </div>
         <?php call_template('reply_form', ['note' => $note]); ?>
diff --git a/templates/reply_button.php b/templates/reply_button.php
index 1b9736b..aeaeabd 100644
--- a/templates/reply_button.php
+++ b/templates/reply_button.php
@@ -2,6 +2,10 @@
 use Digitigrade\Model\Note;
 
 $icon = count(Note::findAllInThread($note, 2)) > 1 ? 'reply_all' : 'reply';
-?>
-<button title="<?= __('note.action.reply') ?>" class="icon material-symbols-outlined reply"
-    _="on click send toggle to [me, next .noteReplyForm] on toggle toggle .active"><?= $icon ?></button>
\ No newline at end of file
+$id = "interactButton-reply-$note->id"
+    ?>
+<div class="interactButtonContainer reply">
+    <button title="<?= __('note.action.reply') ?>" class="icon material-symbols-outlined reply" id="<?= $id ?>"
+        _="on click send toggle to [me, next .noteReplyForm] on toggle toggle .active on closest <div/>"><?= $icon ?></button>
+    <label for="<?= $id ?>"><?= $count ?? '' ?></label>
+</div>
\ No newline at end of file