import { ConfigError } from "@/lib/config/loader";
import { effectiveConfigStore } from "@/lib/config/effective";
import { toPublicConfig } from "@/lib/config/public";
import { Dashboard } from "@/components/layout/Dashboard";

export const dynamic = "force-dynamic";

export default function Home() {
  let config;
  try {
    config = effectiveConfigStore.get();
  } catch (err) {
    const message = err instanceof ConfigError ? err.message : "Unknown configuration error";
    return (
      <main className="mx-auto flex max-w-2xl flex-col gap-4 px-6 py-16">
        <h1 className="font-display text-lg font-semibold text-status-down">Configuration Error</h1>
        <pre className="rounded-lg border border-status-down bg-surface p-4 text-sm whitespace-pre-wrap text-fg">
          {message}
        </pre>
      </main>
    );
  }

  return <Dashboard config={toPublicConfig(config)} />;
}