Ops-dashboard/app/caddy/page.tsx
Scrum4Me Agent 93b50254e5 feat(caddy): add Caddyfile TextMate grammar and enable Shiki syntax highlighting
Adds lib/grammars/caddyfile.json with scopes for directives, named-matchers
(@prefix), placeholders, strings, and comments. Updates /caddy page to use
createHighlighter with the local grammar instead of the nginx fallback.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
2026-05-13 23:28:47 +02:00

76 lines
2.5 KiB
TypeScript

import { redirect } from 'next/navigation'
import Link from 'next/link'
import { createHighlighter } from 'shiki'
import caddyfileGrammar from '@/lib/grammars/caddyfile.json'
import { getCurrentUser } from '@/lib/session'
import { execAgent } from '@/lib/agent-client'
import { parseCertList, type CertInfo } from '@/lib/parse-caddy'
import CaddyView from './_components/caddy-view'
export const dynamic = 'force-dynamic'
export default async function CaddyPage() {
const user = await getCurrentUser()
if (!user) redirect('/login')
let configHtml = ''
let configError: string | null = null
try {
const raw = await execAgent('caddy_show_config')
const highlighter = await createHighlighter({
themes: ['github-dark'],
// eslint-disable-next-line @typescript-eslint/no-explicit-any
langs: [caddyfileGrammar as any],
})
configHtml = highlighter.codeToHtml(raw || '# (empty)', {
lang: 'caddyfile',
theme: 'github-dark',
})
} catch (err) {
configError = err instanceof Error ? err.message : 'failed'
}
let initialCerts: CertInfo[] = []
let certsError: string | null = null
try {
const raw = await execAgent('caddy_list_certs')
initialCerts = parseCertList(raw)
} catch (err) {
certsError = err instanceof Error ? err.message : 'failed'
}
return (
<div className="min-h-screen bg-background p-6">
<div className="mx-auto max-w-6xl space-y-8">
<div>
<h1 className="text-2xl font-semibold tracking-tight">Caddy</h1>
<p className="text-sm text-muted-foreground">Config view and TLS certificate status</p>
</div>
<section className="space-y-3">
<div className="flex items-center justify-between">
<h2 className="text-lg font-medium tracking-tight">Caddyfile</h2>
<Link
href="/caddy/edit"
className="rounded-md border border-border px-3 py-1 text-xs hover:bg-muted/50 transition-colors"
>
Edit
</Link>
</div>
{configError ? (
<div className="rounded-lg border border-destructive/50 bg-destructive/10 p-4 text-sm text-destructive">
{configError}
</div>
) : (
<div
className="overflow-x-auto rounded-lg border border-border text-sm [&>pre]:p-4"
dangerouslySetInnerHTML={{ __html: configHtml }}
/>
)}
</section>
<CaddyView initialCerts={initialCerts} certsError={certsError} />
</div>
</div>
)
}