Initial Commit

2026-10-03 20:07:49 +02:00
commit a1346c98b1
427 changed files with 59320 additions and 0 deletions
@@ -0,0 +1,53 @@
+<script setup lang="ts">
+import { toast } from 'vue-sonner'
+import { Popover, PopoverContent, PopoverTrigger } from '@/components/ui/popover'
+
+const props = defineProps<{ commentId: number }>()
+
+const { toggle } = useCommentReactions()
+
+const open = ref(false)
+const busy = ref(false)
+
+async function pick(emoji: string) {
+  if (busy.value) return
+  busy.value = true
+  open.value = false
+  try {
+    await toggle(props.commentId, emoji)
+  }
+  catch {
+    toast.error('Reaktion fehlgeschlagen')
+  }
+  finally {
+    busy.value = false
+  }
+}
+</script>
+
+<template>
+  <Popover v-model:open="open">
+    <PopoverTrigger as-child>
+      <button
+        type="button"
+        class="cursor-pointer self-center rounded-md p-1 text-muted-foreground transition-colors hover:bg-muted hover:text-foreground"
+        aria-label="Reaktion hinzufügen"
+      >
+        <Icon name="ph:smiley-fill" class="size-5" />
+      </button>
+    </PopoverTrigger>
+    <PopoverContent align="end" class="w-auto p-2">
+      <div class="grid grid-cols-8 gap-1">
+        <button
+          v-for="e in REACTION_EMOJIS"
+          :key="e"
+          type="button"
+          class="flex size-9 cursor-pointer items-center justify-center rounded-md text-xl transition-colors hover:bg-accent"
+          @click="pick(e)"
+        >
+          {{ e }}
+        </button>
+      </div>
+    </PopoverContent>
+  </Popover>
+</template>