import { TRANSITION_STYLE } from "../constants";
import type { OrganSvgProps } from "../types";

export function Head({ style, colorScale, isActive = false, className }: OrganSvgProps) {
  const defaultColor = colorScale[100];
  const activeColor = colorScale[200];
  const gradientTransform = isActive
    ? "translate(28 31.4667) rotate(90) scale(38.5333 32.542)"
    : "translate(26 34) rotate(90) scale(40.8 32.4925)";

  return (
    <g className={className} data-organ="head">
      <defs>
        <path id="head_path" d={HEAD_PATH} style={{ transition: TRANSITION_STYLE }} />
      </defs>
      {/* Default state path (always visible as base) */}
      <use
        href="#head_path"
        fill="url(#head_gradient_default)"
        stroke={style?.stroke}
        strokeWidth={style?.strokeWidth}
        style={{ transition: TRANSITION_STYLE }}
      />

      {/* Gradient */}
      <radialGradient
        id="head_gradient_default"
        cx="0"
        cy="0"
        r="1"
        gradientUnits="userSpaceOnUse"
        gradientTransform={gradientTransform}
      >
        <stop
          offset={isActive ? "0.48" : "0.24"}
          stopColor={isActive ? activeColor : defaultColor}
          style={{ transition: TRANSITION_STYLE }}
        />
        <stop
          offset="1"
          stopColor={isActive ? defaultColor : "white"}
          stopOpacity="0"
          style={{ transition: TRANSITION_STYLE }}
        />
      </radialGradient>
    </g>
  );
}

const HEAD_PATH =
  "M51.694 27.602C51.3998 26.8206 50.9501 26.2221 50.2895 26.0448C49.8343 25.9229 48.985 25.7955 48.3188 26.2166C48.1634 26.3164 48.0024 26.4327 47.847 26.5491C47.4695 26.8372 46.931 26.5602 46.931 26.0892V17.3724C46.931 11.4098 43.5558 6.15101 37.4217 2.57677C35.3566 1.36874 31.9371 0 25.9972 0C20.0574 0 16.6378 1.37428 14.5727 2.57677C8.43861 6.15655 5.06345 11.4098 5.06345 17.3724V26.0892C5.06345 26.5602 4.51943 26.8372 4.14749 26.5491C3.99206 26.4327 3.83107 26.3164 3.67564 26.2166C3.01504 25.7955 2.16015 25.9229 1.70494 26.0448C1.04434 26.2166 0.600244 26.8151 0.300476 27.602C-0.249098 29.0594 -0.0325992 31.1042 0.85005 32.8109C1.64943 34.357 2.90956 35.5318 4.30848 36.025L5.15227 36.3242L5.36877 37.1887C6.44016 41.5221 9.59327 47.529 15.2167 51.4025C16.1382 52.0342 16.6878 53.0705 16.6878 54.1621V61C16.6878 61 16.6878 68 26 68C35.3122 68 35.3122 61 35.3122 61V54.1621C35.3122 53.0649 35.8618 52.0342 36.7833 51.4025C42.4067 47.529 45.5543 41.5166 46.6312 37.1887L46.8477 36.3242L47.6915 36.025C49.0904 35.5262 50.3506 34.357 51.15 32.8109C52.0326 31.1042 52.2491 29.0538 51.6995 27.602H51.694Z";