Passport.js with cookie-session showing authenticated by hitting browser search bar with calls but not within the frontend application fetch calls

Question

So I recently deployed to production and all my endpoints except the endpoints involving authentication work. I have a webserver running my backend and a static site running my frontend. I was playing around with it and I found that if I log in using the authentication (passport.js), if I hit endpoints from my chrome search bar, the authentication endpoints show the user as authenticated, but none of the pages on the app show that the authentication is working. I am using a React frontend and express.js backend. I'm wondering if anyone knows why this might be happening because clearly it is working on the backend but it isnt accessible from my internal fetch calls (but is from the search bar). I am using cookie-session and this is what the cookie configs look like. Thanks.

app.use(session({
    maxAge: 24*60*60*1000,
    keys: ['My Key'],
    sameSite: 'none',
    secure: 'true',
    domain: '.onrender.com'
}))

Note: .onrender.com is the domain that is hosting my backend and a different site has my frontend Note 2: Also, I'm using req.user to access user data instead of req.session.passport.user.

I tried to debug with error logs but there were no error logs. Additionally, adding these configs above for the cookie did not solve the issue either