"use client";

import { useQuery } from "@tanstack/react-query";
import { api } from "./api";
import { siteConfig } from "./site-config";

export type RuntimeBranding = {
  name: string;
  tagline: string;
  logoUrl: string;
  defaultLogoUrl: string;
  logoAlt: string;
  faviconUrl: string;
  loginTheme: string;
  loginLandscapeOnly: boolean;
  loginDesignMode: "theme" | "custom";
  loginTemplate: "panel-left" | "panel-right" | "centered" | "split";
  loginBackgroundColor: string;
  loginGradientColor: string;
  loginBrandNameColor: string;
  loginTaglineColor: string;
  loginSupportingTextColor: string;
  loginBackgroundUrl: string;
  loginBoxTransparency: number;
  ready: boolean;
  loading: boolean;
};

const fallbackBranding: RuntimeBranding = {
  name: siteConfig.brandName,
  tagline: siteConfig.brandTagline,
  logoUrl: siteConfig.brandLogoUrl,
  defaultLogoUrl: siteConfig.brandDefaultLogoUrl,
  logoAlt: siteConfig.brandLogoAlt || `${siteConfig.brandName} logo`,
  faviconUrl: siteConfig.brandFaviconUrl,
  loginTheme: "mint",
  loginLandscapeOnly: false,
  loginDesignMode: "theme",
  loginTemplate: "panel-left",
  loginBackgroundColor: "#def8f1",
  loginGradientColor: "#bdf1e4",
  loginBrandNameColor: "",
  loginTaglineColor: "",
  loginSupportingTextColor: "",
  loginBackgroundUrl: "",
  loginBoxTransparency: 5,
  ready: true,
  loading: false,
};

export function useBranding(domain = ""): RuntimeBranding {
  const normalizedDomain = domain.trim().toLowerCase();
  const query = useQuery({
    queryKey: ["app-branding", normalizedDomain],
    queryFn: () => api.branding(normalizedDomain),
    staleTime: 60_000,
    gcTime: 60_000,
    refetchOnMount: false,
    refetchOnWindowFocus: true,
    refetchOnReconnect: true,
  });
  const branding = query.data?.branding;
  const loading = query.isPending && !query.data;
  return {
    name: branding?.name || fallbackBranding.name,
    tagline: branding?.tagline || fallbackBranding.tagline,
    logoUrl: branding?.logo_url || fallbackBranding.logoUrl,
    defaultLogoUrl: fallbackBranding.defaultLogoUrl,
    logoAlt: branding?.logo_alt || fallbackBranding.logoAlt,
    faviconUrl: branding?.favicon_url || fallbackBranding.faviconUrl,
    loginTheme: branding?.login_theme || fallbackBranding.loginTheme,
    loginLandscapeOnly: Boolean(branding?.login_landscape_only),
    loginDesignMode: branding?.login_design_mode === "custom" ? "custom" : "theme",
    loginTemplate: ["panel-left", "panel-right", "centered", "split"].includes(branding?.login_template || "") ? branding!.login_template as RuntimeBranding["loginTemplate"] : "panel-left",
    loginBackgroundColor: branding?.login_background_color || "#def8f1",
    loginGradientColor: branding?.login_gradient_color || "#bdf1e4",
    loginBrandNameColor: branding?.login_brand_name_color || "",
    loginTaglineColor: branding?.login_tagline_color || "",
    loginSupportingTextColor: branding?.login_supporting_text_color || "",
    loginBackgroundUrl: branding?.login_background_url || "",
    loginBoxTransparency: Math.max(0, Math.min(30, Number(branding?.login_box_transparency ?? 5))),
    ready: !loading,
    loading,
  };
}
