my redux toolkit state is not updating properly

My redux toolkit dispatch is firing twice, once immediately which for some reason doesn’t properly update the state, then my entire app breaks because it cant’t find the info that us supposed to have been provided, then it fires again and updates properly. So if i refresh the page then everything will load up because then it gets the information from my persistent storage in time.

This is the portion of the code where the dispatch is called:

const handleSignUp = (e) => {
    e.preventDefault();

    createUserWithEmailAndPassword(auth, email, password)
      .then((cred) => {
        updateProfile(cred.user, { displayName: name })
          .then(() => {
            dispatch(
              login({
                name: name,
                uid: cred.user.uid,
                jobDesc: jobDesc,
                email: email,
              })
            );
          })
      })
      .catch((err) => {
        console.log(err);
      })
      .finally(() => {
        setPassword("");
      });
  };

This is the userSlice where login is called from:

import { createSlice } from "@reduxjs/toolkit";

const initialState = {
  user: null,
};

export const userSlice = createSlice({
  name: "user",
  initialState,

  reducers: {
    login: (state, action) => {
      state.user = action.payload;
    },
    logout: (state) => {
      state.user = null;
    },
  },
});

export const { login, logout } = userSlice.actions;

export default userSlice.reducer;

i have checked my redux dev tools so i know the dispatch calls twice and if first udpates partially and the completely.

this is text copied from my dev tools console that displays the state and it’s changes:

name(pin):null
uid(pin):”CK3uLpCLD3hIOa0vXEzhA0oFcwr1″
email(pin):”[email protected]”

that is the first update and this is the second:

name(pin):”james”
uid(pin):”CK3uLpCLD3hIOa0vXEzhA0oFcwr1″
jobDesc(pin):”web dev”
email(pin):”[email protected]”

I’ve almost lost my mind trying to figure this out, please help.