import { PlatformActionButton } from '../common/PlatformActionButton';
import { UnifiedModal } from '../common/UnifiedModal';

type MobileHomeWelcomeDecisionInput = {
  isDesktopLayout: boolean;
  selectionStage: string;
  platformTab: string;
  pathname: string;
};

type MobileHomeWelcomeOpenInput = MobileHomeWelcomeDecisionInput & {
  isDismissed: boolean;
};

type PlatformActiveMobileWelcomeDialogProps = {
  open: boolean;
  platformThemeClass: string;
  onClose: () => void;
};

export function shouldShowActiveMobileWelcomeDialog({
  isDesktopLayout,
}: MobileHomeWelcomeDecisionInput) {
  return !isDesktopLayout;
}

export function shouldOpenActiveMobileWelcomeDialog({
  isDismissed,
  ...decisionInput
}: MobileHomeWelcomeOpenInput) {
  return !isDismissed && shouldShowActiveMobileWelcomeDialog(decisionInput);
}

export function PlatformActiveMobileWelcomeDialog({
  open,
  platformThemeClass,
  onClose,
}: PlatformActiveMobileWelcomeDialogProps) {
  return (
    <UnifiedModal
      open={open}
      title="欢迎"
      onClose={onClose}
      showHeader={false}
      showCloseButton={false}
      closeOnBackdrop={false}
      closeOnEscape={false}
      size="sm"
      overlayClassName={`platform-theme ${platformThemeClass} platform-mobile-home-welcome-overlay !items-center !p-4`}
      panelClassName="platform-remap-surface platform-mobile-home-welcome-dialog"
      bodyClassName="platform-mobile-home-welcome-dialog__body"
      footerClassName="platform-mobile-home-welcome-dialog__footer"
      footer={
        <PlatformActionButton
          onClick={onClose}
          size="md"
          shape="pill"
          fullWidth
          className="min-h-11"
        >
          好
        </PlatformActionButton>
      }
    >
      <img
        src="/branding/mobile-home-welcome-taonier-ip.png"
        alt=""
        className="platform-mobile-home-welcome-dialog__icon"
      />
      <h2 className="platform-mobile-home-welcome-dialog__title">欢迎</h2>
      <p className="platform-mobile-home-welcome-dialog__copy">
        尼嚎，新陶泥er！
        <br />
        移动端仅支持作品展示
        <br />
        体验创作工具请使用电脑端访问该地址
      </p>
    </UnifiedModal>
  );
}