معالجة الخطأ التالي: Array.prototype.map() expects a value to be returned at the end of arrow function

السلام عليكم.

في الكود التالي ينبهني terminal إلى رسالة الخطأ التالية:

Array.prototype.map() expects a value to be returned at the end of arrow function 

مع العلم أن الكود يعمل بشكل صحيح.

الكود:

import React,{useState} from 'react'
import './Notes.css'
import Note from './Note'

function Notes() {
  const arr = ["A","B","C","D"]
  const [count,setCount] = useState(0)
  const handleAdd = () => {
    if (count < arr.length) {
      setCount(count+1)
      console.log(arr[count]);
    }
  }
  return (
    <div className='notes'>
      {
  arr.map((el, i) => { 
    if (i < count) return <Note title={el} key={i} i={i} />;
  })
}
      <button className='add-btn' onClick={handleAdd}>+</button>
    </div>
  )
}

export default Notes


//error message
WARNING in [eslint]
src\Notes\Notes.js
  Line 17:19:  Array.prototype.map() expects a value to be returned at the end of arrow function  array-callback-return

webpack compiled with 1 warning

شكرا لكم.