import React from 'react';

 function generateSerialCode(strength) {
    let length, chars;
    switch (strength) {
        case 'low':
            length = 8;
            chars = 'ABCDEFGHJKLMNPQRSTUVWXYZ23456789';
            break;
        case 'medium':
            length = 12;
            chars = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789';
            break;
        case 'high':
            length = 16;
            chars = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789!@#$%^&*()';
            break;
        default:
            length = 12;
            chars = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789';
            break;
    }

    let serialCode = '';
    for (let i = 0; i < length; i++) {
        serialCode += chars.charAt(Math.floor(Math.random() * chars.length));
    }

    return serialCode;
}



function SerialCodeGenerator({ name, value, onChange }) {


    React.useEffect(() => {
        if (!value) {
            const newSerialCode = generateSerialCode();
            onChange({ target: { name, value: newSerialCode } });
        }
    }, [value, name, onChange]);

    return (

        <>
        <h3>Your Unique Code</h3>
        <input
        className='rounded-lg p-2 w-full text-black '
            type="text"
            name={name}
            value={value || ''}
            onChange={(e) => onChange(e)}
            readOnly
        />   
            </>
    );
}

export default SerialCodeGenerator;