/*
 * File: AlertModal.tsx
 * Description: Alert modal using Clinical Blue Interface design system
 * Design & Developed by Tech4Biz Solutions
 * Copyright (c) Spurrin Innovations. All rights reserved.
 */

import React from 'react';
import { Text, View, StyleSheet } from 'react-native';
import Modal from './Modal';
import Button from '../Button/Button';
import CustomIcon from '../Icons/CustomIcon';
import { Colors, Typography, Spacing } from '../../theme';

interface AlertModalProps {
  visible: boolean;
  title: string;
  message: string;
  iconName?: string;
  iconColor?: string;
  onDismiss: () => void;
}

/**
 * AlertModal component
 * - Shows an alert dialog with icon, title, message, and dismiss button
 */
const AlertModal: React.FC<AlertModalProps> = ({ visible, title, message, iconName = 'alert-circle', iconColor = Colors.warning, onDismiss }) => (
  <Modal visible={visible} onRequestClose={onDismiss}>
    <View style={styles.iconContainer}>
      <CustomIcon name={iconName} size={40} color={iconColor} />
    </View>
    <Text style={styles.title}>{title}</Text>
    <Text style={styles.message}>{message}</Text>
    <Button title="Dismiss" onPress={onDismiss} style={styles.button} />
  </Modal>
);

const styles = StyleSheet.create({
  iconContainer: {
    alignItems: 'center',
    marginBottom: Spacing.sm,
  },
  title: {
    fontFamily: Typography.fontFamily.bold,
    fontSize: Typography.fontSize.lg,
    color: Colors.textPrimary,
    marginBottom: Spacing.xs,
    textAlign: 'center',
  },
  message: {
    fontFamily: Typography.fontFamily.regular,
    fontSize: Typography.fontSize.md,
    color: Colors.textSecondary,
    marginBottom: Spacing.lg,
    textAlign: 'center',
  },
  button: {
    marginTop: Spacing.sm,
  },
});

export default AlertModal;

/*
 * End of File: AlertModal.tsx
 * Design & Developed by Tech4Biz Solutions
 * Copyright (c) Spurrin Innovations. All rights reserved.
 */ 