import BreadCrumbLink from "@/layouts/shared/page.breadcrumbLink";
import { updateMembershipClubChargeCenter } from "@/lib/features/charge-centers/action";
import type { MembershipClubChargeCenter } from "@/lib/features/charge-centers/models";
import { getMembershipChargeCenter } from "@/lib/features/charge-centers/query";
import type { CoreResponse } from "@/lib/features/types";
import type { Route } from "../+types/page";
import ChargeCenterClientPage from "./_client";

export const handle = {
  breadcrumb: () => (
    <BreadCrumbLink
      links={[
        {
          label: "Charge Centers",
          to: "/admin/memberships/charge-centers",
        },
        {
          label: "Edit",
        },
      ]}
    />
  ),
};

export async function loader({ params }: Route.LoaderArgs) {
  const { id } = params as { id: string };
  const chargeCenterResponse = await getMembershipChargeCenter(id);
  return { chargeCenterResponse };
}

export async function action({ request, params }: Route.ActionArgs) {
  const { intent, ...payload } = (await request.json()) as {
    intent: string;
  } & MembershipClubChargeCenter;
  const { id } = params as { id: string };
  let chargeCenter;
  switch (intent) {
    case "update-membership-charge-center":
      chargeCenter = await updateMembershipClubChargeCenter(id, payload);
      return chargeCenter;
    default:
      throw Error("Invalid intent");
  }
}

const ChargeCenterPage: React.FC<Route.ComponentProps> = ({ loaderData }) => {
  const { chargeCenterResponse } = loaderData as unknown as {
    chargeCenterResponse: CoreResponse<MembershipClubChargeCenter>;
  };
  return <ChargeCenterClientPage chargeCenter={chargeCenterResponse?.data} />;
};

export default ChargeCenterPage;