'React-hook is not updating the state of the component

I created a form and, When the Submit button(of form) is clicked, the the form data is used and, info is updated and setInfo() is called.

let [info, setInfo] = useState([]);
    function submitHandler() {
        info.push({
            Title: title,
            Description: description
        })
        setInfo(info);   //setInfo is called here.
    }

The div where the tile should be added, But upon calling setInfo() the tile is not added.

<div id={"todos"}>
    {info.map(makeTile)}
</div>

This is The makeTile function:

function makeTile(data) {
        return(
            <ReusableTile
                tit={data.Title}
                des={data.Description}
            />
        )
    }

Here is the ReusableTile:

function ReusableTile(props) {
    return (
        <div className="reusable-tile">
            <h1>{props.tit} Hello</h1>
            <hr/>
            <p>{props.des}</p>
        </div>
    );
}


Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source