Fixing OAuth2 authentication issue

I am using React-Router and Vite to implement google auth , I have setup my Google CLient ID and the consent forms comes , But after I have signed up with Google I get the "user ID" and "secret" to my localhost app/api/callback

// loginWithGoogle called on button clikc "export const loginWithGoogle = async () => { try { account.createOAuth2Token( OAuthProvider.Google, ${window.location.origin}/api/callback, ${window.location.origin}/sign-in, ); } catch (error) { console.error("Error during OAuth2 session creation:", error); } };"

Following the setups located here "https://appwrite.io/blog/post/fixing-oauth2-issues-in-appwrite-cloud?doFollow=true" Now I recieve userID and secret in my loader function and send it to a handleCallback to create a session and a document if not exist for the current user as follows

//handleCallback try { // Create a session using the OAuth2 token await account.createSession(userId, secret)

// Get the user data
const user = await account.get()

if (!user) return redirect("/sign-in")
const { documents } = await database.listDocuments(
  appwriteConfig.databaseId,
  appwriteConfig.userCollectionId,
  [
    Query.equal("accountId", user.$id),
  ]
);
// Create a new user document one sign in with google
if (documents.length === 0) {
  await database.createDocument(
    appwriteConfig.databaseId,
    appwriteConfig.userCollectionId,
    ID.unique(),
    {
      accountId: user.$id,
      email: user.email,
      name: user.name,
      joinedAt: new Date().toISOString(),
    }
  );
}
return redirect("/")

"

But I keep getting " code: 401, type: 'general_unauthorized_scope', response: '{"message":"User (role: guests) missing scope (account)","code":401,"type":"general_unauthorized_scope","version":"1.7.4"}' " mesage

Can any one help?

FYI, it's best to wrap code in backticks to format a bit nicer. You can use 1 backtick for inline code (https://www.markdownguide.org/basic-syntax/#code) and 3 backticks for multiline code (https://www.markdownguide.org/extended-syntax/#syntax-highlighting).

Loader function? So that's server side?