reactjs checkbox cannot be fetched

I have a custom checkbox, and it is working fine for checked and unchecked.

Class CustomCheckbox extends Component {
    this.state = { is_Checked: props.isChecked ? treu : false }
    handleClick = () => { this.setState({ is_checked: !this.state.is_checked })
    return (
        <input id={} type="checkbox" 
            onChange={this.handleClick} checked={this.state.is_checked}
        />
    )
}

Here is the page component and fetching from an api call. It is logging the data but it doesn't checked attend when the component is rendered. It just return the initial state as null or unchecked.

this.state = {attend: null}
componentDidMount(){
    fetch(endpoint)
        .then( data => { 
            this.setState({ attend: data.attend }) //attend: true
        }
}

<Checkbox id="attend" isChecked={attend} />

isChecked can be a Boolean. It doesn't update the state and checked the Checkbox. What should I do for my page and update the attend and save?