/*
 * Author: chenruilong
 * Create Time: 2022/01/18
 * Description:
 */
import React from 'react';
import { Link } from 'react-router-dom';
import { MenuItemProps, MenuItem } from 'rc-menu';

interface BrickMenuItemProps extends MenuItemProps {
  icon?: React.ReactElement;
  type?: 'link';
  link?: string;
}

const prefixCls = 'brick-menu';

export default (props: BrickMenuItemProps) => {
  const { icon, type, link, ...rest } = props;

  const LinkNode = (p: any) => {
    return props.type === 'link' ? <Link to={props.link as string}>{p.children}</Link> : p.children;
  };

  return (
    <MenuItem {...rest} className={`${prefixCls}-item-${props.type}`}>
      <LinkNode>
        {icon &&
          React.cloneElement(icon, {
            className: prefixCls + '-title-icon',
          })}
        <span className={prefixCls + '-title-content'}>{props.children}</span>
      </LinkNode>
    </MenuItem>
  );
};
