Listando e atualizando lista de checkboxs

app.js

import React, { useState } from "react";

export default function App () {

    const [cursos, setCursos] = useState([
        { name: 'zero', status: true },
        { name: 'primeiro', status: true },
        { name: 'segundo', status: false },
        { name: 'terceiro', status: false },
        { name: 'quarto', status: true },
        { name: 'quinto', status: true },
        { name: 'sexto', status: false },
        { name: 'sétimo', status: true }
    ]);

    const handleCheckboxChange = (index, curso) => {
        let arrayCursos = [...cursos];
        arrayCursos[index].status = !curso.status;
        setCursos(arrayCursos);
    }

    const handleFormSubmit = event => {
        event.preventDefault();
        
        console.log('submit: ', cursos);
    }

    return (
        <form onSubmit={ handleFormSubmit }>
            {
                cursos && cursos.map((curso, index) => (
                    <div key={index}>
                        <input type="checkbox" name={ curso.name } checked={ curso.status } onChange={ () => handleCheckboxChange(index, curso) }/>
                        <label>{ curso.name }</label>
                        <br/>
                    </div>
                ))
            }

            <br/>
            <button type="submit">Atualizar</button>
        </form>
    );

}