import type { OoMoment } from "@rakazo/core";
import {
  ACTIVE_RUN_STATUSES,
  DEFAULT_OO_AVATAR,
  decodeOoAvatar,
  ooIdentityShapeIndex,
  ooMomentForStatus,
  resolveOoColor,
} from "@rakazo/core";
import { memo, useMemo } from "react";
import { Image, View } from "react-native";
import { useI18n } from "../lib/i18n";
import { NativeSymbol } from "./native-symbol";
import { OoFigure } from "./oo-figure";

export const BotAvatar = memo(function BotAvatar({
  color,
  size = 54,
  status,
  identity,
  moment,
  still,
  muted = false,
}: {
  color: string;
  size?: number;
  status?: string;
  identity?: string;
  /** Explicit moment; wins over `status`. */
  moment?: OoMoment;
  still?: boolean;
  muted?: boolean;
}) {
  const { t } = useI18n();
  const isWorking = ACTIVE_RUN_STATUSES.some((activeStatus) => activeStatus === status);
  const picture = color.startsWith("data:image/") ? color : null;
  const look = useMemo(() => decodeOoAvatar(color) ?? DEFAULT_OO_AVATAR, [color]);
  const seed = identity || (picture ? "agent" : color) || "agent";
  const body = resolveOoColor(seed, look.color).hex;
  return (
    <View style={{ width: size, height: size }}>
      {picture ? (
        <Image
          source={{ uri: picture }}
          style={{ width: size, height: size, borderRadius: size / 2 }}
        />
      ) : (
        <OoFigure
          avatar={look}
          color={body}
          fallbackShape={look.shape ?? ooIdentityShapeIndex(seed)}
          moment={moment ?? ooMomentForStatus(status)}
          size={size}
          still={still}
        />
      )}
      {isWorking ? (
        <View
          accessibilityLabel={t("Working")}
          style={{
            position: "absolute",
            right: muted ? undefined : 0,
            left: muted ? 0 : undefined,
            bottom: 0,
            width: Math.max(6, Math.round(size * 0.18)),
            height: Math.max(6, Math.round(size * 0.18)),
            borderRadius: size,
            backgroundColor: "#F5A03C",
          }}
        />
      ) : null}
      {muted ? (
        <View
          accessible
          accessibilityLabel={t("Notifications silenced")}
          style={{
            position: "absolute",
            right: -2,
            bottom: -2,
            width: Math.max(14, Math.round(size * 0.34)),
            height: Math.max(14, Math.round(size * 0.34)),
            borderRadius: size,
            borderWidth: 2,
            borderColor: "#000",
            backgroundColor: "#242428",
            alignItems: "center",
            justifyContent: "center",
          }}
        >
          <NativeSymbol
            ios="bell.slash.fill"
            android="notifications-off"
            size={Math.max(8, Math.round(size * 0.17))}
            color="#ECECEE"
          />
        </View>
      ) : null}
    </View>
  );
});