davidovic/infohliadka
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

transform admin panel with comprehensive professional UI

Browse Source 
- migrate from SQLite to PostgreSQL with Drizzle ORM
- implement comprehensive AdminLayout with expandable sidebar navigation
- create professional dashboard with real-time charts and metrics
- add advanced monitoring, reporting, and export functionality
- fix menu alignment and remove non-existent pages
- eliminate duplicate headers and improve UI consistency
- add Tailwind CSS v3 for professional styling
- expand database schema from 6 to 15 tables
- implement role-based access control and API key management
- create comprehensive settings, monitoring, and system info pages
This commit is contained in:
Lukas Davidovic
2025-09-06 15:14:20 +02:00
parent 860070a302
commit 249a672cd7
36 changed files with 8212 additions and 1434 deletions
Download Patch File Download Diff File Expand all files Collapse all files

51
pages/admin/api-keys.tsx
View File

@@ -1,18 +1,59 @@
import { useState, useEffect } from "react"
import type { NextPage } from "next"
import Head from "next/head"
import AdminLayout from '../../components/AdminLayout'
import { KeyIcon, PlusIcon } from '@heroicons/react/24/outline'
const ApiKeys: NextPage = () => {
const [keys, setKeys] = useState([])
useEffect(() => {
fetch("/api/admin/api-keys").then(res => res.json()).then(setKeys)
}, [])
return (
<div>
<Head><title>API Keys - Infohliadka</title></Head>
<h1>API Keys Management</h1>
<div>{keys.length} active keys</div>
</div>
<>
<Head>
<title>API kľúče - Hliadka.sk Admin</title>
</Head>
<AdminLayout title="API kľúče">
<div className="px-4 py-6 sm:px-6 lg:px-8">
<div className="sm:flex sm:items-center">
<div className="sm:flex-auto">
<p className="text-sm text-gray-700">
Správa API kľúčov pre prístup k systému
</p>
</div>
<div className="mt-4 sm:ml-16 sm:mt-0 sm:flex-none">
<button
type="button"
className="btn-primary"
>
<PlusIcon className="h-4 w-4 mr-2" />
Vytvoriť kľúč
</button>
</div>
</div>
<div className="mt-8">
<div className="card p-6">
<div className="flex items-center mb-4">
<KeyIcon className="h-6 w-6 text-gray-400 mr-3" />
<h2 className="text-lg font-medium text-gray-900">Aktívne API kľúče</h2>
</div>
<div className="text-sm text-gray-600">
Celkom aktívnych kľúčov: <span className="font-medium text-gray-900">{keys.length}</span>
</div>
{keys.length === 0 && (
<p className="text-gray-500 mt-4">
Zatiaľ neboli vytvorené žiadne API kľúče. Kliknite na "Vytvoriť kľúč" pre vytvorenie nového.
</p>
)}
</div>
</div>
</div>
</AdminLayout>
</>
)
}
export default ApiKeys