Callback not redirecting to success route

Question

I'm using two passport strategies for authentication local and google, the local strategy works fine, but for Google I get the Sign-In Popup. I choose the account already listed in the test users, the Google cookies are present in the application dev tools but it does not redirect successfully.

This is my passport config:

const bcrypt = require('bcrypt');
const passport = require('passport')
const LocalStrategy = require('passport-local').Strategy;
const GoogleStrategy = require('passport-google-oauth20').Strategy;
const UserModel = require("./models/user.js");

const GOOGLE_CLIENT_ID = 'id';
const GOOGLE_CLIENT_SECRET = 'key'

passport.use(new GoogleStrategy({
  clientID: GOOGLE_CLIENT_ID,
  clientSecret: GOOGLE_CLIENT_SECRET,
  callbackURL: "http://localhost:4200//auth/google/callback",
  scope: ['profile','email']
},

function(accessToken, refreshToken, profile, done) {
  User.findOrCreate({ googleId: profile.id }, function (err, user) {
    return done(err, user);
  });
}
));

passport.use(new LocalStrategy({ usernameField: 'email' } , async (email, password, done) => {
    try {
      const user = await UserModel.findOne({ email: email });
      
      if (!user) {
        console.log('Incorrect email.');
        return done(null, false, { message: 'Incorrect email.' });
      }
  
      if (!bcrypt.compareSync(password, user.password)) {
        console.log('Incorrect password.');
        return done(null, false, { message: 'Incorrect password.' });
      }
      console.log('Authentication successful.');
      return done(null, user);
    } catch (error) {
      console.log('Error during authentication.');
      return done(error);
    }
  }));

//Persists user data inside session
passport.serializeUser(function (user, done) {
    done(null, user.id);
});

//Fetches session details using session id
passport.deserializeUser(function (id, done) {
    UserModel.findById(id)
        .then(user => {
            done(null, user);
        })
        .catch(err => {
            done(err, null);
        });
});

the routing in my server.js

app.get('/auth/google',
  passport.authenticate('google', {scope: ['profile','email']}));

app.get('/auth/google/callback', passport.authenticate('google',  { 
  failureRedirect: '/login',
  successRedirect: '/dashboard',
  }))

i suspect there is only a synthax error or something i named or configured uncorrectly , thank you so much for any help in advance .