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

export function Endocrine({ style, colorScale, isActive = false, className }: OrganSvgProps) {
  const defaultColor = colorScale.alpha[200];
  const activeColor = colorScale[300];
  const fill = style?.fill ?? (isActive ? activeColor : defaultColor);

  return (
    <g className={className} data-organ="endocrine">
      <path
        d={THYROID_PATH}
        fill={fill}
        stroke={style?.stroke}
        strokeWidth={style?.strokeWidth}
        style={{ transition: TRANSITION_STYLE }}
      />
      <path
        d={PANCREAS_PATH}
        fill={fill}
        stroke={style?.stroke}
        strokeWidth={style?.strokeWidth}
        style={{ transition: TRANSITION_STYLE }}
      />
    </g>
  );
}

const THYROID_PATH =
  "M16.3514 1.45426C16.5695 0.895968 16.8771 -0.205317 17.6639 0.0333582C18.5597 0.579989 18.4738 2.02377 18.5945 2.97086C18.6997 4.58384 18.9685 6.0701 18.9725 7.63687C19.1399 9.69269 18.5985 11.5562 16.9158 12.8537C15.9615 13.5313 15.1274 14.7058 13.9744 14.9445C11.8869 15.0712 11.8009 12.7962 9.53007 14.5324L9.52616 14.5363L9.45976 14.5783C8.13933 15.5137 7.16967 14.7368 6.13359 13.7629C4.69628 12.6002 3.13447 11.2641 3.04863 9.28922C2.87334 7.20259 3.23555 5.14647 3.37968 3.06754C3.45369 2.2706 3.55137 -0.57099 4.87968 0.1066C5.19893 0.352978 5.37818 0.788015 5.52616 1.16519C5.904 2.25854 6.37152 3.32522 6.59745 4.5148C6.79221 5.52727 7.07271 6.53579 7.62577 7.36734C8.54897 8.63397 10.5669 10.5285 12.2107 9.33121C14.3956 8.10313 15.1279 6.24367 15.5408 3.88394C15.7628 3.02541 16.0826 2.2589 16.3514 1.45426Z";
const PANCREAS_PATH =
  "M23.9568 83.6427C24.7128 82.9852 26.0133 82.4862 25.9998 83.9591C25.967 85.6442 24.3822 86.8249 23.2254 87.9406C17.0779 93.7318 11.0597 91.5179 8.91386 95.049C7.4156 100.198 1.51001 100.411 0.0251878 95.1193C-0.153622 93.4263 0.651082 91.6376 1.44218 90.1232C3.40645 87.3402 9.13354 87.9014 11.8836 87.3888C14.6336 86.8762 21.5753 84.9579 23.9568 83.6427Z";