Files
dewemoji/app/resources/views/dashboard/admin/catalog.blade.php

176 lines
12 KiB
PHP

@extends('dashboard.app')
@section('page_title', 'Emoji Catalog')
@section('page_subtitle', 'Manage emojis in database, then publish one frozen JSON snapshot when ready.')
@section('dashboard_content')
@if (session('status'))
<div class="mb-6 rounded-2xl border border-emerald-200 bg-emerald-50 px-4 py-3 text-sm text-emerald-700 dark:border-emerald-500/30 dark:bg-emerald-500/15 dark:text-emerald-200">
{{ session('status') }}
</div>
@endif
@if (session('error'))
<div class="mb-6 rounded-2xl border border-red-300/40 bg-red-500/10 px-4 py-3 text-sm text-red-700 dark:text-red-200">
{{ session('error') }}
</div>
@endif
<div class="grid gap-6 lg:grid-cols-3">
<div class="rounded-2xl glass-card p-5">
<div class="text-xs uppercase tracking-[0.2em] text-slate-500 dark:text-gray-400">Catalog rows</div>
<div class="mt-3 text-3xl font-semibold text-slate-900 dark:text-white">{{ number_format($totalRows ?? $items->total()) }}</div>
<div class="mt-2 text-sm text-slate-600 dark:text-gray-400">Read from `emojis` table</div>
@if (($filters['q'] ?? '') !== '')
<div class="mt-1 text-xs text-slate-500 dark:text-gray-500">Filtered result: {{ number_format($items->total()) }}</div>
@endif
</div>
<div class="rounded-2xl glass-card p-5">
<div class="text-xs uppercase tracking-[0.2em] text-slate-500 dark:text-gray-400">Active snapshot</div>
<div class="mt-3 text-2xl font-semibold text-slate-900 dark:text-white">{{ $activeVersion ?: 'None' }}</div>
<div class="mt-2 text-sm text-slate-600 dark:text-gray-400">{{ $activeVersion ? 'Published' : 'Not published yet' }}</div>
</div>
<div class="rounded-2xl glass-card p-5">
<div class="text-xs uppercase tracking-[0.2em] text-slate-500 dark:text-gray-400">Active file path</div>
<div class="mt-3 text-sm font-mono text-slate-800 dark:text-gray-200 break-all">{{ $activePath ?: config('dewemoji.data_path') }}</div>
<div class="mt-2 text-xs text-slate-500 dark:text-gray-500">Public search/API uses this dataset.</div>
</div>
</div>
<div class="mt-8 rounded-2xl glass-card p-5">
<div class="flex flex-wrap items-center justify-between gap-3">
<form method="GET" action="{{ route('dashboard.admin.catalog') }}" class="flex flex-wrap items-center gap-2">
<input
type="text"
name="q"
value="{{ $filters['q'] ?? '' }}"
placeholder="Search slug, name, category, subcategory"
class="w-72 max-w-full rounded-xl border border-slate-200 dark:border-slate-700 px-3 py-2 text-sm text-slate-900 dark:text-slate-100 placeholder:text-slate-400 dark:placeholder:text-slate-500 bg-white dark:bg-slate-900"
>
<button class="rounded-xl border border-slate-200 dark:border-white/10 px-3 py-2 text-xs text-slate-700 dark:text-gray-200 hover:bg-slate-50 dark:hover:bg-white/5">Search</button>
<a href="{{ route('dashboard.admin.catalog') }}" class="rounded-xl border border-slate-200 dark:border-white/10 px-3 py-2 text-xs text-slate-700 dark:text-gray-200 hover:bg-slate-50 dark:hover:bg-white/5">Reset</a>
</form>
<div class="flex flex-wrap items-center gap-2">
<a href="{{ route('dashboard.admin.catalog.create') }}" class="rounded-xl bg-slate-900 dark:bg-white/10 border border-slate-900 dark:border-white/10 px-4 py-2 text-sm font-semibold text-white force-white dark:text-white hover:opacity-90">
Add Emoji
</a>
<form method="POST" action="{{ route('dashboard.admin.catalog.publish') }}">
@csrf
<button class="rounded-xl bg-brand-ocean px-4 py-2 text-sm font-semibold text-white force-white hover:opacity-90">Publish Frozen JSON</button>
</form>
<form method="POST" action="{{ route('dashboard.admin.catalog.import_json') }}">
@csrf
<button class="rounded-xl border border-slate-200 dark:border-white/10 px-3 py-2 text-xs text-slate-700 dark:text-gray-200 hover:bg-slate-50 dark:hover:bg-white/5">Import Current JSON (new only)</button>
</form>
</div>
</div>
<div class="mt-4 overflow-x-auto rounded-xl border border-slate-200 dark:border-white/10">
<table class="min-w-full text-sm">
<thead class="bg-slate-50 dark:bg-slate-900/80">
<tr class="text-left text-xs uppercase tracking-[0.16em] text-slate-500 dark:text-gray-400">
<th class="px-3 py-3">ID</th>
<th class="px-3 py-3">Emoji</th>
<th class="px-3 py-3">Slug</th>
<th class="px-3 py-3">Name</th>
<th class="px-3 py-3">Category</th>
<th class="px-3 py-3">Updated</th>
<th class="px-3 py-3 text-right">Actions</th>
</tr>
</thead>
<tbody>
@forelse ($items as $item)
<tr class="border-t border-slate-200 dark:border-white/10 text-slate-800 dark:text-gray-200">
<td class="px-3 py-3">#{{ $item->emoji_id }}</td>
<td class="px-3 py-3">{{ $item->emoji ?: '⬚' }}</td>
<td class="px-3 py-3 font-mono text-xs">{{ $item->slug }}</td>
<td class="px-3 py-3">{{ $item->name }}</td>
<td class="px-3 py-3 text-slate-600 dark:text-gray-400">{{ $item->category }}</td>
<td class="px-3 py-3 text-xs text-slate-500 dark:text-gray-400">{{ $item->updated_at ? \Illuminate\Support\Carbon::parse($item->updated_at)->format('Y-m-d H:i') : '—' }}</td>
<td class="px-3 py-3">
<div class="flex items-center justify-end gap-2">
<a href="{{ route('dashboard.admin.catalog.edit', ['emojiId' => $item->emoji_id]) }}" class="rounded-lg border border-slate-300 dark:border-white/10 px-3 py-1.5 text-xs text-slate-700 dark:text-gray-100 hover:bg-slate-50 dark:hover:bg-white/10">Edit</a>
<form method="POST" action="{{ route('dashboard.admin.catalog.delete', $item->emoji_id) }}" onsubmit="return confirm('Delete this emoji and related public records?');">
@csrf
@method('DELETE')
<button class="rounded-lg border border-red-300/50 bg-red-50 dark:bg-red-500/10 px-3 py-1.5 text-xs text-red-700 dark:text-red-300 hover:bg-red-100 dark:hover:bg-red-500/20">Delete</button>
</form>
</div>
</td>
</tr>
@empty
<tr>
<td colspan="7" class="px-3 py-6 text-center text-slate-500 dark:text-gray-400">
@if (($filters['q'] ?? '') !== '')
No rows match "<span class="font-semibold text-slate-700 dark:text-gray-300">{{ $filters['q'] }}</span>".
@else
No catalog rows in database.
@endif
</td>
</tr>
@endforelse
</tbody>
</table>
</div>
<div class="mt-4">
{{ $items->links('vendor.pagination.dashboard') }}
</div>
</div>
<div class="mt-8 rounded-2xl glass-card p-5">
<div class="flex items-center justify-between gap-3">
<div>
<div class="text-xs uppercase tracking-[0.2em] text-slate-600 dark:text-gray-400 font-semibold">Snapshot Versions</div>
<div class="mt-1 text-sm text-slate-700 dark:text-gray-300">Use this for quick rollback if latest publish is broken.</div>
</div>
</div>
<div class="mt-4 overflow-x-auto rounded-xl border border-slate-200 dark:border-white/10">
<table class="min-w-full text-sm">
<thead class="bg-slate-50 dark:bg-slate-900/80">
<tr class="text-left text-xs uppercase tracking-[0.16em] text-slate-600 dark:text-gray-400">
<th class="px-3 py-3">Version</th>
<th class="px-3 py-3">File</th>
<th class="px-3 py-3">Updated</th>
<th class="px-3 py-3">Status</th>
<th class="px-3 py-3 text-right">Action</th>
</tr>
</thead>
<tbody>
@forelse (($snapshots ?? []) as $snapshot)
<tr class="border-t border-slate-200 dark:border-white/10 text-slate-900 dark:text-gray-200">
<td class="px-3 py-3 font-mono text-xs text-slate-800 dark:text-gray-100">{{ $snapshot['version'] }}</td>
<td class="px-3 py-3 font-mono text-xs text-slate-700 dark:text-gray-300">{{ $snapshot['name'] }}</td>
<td class="px-3 py-3 text-xs text-slate-700 dark:text-gray-300">
{{ $snapshot['modified_at'] > 0 ? \Illuminate\Support\Carbon::createFromTimestamp($snapshot['modified_at'])->format('Y-m-d H:i') : '—' }}
</td>
<td class="px-3 py-3">
@if ($snapshot['is_active'])
<span class="rounded-full border border-emerald-400 bg-emerald-100 px-2 py-1 text-xs font-semibold text-emerald-800 dark:border-emerald-300/40 dark:bg-emerald-500/20 dark:text-emerald-200">Active</span>
@else
<span class="rounded-full border border-slate-300 dark:border-white/10 bg-slate-100 dark:bg-white/5 px-2 py-1 text-xs font-medium text-slate-700 dark:text-gray-300">Inactive</span>
@endif
</td>
<td class="px-3 py-3 text-right">
@if (!$snapshot['is_active'])
<form method="POST" action="{{ route('dashboard.admin.catalog.snapshot.activate') }}" class="inline">
@csrf
<input type="hidden" name="snapshot" value="{{ $snapshot['name'] }}">
<button class="rounded-lg border border-slate-300 dark:border-white/10 bg-white dark:bg-transparent px-3 py-1.5 text-xs font-medium text-slate-800 dark:text-gray-100 hover:bg-slate-50 dark:hover:bg-white/10">
Activate
</button>
</form>
@endif
</td>
</tr>
@empty
<tr><td colspan="5" class="px-3 py-6 text-center text-slate-600 dark:text-gray-400">No snapshot files found yet. Publish once to create versioned snapshots.</td></tr>
@endforelse
</tbody>
</table>
</div>
</div>
@endsection