import type { Environment } from "@yaakapp-internal/models";
import { showColorPicker } from "../lib/showColorPicker";
import { ColorIndicator } from "./ColorIndicator";

export function EnvironmentColorIndicator({
  environment,
  clickToEdit,
  className,
}: {
  environment: Environment | null;
  clickToEdit?: boolean;
  className?: string;
}) {
  if (environment?.color == null) return null;

  return (
    <ColorIndicator
      className={className}
      color={environment?.color ?? null}
      onClick={clickToEdit ? () => showColorPicker(environment) : undefined}
    />
  );
}