- Multi-tenant client management with unique API keys - Semaphore SMS integration (per-client key + sender name + credit balance) - DB-based SMS queue with 3-attempt retry and exponential backoff - Failed SMS dashboard with manual retry button - Reports page with date/client filter and CSV export - Admin auth via NextAuth (email/password) - Docker Compose setup (app + PostgreSQL 16) - Prisma 5 schema with SmsQueue, SmsLog, Client, User models Tech: Next.js 14 App Router + TypeScript + Tailwind CSS + Prisma + PostgreSQL
87 lines
3.3 KiB
TypeScript
87 lines
3.3 KiB
TypeScript
import Link from 'next/link'
|
|
import { prisma } from '@/lib/prisma'
|
|
import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card'
|
|
import { Button } from '@/components/ui/button'
|
|
import { Badge } from '@/components/ui/badge'
|
|
import { Plus, Settings } from 'lucide-react'
|
|
|
|
export default async function ClientsPage() {
|
|
const clients = await prisma.client.findMany({
|
|
orderBy: { createdAt: 'desc' },
|
|
include: {
|
|
_count: { select: { smsQueue: true, smsLogs: true } },
|
|
},
|
|
})
|
|
|
|
return (
|
|
<div className="space-y-6">
|
|
<div className="flex items-center justify-between">
|
|
<div>
|
|
<h1 className="text-3xl font-bold text-gray-900">Clients</h1>
|
|
<p className="text-gray-500 mt-1">Manage schools and organizations</p>
|
|
</div>
|
|
<Link href="/dashboard/clients/new">
|
|
<Button>
|
|
<Plus className="h-4 w-4 mr-2" />
|
|
Add Client
|
|
</Button>
|
|
</Link>
|
|
</div>
|
|
|
|
{clients.length === 0 ? (
|
|
<Card>
|
|
<CardContent className="text-center py-16">
|
|
<p className="text-gray-500 mb-4">No clients yet</p>
|
|
<Link href="/dashboard/clients/new">
|
|
<Button>
|
|
<Plus className="h-4 w-4 mr-2" />
|
|
Add Your First Client
|
|
</Button>
|
|
</Link>
|
|
</CardContent>
|
|
</Card>
|
|
) : (
|
|
<div className="grid gap-4">
|
|
{clients.map(client => (
|
|
<Card key={client.id}>
|
|
<CardContent className="p-6">
|
|
<div className="flex items-center justify-between">
|
|
<div className="flex-1">
|
|
<div className="flex items-center gap-3">
|
|
<h3 className="font-semibold text-lg">{client.name}</h3>
|
|
<Badge variant={client.isActive ? 'success' : 'secondary'}>
|
|
{client.isActive ? 'Active' : 'Inactive'}
|
|
</Badge>
|
|
{client.semaphoreKey ? (
|
|
<Badge variant="outline" className="text-xs">SMS Configured</Badge>
|
|
) : (
|
|
<Badge variant="warning" className="text-xs">⚠ No SMS Key</Badge>
|
|
)}
|
|
</div>
|
|
<div className="mt-2 space-y-1">
|
|
<p className="text-sm text-gray-500">
|
|
<span className="font-medium">API Key:</span>{' '}
|
|
<code className="bg-gray-100 px-2 py-0.5 rounded text-xs">{client.apiKey}</code>
|
|
</p>
|
|
<p className="text-sm text-gray-500">
|
|
<span className="font-medium">Sender:</span> {client.senderName || 'NFC-HUB'} ·{' '}
|
|
<span className="font-medium">SMS sent:</span> {client._count.smsLogs}
|
|
</p>
|
|
</div>
|
|
</div>
|
|
<Link href={`/dashboard/clients/${client.id}`}>
|
|
<Button variant="outline" size="sm">
|
|
<Settings className="h-4 w-4 mr-2" />
|
|
Settings
|
|
</Button>
|
|
</Link>
|
|
</div>
|
|
</CardContent>
|
|
</Card>
|
|
))}
|
|
</div>
|
|
)}
|
|
</div>
|
|
)
|
|
}
|