import { useQuery } from "@tanstack/react-query";
import { getLanguage } from "taehui-ts/language";

import { wwwAXIOS } from "src/Www";
import { GetTitleAPI } from "src/wwwAPI";

export default function useGetTitle(avatarID: string) {
  const language = getLanguage();
  return useQuery({
    queryKey: ["title", avatarID, language],
    queryFn: async () => {
      const { data } = await wwwAXIOS.get<GetTitleAPI>("/title", {
        params: {
          avatarID,
          language,
        },
      });
      if (data.titleColor.startsWith("#")) {
        return {
          ...data,
          titleColor: `#${data.titleColor.substring(
            3,
          )}${data.titleColor.substring(1, 3)}`,
        };
      } else {
        return data;
      }
    },
    initialData: {
      title: "",
      titleColor: "",
    },
  });
}
