schalli
30e4bc3a4f
Einheitliche Seitenkoepfe mit Modul-Kachel, Knopf- und Linkklassen statt gelber Schrift, Karten ohne harte Rahmen, Tabellenkoepfe ohne Grossbuchstaben, Marktplatz mit Fluent-Reitern, Filterpillen und Kachel-Karten, Einstellungs-/Verwaltungsnavigation mit Auswahlpille, leere Zustaende mit Symbol im Kreis, Proxmox ohne leuchtende Schatten. Co-Authored-By: Claude Opus 5.5 (1M context) <noreply@anthropic.com>
60 lines
1.8 KiB
TypeScript
60 lines
1.8 KiB
TypeScript
'use client';
|
|
|
|
import { PageHeader } from '@/components/layout/page-header';
|
|
import { useTranslations } from 'next-intl';
|
|
import { useState } from 'react';
|
|
import { type DomainCheckResult, checkDomainAction } from './actions';
|
|
import { DomainInput } from './components/DomainInput';
|
|
import { ResultList } from './components/ResultList';
|
|
|
|
/**
|
|
* Domaincheck module page within the portal.
|
|
*
|
|
* Provides a form to enter a domain label, calls the API to check
|
|
* TLD variant availability, and displays color-coded results.
|
|
*
|
|
* Per D-05a: uses Card-style layout consistent with portal modules.
|
|
*/
|
|
export default function DomaincheckPage() {
|
|
const t = useTranslations('domaincheck');
|
|
|
|
const [results, setResults] = useState<DomainCheckResult[]>([]);
|
|
const [isLoading, setIsLoading] = useState(false);
|
|
const [error, setError] = useState<string | null>(null);
|
|
|
|
const handleSubmit = async (domain: string) => {
|
|
setIsLoading(true);
|
|
setError(null);
|
|
|
|
try {
|
|
const response = await checkDomainAction(domain);
|
|
setResults(response.results);
|
|
} catch (err) {
|
|
setError(err instanceof Error ? err.message : t('error'));
|
|
setResults([]);
|
|
} finally {
|
|
setIsLoading(false);
|
|
}
|
|
};
|
|
|
|
return (
|
|
<div className="mx-auto max-w-2xl space-y-6 p-3 sm:p-6">
|
|
<PageHeader moduleSlug="domaincheck" title={t('title')} description={t('description')} />
|
|
|
|
{/* Card panel (per D-05a) */}
|
|
<div className="rounded-lg bg-card dark:border dark:border-border p-6 shadow-sm space-y-4">
|
|
{/* Domain input */}
|
|
<DomainInput onSubmit={handleSubmit} isLoading={isLoading} />
|
|
|
|
{/* Error message */}
|
|
{error && (
|
|
<p className="text-sm text-destructive">{error}</p>
|
|
)}
|
|
|
|
{/* Results */}
|
|
<ResultList results={results} />
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|