import { DashboardPage } from "@/components/layout/dashboard-page";
import { getDashboardRole } from "@/lib/auth/dashboard-role";
import { PageHeader, Panel } from "@/components/shared/page";
import { PreviewLink } from "@/components/layout/preview-context";
export const metadata = { title: "Withdrawals" };
function Page() {
  return (
    <>
      <PageHeader title="Withdrawals configurations" />
      <Panel
        title="Withdrawal view unavailable"
        description="The original Withdrawals route contains a breadcrumb only."
      >
        <div className="space-y-4 p-6">
          <p className="max-w-2xl text-sm text-muted-foreground">
            A withdrawal history screen is not available in the source
            application. Review requests or configure payout settings in
            Payment Channel Integration.
          </p>
          <div className="flex flex-wrap gap-3">
            <PreviewLink
              className="rounded-lg bg-primary px-4 py-2.5 text-sm font-medium text-primary-foreground"
              href="/withdrawal-requests"
            >
              Withdrawal requests
            </PreviewLink>
            <PreviewLink
              className="rounded-lg border px-4 py-2.5 text-sm font-medium"
              href="/payment-channel?mode=payout"
            >
              Payout configuration
            </PreviewLink>
          </div>
        </div>
      </Panel>
    </>
  );
}

export default async function DashboardRoute(props: {
  searchParams: Promise<Record<string, string | string[] | undefined>>;
}) {
  const query = await props.searchParams;
  const role = await getDashboardRole(
    Array.isArray(query.role) ? query.role[0] : query.role,
  );
  return (
    <DashboardPage role={role}>
      <Page />
    </DashboardPage>
  );
}