Redux toolkit useselector doesn't grab the state properly

Question

I'm trying to store my current user using redux toolkit. I'm dispatching the action in the Login page and it looks like when I try to grab the user state on that page it is being set correctly. However I go to another page and try to grab the user state it returns the initial state.

This is the slice that I've written.

import { createSlice } from '@reduxjs/toolkit'

export const userSlice = createSlice({
  name: 'user',
  initialState: {
    value: {
      id: '',
      email: '',
    },
  },
  reducers: {
    setCurrentUser: (state, action) => {
      state.value = action.payload
      console.log('SETTING:', state.value)
    },
  },
})

// Action creators are generated for each case reducer function
export const { setCurrentUser } = userSlice.actions

export default userSlice.reducer

I think I'm importing my reducer to my store correctly

import { configureStore } from '@reduxjs/toolkit'
import userReducer from './features/user/userSlice'

export default configureStore({
  reducer: {
    user: userReducer,
  },
})

And I'm passing it through to my index

import React from 'react'
import ReactDOM from 'react-dom'
import { Provider } from 'react-redux'
import store from '../store'
import App from '../components/App'

ReactDOM.render(
  <React.StrictMode>
    <Provider store={store}>
      <App />
    </Provider>
  </React.StrictMode>,
  document.getElementById('root'),
)

Here is where I'm selecting the user

import { useSelector } from 'react-redux'

const Component = () => {
  const user = useSelector((state) => state.user.value)

I'm using react-redux 8 and react 17 I'd love some help debugging this.