feat(events): add Photos column to admin events list (#384)

The admin events table didn't surface how many photos each event
contained — admins had to click into the event to find out. The
backend already computes `photo_count` for every row in the
GET /admin/events list response (adminEvents.js:794-796), so this
is a frontend-only display change.

- Insert a "Photos" column between Date and Status — groups with
  the "what's in this event" info.
- Right-aligned, tabular-nums for clean numeric alignment in the
  column.
- Reuses the existing `events.photos` i18n key already shipped in
  all 5 locales for the EventDetailsPage tab list ("Fotos" / etc.) —
  no new translations needed.
- Updates the empty-state colSpan from 7 to 8.

Closes the column-add half of #384. The bulk-delete request from
the same issue lands separately.
This commit is contained in:
Paul Nothaft
2026-05-04 20:47:13 +02:00
parent 0adec25fe7
commit ffb4318a1f
+7 -1
View File
@@ -434,6 +434,9 @@ export const EventsListPage: React.FC = () => {
<th className="px-6 py-3 text-left text-xs font-medium text-neutral-500 dark:text-neutral-400 uppercase tracking-wider">
{t('events.date')}
</th>
<th className="px-6 py-3 text-right text-xs font-medium text-neutral-500 dark:text-neutral-400 uppercase tracking-wider">
{t('events.photos', 'Photos')}
</th>
<th className="px-6 py-3 text-left text-xs font-medium text-neutral-500 dark:text-neutral-400 uppercase tracking-wider">
{t('events.status')}
</th>
@@ -448,7 +451,7 @@ export const EventsListPage: React.FC = () => {
<tbody className="bg-white dark:bg-neutral-800 divide-y divide-neutral-200 dark:divide-neutral-700">
{events.length === 0 ? (
<tr>
<td colSpan={7} className="px-6 py-12 text-center text-neutral-500 dark:text-neutral-400">
<td colSpan={8} className="px-6 py-12 text-center text-neutral-500 dark:text-neutral-400">
{t('events.noEventsFound')}
</td>
</tr>
@@ -493,6 +496,9 @@ export const EventsListPage: React.FC = () => {
<td className="px-6 py-4 text-sm text-neutral-700 dark:text-neutral-300">
{event.event_date ? format(parseISO(event.event_date), 'MMM d, yyyy') : 'N/A'}
</td>
<td className="px-6 py-4 text-sm text-right tabular-nums text-neutral-700 dark:text-neutral-300">
{event.photo_count ?? 0}
</td>
<td className="px-6 py-4">
<span className={`inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium ${status.color}`}>
{status.label}