import { useCallback, useId, useState } from "react";

import { useBpAwareProp } from "../../utils/hooks/use-bp-aware-prop";

import { useIsTextOverflow } from "./use-is-text-overflow";
import type { Text } from "../text";

export const useShowMoreText = ({
  rowsToShow,
  textVariantProps,
  trigger,
  isExpandedProp,
  onExpandedChange,
}: {
  rowsToShow: number;
  textVariantProps: React.ComponentProps<typeof Text>["variant"];
  trigger?: unknown;
  isExpandedProp?: boolean;
  onExpandedChange?: (isExpanded: boolean) => void;
}) => {
  const rows = useBpAwareProp(rowsToShow, 1);
  const textVariant = useBpAwareProp(textVariantProps, "body4");
  const triggerDeps = [trigger, rowsToShow];
  const { isOverflow, textRef, expectedHeightWhenClosed } = useIsTextOverflow({
    rows,
    textVariant,
    trigger: triggerDeps,
  });

  const [isExpandedInternal, setIsOpenInternal] = useState(false);

  const textId = useId();

  const isExpanded =
    isOverflow && (typeof isExpandedProp === "undefined" ? isExpandedInternal : isExpandedProp);
  const handleOnExpandedChange: (isExpanded: boolean) => void = useCallback(
    (isExpanded) => {
      if (typeof isExpandedProp === "undefined") {
        setIsOpenInternal(isExpanded);
      }

      onExpandedChange?.(isExpanded);
    },
    [onExpandedChange, isExpandedProp]
  );

  return {
    rows,
    textVariant,
    expectedHeightWhenClosed,
    isOverflow,
    textRef,
    isExpanded,
    handleOnExpandedChange,
    textId,
  };
};