import React from 'react';
import { useState } from 'react';

export default function Accueil() {

    //submit
    const ConvertResult = e => {
        e.preventDefault();
    }

    //input
    const [InputState, setInputState] = useState();

    const InputContain = e => {
        setInputState(e);
    }
    //button
    const [ConvertInput, setConvertInput] = useState();

    const ConvertData = () => {
        if(typeof InputState === 'string'){
            setConvertInput('?d')
        }
    }


    return (
        <div className="Accueil_Container">
            <div className="Accueil_main">
                <form onSubmit={e => ConvertResult(e)}>
                    <input type="text"
                    onInput={e => InputContain(e.target.value)}/> <br/>

                    <button onClick={ConvertData}>Convert</button>
                </form>
            </div>
            <span>
                {ConvertInput}
            </span>
        </div>
    )
}