Add export buttons to all admin panel screens

Backend export endpoints return DB data in seed JSON format
(games, routes+encounters, pokemon, evolutions). Frontend
downloads the JSON via new Export buttons on each admin page.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
2026-02-08 10:50:14 +01:00
parent 8fbf658a27
commit 5cdcd149b6
9 changed files with 236 additions and 21 deletions

View File

@@ -1,5 +1,4 @@
import { useState } from 'react'
import { toast } from 'sonner'
import { useParams, useNavigate, Link } from 'react-router-dom'
import {
DndContext,
@@ -26,6 +25,8 @@ import {
useDeleteRoute,
useReorderRoutes,
} from '../../hooks/useAdmin'
import { exportGameRoutes } from '../../api/admin'
import { downloadJson } from '../../utils/download'
import type { Route as GameRoute, CreateRouteInput, UpdateRouteInput } from '../../types'
function SortableRouteRow({
@@ -161,14 +162,13 @@ export function AdminGameDetail() {
<h3 className="text-lg font-medium">Routes ({routes.length})</h3>
<div className="flex gap-2">
<button
onClick={() => {
const names = routes.map((r) => r.name)
navigator.clipboard.writeText(JSON.stringify(names, null, 2))
toast.success('Route order copied to clipboard')
onClick={async () => {
const result = await exportGameRoutes(id)
downloadJson(result.data, result.filename)
}}
className="px-4 py-2 text-sm font-medium rounded-md border border-gray-300 dark:border-gray-600 text-gray-700 dark:text-gray-300 hover:bg-gray-50 dark:hover:bg-gray-800"
>
Export Order
Export
</button>
<button
onClick={() => setShowCreate(true)}