en este proyecto, solo en el primer paso, cuando elijo un artículo de la lista de todos los artículos, no obtengo los comentarios de la API y me da este tipo de valor predeterminado en la consola "No detectado (en promesa) TypeError: No se pueden leer las propiedades de undefined (leyendo 'push')” y al mismo tiempo me da esta información sobre la API “index.compiled.js:898 [MSW] Simulación habilitada. index.compiled.js:3038 [MSW] 10:35:35 GET /api/articles (200) index.compiled.js:3038 [MSW] 10:35:37 GET /api/articles/1 (200) índice. compiled.js:3038 [MSW] 10:35:38 GET /api/articles/1/comments (200)” como ve, la API se cumple, pero no sabía por qué no se muestra en el componente Comentarios, así que no es mi código:

 the Comments.js: import React, { useEffect } from 'react'; import { useDispatch, useSelector } from 'react-redux'; import { loadCommentsForArticleId, selectComments, isLoadingComments, } from '../comments/commentsSlice'; import { selectCurrentArticle } from '../currentArticle/currentArticleSlice'; import CommentList from '../../components/CommentList'; import CommentForm from '../../components/CommentForm'; const Comments = () => { const dispatch = useDispatch(); const article = useSelector(selectCurrentArticle); // Declare additional selected data here. const comments = selectComments; const commentsAreLoading = isLoadingComments; let commentsForArticleId = []; if(!article){ commentsForArticleId = [] }else { commentsForArticleId = comments[article.id]; } // Dispatch loadCommentsForArticleId with useEffect here. useEffect(()=> { if(article !== undefined) { dispatch(loadCommentsForArticleId(article.id)) } }, [dispatch, article]) if (commentsAreLoading) return <div>Loading Comments</div>; if (!article) return null; return ( <div className='comments-container'> <h3 className='comments-title'>Comments</h3> <CommentList comments={comments} /> <CommentForm articleId={article.id} /> </div> ); }; export default Comments;