import { Pressable, StyleSheet, Text, View } from 'react-native';
import { colors, spacing } from '../../../src/theme';
import { Modal } from './Modal';

interface Props {
  visible: boolean;
  /** 关闭弹窗，停留在登录页不做任何操作 */
  onClose: () => void;
}

/**
 * 账号注销审核期提示弹窗（微信登录第三种场景）。
 *
 * 账号处于注销审核期时不可登录、不可复活，因此只提供「知道了」，
 * 不提供任何重新注册出口；关闭后停留在登录页。
 */
export function DeletedAccountModal({ visible, onClose }: Props) {
  return (
    <Modal visible={visible} onClose={onClose}>
      <Text style={styles.title}>无法登录</Text>
      <Text style={styles.message}>该账号正在申请注销中，无法登录。</Text>
      <View style={styles.btnRow}>
        <Pressable style={[styles.btn, styles.confirmBtn]} onPress={onClose} hitSlop={4}>
          <Text style={styles.confirmText}>知道了</Text>
        </Pressable>
      </View>
    </Modal>
  );
}

const styles = StyleSheet.create({
  title: {
    fontSize: 16,
    fontWeight: '600',
    color: colors.textPrimary,
    textAlign: 'center',
    marginBottom: spacing.sm,
  },
  message: { fontSize: 14, lineHeight: 22, color: colors.textSecondary, textAlign: 'center' },
  btnRow: { marginTop: 20 },
  btn: {
    height: 46,
    borderRadius: 23,
    alignItems: 'center',
    justifyContent: 'center',
  },
  confirmBtn: { backgroundColor: colors.primary },
  confirmText: { fontSize: 16, fontWeight: '700', color: colors.textInverse },
});