import React, { ReactNode } from "react";
import { Button, ButtonProps } from "antd";
import { useSelector } from "react-redux";
import { RootState } from "@/store";

// 定义一个接口继承,过滤重复的字段id
type Omit<T, K extends keyof T> = Pick<T, Exclude<keyof T, K>>;

// 过滤接口 ButtonProps 里面的字段id,使用自己定义的 id
interface Props extends Omit<ButtonProps, "id"> {
  children: ReactNode;
  id: number;
  [x: string]: any;
}

function AuthButton({ children, id, ...rest }: Props) {
  const buttonArr = useSelector(
    (state: RootState) => state.loginStore.authButtonArr
  );

  return buttonArr.some((v: any) => v.id === id) ? (
    <Button {...rest}>{children}</Button>
  ) : null;
}

const MemoAuthButton = React.memo(AuthButton);

export default MemoAuthButton;
