Home Page not open after logging in

[RPasquale]

My home page doesnt load when I log in. I get this error in the console:

Uncaught TypeError: posts.map is not a function
at PostsWidget (PostsWidget.jsx:41:1)
at renderWithHooks (react-dom.development.js:16305:1)
at mountIndeterminateComponent (react-dom.development.js:20074:1)
at beginWork (react-dom.development.js:21587:1)
at HTMLUnknownElement.callCallback (react-dom.development.js:4164:1)
at Object.invokeGuardedCallbackDev (react-dom.development.js:4213:1)
at invokeGuardedCallback (react-dom.development.js:4277:1)
at beginWork$1 (react-dom.development.js:27451:1)
at performUnitOfWork (react-dom.development.js:26557:1)
at workLoopSync (react-dom.development.js:26466:1)

[Rishav1707]

In which file??

[ANUJSP25]

I have the same issue, can anybody please post a solution for this? @RPasquale if you have found the solution will you please post it here?

[RPasquale]

it is in Posts widget and Post widget, I havent been able to work it out yet.

In which file??

[rutujp78]

Can you share a screenshot of your code? Maybe you used curly brackets in post.map((...)=>{...}) instead of post.map((...)=>(...)).

[ANUJSP25]

`import { useEffect } from "react";
import { useDispatch, useSelector } from "react-redux";
import { setPosts } from "state";
import PostWidget from "./PostWidget";

const PostsWidget = ({ userId, isProfile = false }) => {
const dispatch = useDispatch();
const posts = useSelector((state) => state.posts);
const token = useSelector((state) => state.token);

const getPosts = async () => {
    const response = await fetch("http://localhost:3001/posts", {
      method: "GET",
      headers: { Authorization: `Bearer ${token}` },
    });
    const data = await response.json();
    dispatch(setPosts({ posts: data }));
};

const getUserPosts = async () => {
    const response = await fetch(
      `http://localhost:3001/posts/${userId}/posts`,
      {
        method: "GET",
        headers: { Authorization: `Bearer ${token}` },
      }
    );
    const data = await response.json();
    dispatch(setPosts({ posts: data }));
};

useEffect(() => {
    if (isProfile) {
      getUserPosts();
    } else {
      getPosts();
    }
}, []);

return (
    <>
      {posts.map(
        ({
          _id,
          userId,
          firstName,
          lastName,
          description,
          location,
          picturePath,
          userPicturePath,
          likes,
          comments,
        }) => (
          <PostWidget
            key={_id}
            postId={_id}
            postUserId={userId}
            name={`${firstName} ${lastName}`}
            description={description}
            location={location}
            picturePath={picturePath}
            userPicturePath={userPicturePath}
            likes={likes}
            comments={comments}
          />
        )
      )}
    </>
);

};

export default PostsWidget;`

this is the complete code of the PostsWidget.jsx file.

[rutujp78]

You forgot to write: "// eslint-disable-line react-hooks/exhaustive-deps" in useEffect.
Try like this:
useEffect(() => {
if (isProfile) {
getUserPosts();
} else {
getPosts();
}
}, []); // eslint-disable-line react-hooks/exhaustive-deps

Also, check in state/index.js
you have like this:
const initialState = {
mode: "light",
user: null,
token: null,
posts: [],
};

where "posts" is set to empty array

[ANUJSP25]

posts is defined as an empty array, and I've checked the code thoroughly but I'm still getting the same error. Can somebody help me with this??

[tanluc1e]

posts is defined as an empty array, and I've checked the code thoroughly but I'm still getting the same error. Can somebody help me with this??

clear Local Storage

[Prasadsolunki]

posts is defined as an empty array, and I've checked the code thoroughly but I'm still getting the same error. Can somebody help me with this??

i have same errrot can you got some solution please add here

[myyoss]

Try clear local storage with "clear browsing data". It seems like clearing local storage and session storage in browser application is not good enough..:)