import { Image, type ImageStyle, type StyleProp } from "react-native";

import { useAccounts } from "@/contexts/AccountsContext";
import { useAppTheme } from "@/contexts/ThemeContext";
import { hasBusinessBrandAsset } from "@beenvoice/domain/brand-assets";

type BrandAssetKind = "logo" | "wordmark" | "icon";
type BrandAssetTheme = "light" | "dark";

type BusinessBrandImageProps = {
  business: {
    id: string;
    name?: string | null;
    logoStorageKey?: string | null;
    logoDarkStorageKey?: string | null;
    wordmarkLightStorageKey?: string | null;
    wordmarkDarkStorageKey?: string | null;
    iconLightStorageKey?: string | null;
    iconDarkStorageKey?: string | null;
  };
  kind?: BrandAssetKind;
  theme?: BrandAssetTheme;
  style?: StyleProp<ImageStyle>;
};

export function hasMobileBusinessBrandAsset(
  business: BusinessBrandImageProps["business"],
) {
  return hasBusinessBrandAsset(business);
}

export function BusinessBrandImage({
  business,
  kind = "icon",
  theme: themeOverride,
  style,
}: BusinessBrandImageProps) {
  const { apiUrl } = useAccounts();
  const { isDark } = useAppTheme();
  if (!hasMobileBusinessBrandAsset(business)) return null;
  const theme = themeOverride ?? (isDark ? "dark" : "light");
  const base = apiUrl.replace(/\/$/, "");
  return (
    <Image
      source={{
        uri: `${base}/api/business-logo/${business.id}?kind=${kind}&theme=${theme}&format=png`,
      }}
      accessibilityLabel={`${business.name ?? "Business"} ${kind}`}
      resizeMode="contain"
      style={style}
    />
  );
}