feat(activities): ownership + status badges on cards & detail

ActivityCard now renders a "Yours" badge (top-right corner of the
image) when activity.isMine, and a "Pending review" / "Rejected"
badge (bottom-left) when activity.lnbitsStatus is non-approved. The
creator can spot their own posts at a glance on the main feed —
particularly important for pending drafts that don't exist on
Nostr yet.

ActivityDetailPage echoes both badges next to the category row so
users landing on the detail link of their own draft have the same
signal.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
Padreug 2026-05-21 16:53:42 +02:00
commit 556b9e5cfe
2 changed files with 37 additions and 1 deletions

View file

@ -4,7 +4,7 @@ import { useI18n } from 'vue-i18n'
import { format } from 'date-fns'
import { Card, CardContent } from '@/components/ui/card'
import { Badge } from '@/components/ui/badge'
import { MapPin, Calendar, Ticket } from 'lucide-vue-next'
import { MapPin, Calendar, Ticket, User } from 'lucide-vue-next'
import BookmarkButton from './BookmarkButton.vue'
import { useDateLocale } from '../composables/useDateLocale'
import type { Activity } from '../types/activity'
@ -87,6 +87,17 @@ const placeholderBg = computed(() => {
{{ categoryLabel }}
</Badge>
<!-- Ownership badge the creator can spot their own events at a
glance on the feed. -->
<Badge
v-if="activity.isMine"
variant="outline"
class="absolute bottom-2 right-2 text-xs gap-1 bg-background/80 backdrop-blur"
>
<User class="w-3 h-3" />
Yours
</Badge>
<!-- Price badge -->
<Badge
v-if="priceDisplay"
@ -95,6 +106,17 @@ const placeholderBg = computed(() => {
{{ priceDisplay }}
</Badge>
<!-- Pending/rejected overlay for the creator's own non-approved
drafts. Only present when the activity originated from a
local LNbits event (Nostr-sourced activities have no
lnbitsStatus). -->
<Badge
v-if="activity.lnbitsStatus && activity.lnbitsStatus !== 'approved'"
:variant="activity.lnbitsStatus === 'rejected' ? 'destructive' : 'secondary'"
class="absolute bottom-2 left-2 text-xs capitalize"
>
{{ activity.lnbitsStatus === 'rejected' ? 'Rejected' : 'Pending review' }}
</Badge>
</div>
<CardContent class="p-4 flex-1 flex flex-col gap-2">

View file

@ -156,6 +156,20 @@ function goBack() {
<Badge v-if="categoryLabel" variant="secondary" class="shrink-0 mt-1">
{{ categoryLabel }}
</Badge>
<Badge
v-if="activity.lnbitsStatus && activity.lnbitsStatus !== 'approved'"
:variant="activity.lnbitsStatus === 'rejected' ? 'destructive' : 'secondary'"
class="shrink-0 mt-1 capitalize"
>
{{ activity.lnbitsStatus === 'rejected' ? 'Rejected' : 'Pending review' }}
</Badge>
<Badge
v-if="activity.isMine"
variant="outline"
class="shrink-0 mt-1"
>
Yours
</Badge>
<div v-for="tag in activity.tags.slice(1)" :key="tag">
<Badge variant="outline" class="text-xs">{{ tag }}</Badge>
</div>