Cookies not being saved in browser

Question

I am working on a full-stack project that has the usual login/logout functionality. Both the API and the frontend code are on a subdomain of a domain (project-api.domain.app for the backend and project.domain.app for the frontend). The files for these repositories are uploaded on Heroku; I just put a custom domain to domain.app.

The problem is, whenever a user logs in, the server usually responds with 200 but the cookie is not sent to the browser.

The login code is as follows:

      if (comparePasswords) { // passwords from body and database are hashed, and if it 
                              // matches, proceed

        res.cookie('name', 'cookie', {
          maxAge: 9000000000, 
          httpOnly: true, 
          secure: true 
        });

        res.status(200).json({
          id: userData.patientID,
          userData
        })
      } else { // if it does not match, deny access
        res.status(401).json({
          status: "Wrong password",
          message: "Incorrect input from user. Access denied."
        })
      }

When I inspect the http request from the browser, it says that the login request was successful. However, when I check the cookie storage, it is empty. What could be the problem?

Also for context, I used to host these apps on Heroku's free plan (the one without a custom domain). I also encountered the same problem (the cookies not being sent because of cross-domain issues, please see this). As stated, it was advised that I should get a custom domain to avoid these kinds of problems. Could it be that the problem I am facing right now is because my files are still in Heroku? Would that affect anything?

Thank you for any advice.