Function ChartYAxisSection

src/components/chart/chart-y-axis-section.tsx:18–113

({
  value,
  onChange,
  isNotChartComponent,
  columns,
}: ChartYAxisSectionProps)

}

export default function ChartYAxisSection({
  value,
  onChange,
  isNotChartComponent,
  columns,
}: ChartYAxisSectionProps) {
  const selectYAxisDisplay = useMemo(() => {
    if (isNotChartComponent) return null;

    return (
      <div>
        <Select
          size="lg"
          options={[
            {
              value: "Left",
              label: "Left",
            },
            {
              value: "Right",
              label: "Right",
            },
            {
              value: "Hidden",
              label: "Hidden",
            },
          ]}
          setValue={function (value: string): void {
            onChange((prev) => {
              return produce(prev, (draft) => {
                draft.params.options.yAxisLabelDisplay =
                  value.toLowerCase() as ChartLabelDisplayY;
              });
            });
          }}
          value={capitalizeFirstChar(
            value.params.options?.yAxisLabelDisplay ?? "left"
          )}
        />
      </div>
    );
  }, [isNotChartComponent, onChange, value.params.options?.yAxisLabelDisplay]);

  return (
    <div>
      <p className="mb-1.5 text-sm font-bold opacity-70">Y Axis</p>
      <div className="flex items-center justify-between gap-2">
        <SimpleInput
          value={value.params.options?.yAxisLabel}
          placeholder={
            value.params.options?.yAxisKeys?.length > 0
              ? value.params.options?.yAxisKeys[0]
              : "Y Axis Label"
          }
          onSumit={(v) => {
            onChange((prev) => {
              return produce(prev, (draft) => {
                draft.params.options.yAxisLabel = v === "" ? undefined : v;