how to pass user credentials in script, if we want to automatically login user on initial render (reactjs)

[krp1lcf]

first i made api call to anonymous endpoint received id, name from remark42 and then passed it to initial script for auto login but cannot login and also "this api gets called automatically: http://localhost:8080/api/v1/user?site=lcfsite"

const loadremark = () => {
    console.log("kinde data:", user);
    // remark
    if (typeof window !== "undefined") {
      window.remark_config = {
        host: "http://localhost:8080",
        site_id: "lcfsite",
        components: ["embed"],
        url: window.location.origin,
        theme: "light",
        page_title: document.title,
        anonymous_comments: true,
        auth: {
          type: "anonymous",
          user: {
            id: localStorage.getItem("remark_id"),
            name: localStorage.getItem("remark_name"),
            // id: user.email,
            // name: user.given_name,
          },
        },
      };
    }
    const script = document.createElement("script");
    script.innerHTML = `
        !function(e,n){for(var o=0;o<e.length;o++){var r=n.createElement("script"),c=".js",d=n.head||n.body;"noModule"in r?(r.type="module",c=".mjs"):r.async=!0,r.defer=!0,r.src=remark_config.host+"/web/"+e[o]+c,d.appendChild(r)}}(remark_config.components||["embed"],document);
      `;
    document.body.appendChild(script);

  };
  const loginAnon = async () => {
    const anonUsername = user.given_name;

    try {
      const response = await axios.get(
        `http://localhost:8080/auth/anonymous/login?site=lcfsite&user=${anonUsername}`,
        { withCredentials: cred }
      );

      console.log("remark api res:", response);
      const { id, name } = response.data;
      localStorage.setItem("remark_id", id);
      localStorage.setItem("remark_name", name);

      loadremark();
    } catch (error) {
      console.error("Error during anonymous login:", error);
    }
  };