Home » Javascript » ReactJS, Overlay on redirect with localStorage

ReactJS, Overlay on redirect with localStorage

Posted by: admin November 1, 2017 Leave a comment

Questions:

I have this redirect code:

if( 
        (
            this.props.userQuery.user && 
            this.props.userQuery.user.isMentee === true &&
            this.props.userQuery.user.email_verified === false
        ) ||
        (
            this.props.userQuery.user && 
            this.props.userQuery.user.isMentee === true &&
            this.props.userQuery.user.approved === false
        )
    ){
        return(
            <Redirect to={{
                pathname: '/settings/profile/'
            }}/>

        )
    }

and I want to display this overlay message whenever the redirect happens ->

<div className="overlay-screen">
    <div className="action-panel">
    <h4 className="mb-2"><strong>Uh oh :(</strong></h4>
    <p>It looks like you haven't filled out your profile information yet. In order to ensure everyone has a great experience using our networking product, please make sure you fill out your profile information (avatar, bio, and social accounts) to provide our amazing mentors more information so they are able to learn more about you!</p>
    <p>If you are having any issues with updating your profile please <strong>start a live chat</strong> in the bottom right of the browser, or email <a href="mailto:[email protected]">[email protected]</a>.</p>
    <p><a className="button primary mb-2" href="/settings/profile">Update My Profile</a>.</p>
</div>

I need the overlay to show up whenever they get redirected. Thanks for the help

Answers: