tengo un problema el renderizar una una propiedad que me llega undefined me tira el siguiente error :

El tema es que estoy validando si el objeto viene nulo o indefinido, quiero saber si es la forma correcta o se me escapa algo, este es el componente de la página :

operate AvesTipo() {
  const [birdsFounded, setBirdsFounded] = useState( [])
  const [cardsBird, setCardsBird] = useState(false)
  const [loop, setLoop] = useState(true)

  var knowledge = []

  const fetchData = async () => {

    knowledge = await db.assortment('birds_type').get()
    setBirdsFounded(  knowledge.docs.map( doc =>  doc.knowledge()  ))

    setLoop(false)    
  }

useEffect( () => {

  fetchData()

  if(  ( birdsFounded != undefined )  ||  ( birdsFounded != null )  ||  ( 
       Object.keys(birdsFounded).size != 0 ))  {

    setCardsBird(<CardGroup
      knowledge = {birdsFounded}
    />)
  }
  }, [loop] )


  return (
    <div>
      <Container className="mt-5">
        <Row>
          {cardsBird}
        </Row>
      </Container>

      <FooterComponent/>
    </div>

  )
}

y este es componente que estoy llamando de MyCard.js:

export operate CardGroup(props) {

  let [cardsGroup, setCardsGroup] = useState([]) 
  let knowledge = props.knowledge

  var _cardsGroup =  Object.keys(knowledge).map( row => {
      console.log('row',row)
      let _data = knowledge[row]

      return (
          <Card key={_data.picture}>
              <Card.Img variant="prime" src = { _data.picture } />
              <Card.Physique>
                  <Card.Title>{ _data.title }</Card.Title>
                  <Card.Textual content>
                      { _data.short_description }
                  </Card.Textual content>
              </Card.Physique>
          </Card>
      ) 
  })

  return (
      <Col>
          <CardGroup>
              {cardsGroup}
          </CardGroup>
      </Col>
  )
}

Cualquier comentario o sugerencia es bien recibida, saludos