import React from "react";
import classNames from "classnames";
import { useTranslation } from "../i18n";
import { StyledProps } from "../_type";
import { useConfig } from "../_util/config-context";

export interface FoundTipProps extends StyledProps {
  /**
   * 找到结果的文案
   * @default "找到下列结果"
   */
  foundText?: React.ReactNode;

  /**
   * 清空结果提示文案
   * @default "返回原列表"
   */
  clearResultText?: React.ReactNode;

  /**
   * 返回原列表时回调，如果不传则不渲染此操作
   */
  onClear?: () => void;
}

export const FoundTip = React.forwardRef(function FoundTip(
  props: FoundTipProps,
  ref: React.Ref<HTMLSpanElement>
) {
  const { classPrefix } = useConfig();
  const t = useTranslation();
  const {
    foundText = t.foundText,
    clearResultText = t.clearResultText,
    onClear,
    className,
    ...restProps
  } = props;
  return (
    <span
      ref={ref}
      className={classNames(`${classPrefix}-action-state`, className)}
      {...restProps}
    >
      {typeof foundText === "string" ? (
        <span className={`${classPrefix}-action-state__text`} title={foundText}>
          {foundText}
        </span>
      ) : (
        foundText
      )}
      {onClear && (
        <>
          {" "}
          <a
            className={`${classPrefix}-action-state__text ${classPrefix}-ml-1n`}
            onClick={onClear}
          >
            {clearResultText}
          </a>
        </>
      )}
    </span>
  );
});

FoundTip.displayName = "FoundTip";