54 lines
1.5 KiB
TypeScript
54 lines
1.5 KiB
TypeScript
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}
|
|
/>
|
|
);
|
|
}
|