import type { Metadata } from "next";
import { serverApiBaseUrl } from "@/lib/api-url";
import { formatModelName } from "@/lib/vehicle-display";
import {
  VehiclePackagesClient,
  type VehiclePackage,
  type VehiclePackageModel,
} from "./VehiclePackagesClient";

type VehiclePackagesPageProps = {
  params: Promise<{
    vehicleType: string;
    manufacturerSlug: string;
    modelId: string;
  }>;
  searchParams?: Promise<{
    packageType?: string;
  }>;
};

type VehiclePackagesResponse = {
  model: VehiclePackageModel | null;
  packages?: VehiclePackage[];
  error?: string;
};

export async function generateMetadata({ params }: VehiclePackagesPageProps): Promise<Metadata> {
  const { vehicleType, manufacturerSlug, modelId } = await params;
  const resolvedVehicleType = vehicleType === "bike" ? "bike" : "car";
  let modelName = formatModelName(`model ${modelId}`);

  try {
    const response = await fetch(
      `${serverApiBaseUrl}/api/vehicle-packages?manufacturerSlug=${encodeURIComponent(
        decodeURIComponent(manufacturerSlug),
      )}&modelId=${encodeURIComponent(modelId)}&vehicleType=${resolvedVehicleType}&packageType=service_package`,
      { cache: "no-store" },
    );
    const data = (await response.json().catch(() => ({}))) as VehiclePackagesResponse;

    if (response.ok && data.model) {
      modelName = formatModelName(data.model.name);
    }
  } catch {
    modelName = formatModelName(`model ${modelId}`);
  }

  return {
    title: `${modelName} Packages`,
    description: `Choose a package for ${modelName} and book doorstep service on WhatsApp.`,
    alternates: {
      canonical: `/vehicle-packages/${vehicleType}/${manufacturerSlug}/${modelId}`,
    },
  };
}

export default async function VehiclePackagesPage({
  params,
  searchParams,
}: VehiclePackagesPageProps) {
  const { vehicleType, manufacturerSlug, modelId } = await params;
  const resolvedSearchParams = await searchParams;
  const resolvedVehicleType = vehicleType === "bike" ? "bike" : "car";
  const resolvedManufacturerSlug = decodeURIComponent(manufacturerSlug);
  const resolvedPackageType = resolvedSearchParams?.packageType ?? "service_package";
  let initialModel: VehiclePackageModel | null | undefined;
  let initialPackages: VehiclePackage[] | undefined;
  let initialErrorMessage = "";

  try {
    const response = await fetch(
      `${serverApiBaseUrl}/api/vehicle-packages?manufacturerSlug=${encodeURIComponent(
        resolvedManufacturerSlug,
      )}&modelId=${encodeURIComponent(modelId)}&vehicleType=${resolvedVehicleType}&packageType=${encodeURIComponent(
        resolvedPackageType,
      )}`,
      { cache: "no-store" },
    );
    const data = (await response.json().catch(() => ({}))) as VehiclePackagesResponse;

    if (!response.ok) {
      throw new Error(data.error ?? "Could not load packages");
    }

    initialModel = data.model;
    initialPackages = data.packages ?? [];
  } catch (error) {
    initialErrorMessage = error instanceof Error ? error.message : "Could not load packages";
  }

  return (
    <VehiclePackagesClient
      vehicleType={resolvedVehicleType}
      manufacturerSlug={resolvedManufacturerSlug}
      modelId={Number(modelId)}
      packageType={resolvedPackageType}
      initialModel={initialModel}
      initialPackages={initialPackages}
      initialErrorMessage={initialErrorMessage}
    />
  );
}