import React from 'react';
import {
  CnEntryPoints as UICnEntryPoints,
  CnEntryPointsProps,
  IEntryPointsData,
} from '@cainiaofe/cn-ui-m';
import { useData } from '@/common/hook/useData';
import { isDesignMode, executeEventWithoutJS } from '@/common/util/util';
import { ButtonPosition } from '@/type/button-position';

interface UICnEntryPointsProps extends CnEntryPointsProps {}

const CnEntryPoints: React.FC<UICnEntryPointsProps> = React.forwardRef(
  (props, ref) => {
    const { dataFrom, _context, events, ...otherProps } = props;
    const isDesign = isDesignMode(props);
    const { data = [] } = useData({
      dataFrom,
      _context,
      isDesign,
      designMockData: [
        { label: '入职', value: '1' },
        { label: '其他异动', value: '2' },
        { label: '离职', value: '3' },
        { label: '调岗', value: '4' },
        { label: '人才补贴', value: '5' },
        { label: '工资问题咨询', value: '6' },
        { label: 'HR证明/盖章', value: '7' },
      ],
    });

    const handleClick = (item: IEntryPointsData) => {
      if (!isDesign) {
        executeEventWithoutJS({
          eventType: 'onEntryPointsItemClick',
          events,
          _context,
          position: ButtonPosition.entryPointsItemClick,
          urlParamsDataSource: _context?.state?.urlParams,
          recordDataSource: item,
        });
      }
    };
    return (
      <UICnEntryPoints
        ref={ref}
        onItemClick={handleClick}
        dataSource={data}
        {...otherProps}
      />
    );
  },
);

CnEntryPoints.displayName = 'CnEntryPoints';

export { CnEntryPoints };