import React from 'react';
import useFetchUser from '../utils/fetchUser';

const ApologyMessage: React.FC = () => {
    const { updateAttendance } = useFetchUser()
    const handleButtonClick = async () => {
        await updateAttendance(true)
        window.location.reload();
    };

    return (
        <div style={styles.container}>
            <p>
                Нам очень жаль, что ты в этот раз не будешь с нами... Но может ты еще поменяешь свое мнение
            </p>
            <button onClick={handleButtonClick}>
                Изменить мнение
            </button>
        </div>
    );
};

const styles = {
    container: {
        position: 'fixed' as 'fixed',
        top: 0,
        left: 0,
        width: '100vw',
        height: '100vh',
        backgroundColor: 'rgba(0, 0, 0, 1)',
        display: 'flex',
        flexDirection: 'column' as 'column',
        justifyContent: 'center',
        alignItems: 'center',
        color: '#fff',
        zIndex: 1000,
        overflow: 'hidden',
    }
}

// Export the component
export default ApologyMessage;