import { Flex, type FlexProps } from "antd";
import React, { useEffect } from "react";

export interface ContainerProps extends FlexProps {
  /**
   * 页面加载完成后执行的回调
   */
  onMount?: () => void;
  /**
   * 页面卸载前执行的回调
   */
  onUnmount?: () => void;
}

/**
 * 页面容器
 */
export const Container = React.forwardRef<HTMLDivElement, ContainerProps>(
  ({ onMount, onUnmount, children, ...props }: React.PropsWithChildren<ContainerProps>, ref) => {
    useEffect(() => {
      onMount?.();
      return () => onUnmount?.();
    }, [onMount, onUnmount]);
    return (
      <Flex ref={ref} {...props}>
        {children}
      </Flex>
    );
  }
);