React Js: Todo-list App - Error

Hey guys , what’s up !! i wanna some help from you guys , i am building Todo-list with React Js but i getting an error when i mapping an array from the local state , i am so confusing with it . Thanks ! :smiling_face_with_three_hearts: :smiling_face_with_three_hearts: :sparkling_heart:

import React from "react";
import 'bootstrap/dist/css/bootstrap.min.css'
import "./styles.css";

class App extends React.Component {

  constructor(props) {
    super(props);
    this.state = {
      items: [],
      inputValue: null
    }
    this.addItem = this.addItem.bind(this);
    this.handleChange = this.handleChange.bind(this);
  }

  handleChange(event){
    /*if(event.target.value !== '') {
      var newItem = {
        title: event.target.value,
        key: new Date()
      }
    }*/
   this.setState({inputValue: event.target.value})
   //console.log(this.state.inputValue);
    
  }

  addItem(e) {
    e.preventDefault();
    const newItem = {
      title: this.state.inputValue,
      id: Date.now()
    }

    const {title} = newItem;
    //console.log(newItem)
    
    if(title !== null) {
      this.setState({items: this.state.items.push(newItem)})
    }

  }

  todos(todo) {
    return <li key={todo.newItem.id}>{todo.newItem.title}</li>
  }

  render() {
    const listTodos = this.state.items;
    const todosList = listTodos.map(this.todos);

    return (
      <div className="container-fluid">
        <div className='header'>
          <form onSubmit={this.addItem}>
            <input type='text' value={this.state.inputValue} placeholder='Add New Item' onChange={this.handleChange}/>
            <button type='buttonn'>Add</button>
          </form>
        </div>
        <div className='container p-2 mt-4'>
          <span>You have <strong className='badge badge-danger'>{this.state.items.length}</strong></span>
          <ul>
            {todosList}
          </ul>
        </div>
      </div>
    );
  }
}

export default App;