Cannot read property of undefined loginPage.js : 19 (reading 'search' )

[TheNexusDeveloper]

the code is shown below, I believe the error is occuring because I'm using react router v6
how do I write this code in react router v6

import React, {useState, useEffect} from 'react'
import { Link } from 'react-router-dom'
import { Form, Button, Row, Col } from 'react-bootstrap'
import { useDispatch, useSelector } from 'react-redux'
import Loader from '../components/Loader'
import Message from '../components/Message'
import FormContainer from '../components/FormContainer'

import { login } from '../actions/userActions'

function Loginpage({ Location, history }) {
const [email, setEmail] = useState('')
const [password, setPassword] = useState('')

const dispatch = useDispatch()



const redirect = Location.search ? Location.search.split('=')[1] : '/'

const userLogin = useSelector(state => state.userLogin)
const {error, loading, userInfo} = userLogin 

useEffect(() => {
    if (userInfo) {
        history.push(redirect)
    }
},  [history, userInfo, redirect])

const submitHandler = (e) =>{
    e.preventDefault()
    dispatch(login(email, password))
}

return (

Sign In

{error &&{error}}
{loading && }

    <Form onSubmit={submitHandler}>
        <Form.Group controlId='email'>
            <Form.Label>Email Address</Form.Label>
            <Form.Control
                type='email'
                placeholder='Enter Email'
                value={email}
                onChange={(e) => setEmail(e.target.value)}
            >
            </Form.Control>
        </Form.Group>


        <Form.Group controlId='password'>
            <Form.Label>Password</Form.Label>
            <Form.Control
                type='password'
                placeholder='Enter Password'
                value={password}
                onChange={(e) => setPassword(e.target.value)}
            >
            </Form.Control>
        </Form.Group>

        <Row className='py-3'>
            <Col>
                <Button type='submit' variant='warning'>
                    Sign In
                </Button>
            </Col>
        </Row>

       

    </Form>

    <Row className='py-3'>
        <Col>
            Don't Have an account? <Link 
                    to={redirect ? `/register?redirect=${redirect}` : '/register'}>
                >
                Register
            </Link>
        </Col>
    </Row>
</FormContainer>

)
}

export default Loginpage

[Cvija04]

Its about react-router-dom v6, you can't use location.search, import useSearchParamas in react-router-dom, but i didnt find yet how to use it, if you have error in LoginScreen, you need to have error with CartScreen, because it use same method

[bbosajon]

in react v6, u need use: useLocation from reactre-router-dom and remove the location parameter then it will work