import { useSessionStorageState } from 'ahooks';
import { EMBED_MODE_KEY } from './constant';

export default function withHideWhenEmbed<T extends object>(Component: React.ComponentType<T>) {
  const displayName = Component.displayName || Component.name || 'Component';

  function WrappedComponent(props: T) {
    const [embedMode] = useSessionStorageState(EMBED_MODE_KEY, {
      defaultValue: 0,
      listenStorageChange: true,
    });
    const isEmbed = embedMode === 1;

    if (isEmbed) {
      return null;
    }

    return <Component {...props} />;
  }

  WrappedComponent.displayName = `withHideWhenEmbed(${displayName})`;

  return WrappedComponent;
}
