import { useQuery, useMutation } from "@tanstack/react-query";
import { CAMBASE } from "../../../utils/config";
import type { OSDConfigFields } from "../../../types/types";

const fetchOSDConfig = async () => {
  const response = await fetch(`${CAMBASE}/api/fetch-config?id=SightingAmmend0-overlay`);

  if (!response.ok) {
    throw new Error("Network response was not ok");
  }
  return response.json();
};

const postOSDConfig = async (data: OSDConfigFields) => {
  const fields = [
    { property: "propIncludeVRM", value: data.includeVRM },
    { property: "propIncludeMotion", value: data.includeMotion },
    { property: "propIncludeTimestamp", value: data.includeTimeStamp },
    { property: "propIncludeCameraName", value: data.includeCameraName },
    { property: "propOverlayPosition", value: data.overlayPosition },
    { property: "propTimestampFormat", value: data.OSDTimestampFormat },
  ];

  const osdConfigPayload = {
    id: "SightingAmmend0-overlay",
    fields: fields,
  };

  const response = await fetch(`${CAMBASE}/api/update-config`, {
    method: "POST",
    body: JSON.stringify(osdConfigPayload),
  });

  if (!response.ok) {
    throw new Error("Failed to post OSD Config");
  }
  return response.json();
};

export const useOSDConfig = () => {
  const osdQuery = useQuery({
    queryKey: ["osdConfig"],
    queryFn: fetchOSDConfig,
  });

  const osdMutation = useMutation({
    mutationFn: postOSDConfig,
    mutationKey: ["postOSDConfig"],
  });

  return { osdQuery, osdMutation };
};