Redirection after new user created to create his/her profile

21

Did you get it? Please reply if you need any further help

22

Still i didn’t the exact solution that i want.

23

Have you tried implementing the solution I have suggested?

If you are having any trouble with that, please give details as to what exactly you were not able to recreate…

24

I need some logic, Is there a way when someone login for the first time after registration to redirect to “create user profile page” rather than “Dashboard page”?

25

Yes.

You simply create a Route with something like /create-profile

And then when you detect that isAuthenticated Context is true in your login or registration simply say history.push(’/create-profile’);

You will have to bring in history as a prop.

26

See it, this is my Submit function in login page, to login.

handleSubmit(e){
    e.preventDefault();
    //console.log("SUBMITTING", this.state);
    let userData = {
      username: this.state.username,
      password: this.state.password
    };
    
      fetch(`http://localhost:8000/api/login_check`, {
          method: "POST",
          headers: {
            "Content-Type": "application/json"
          },
          body: JSON.stringify(userData),
          
        })
        .then(res => {
          
          if (res.status === 200) {
            res.json().then(data => {
              
              let user = {
                token: data.token,
                username: userData.username
              }
              //console.log("data value: ", userData.username)
             //console.log("test json stringfy:",JSON.stringify({token: data.token, username: userData.username}))
           
             
             localStorage.setItem('token', data.token);
             localStorage.setItem('username', userData.username);
              
              this.props.history.push('/dashboard')
            })
            
            //this.setState({ redirect: true })
          } else {
            const error = new Error(res.error);
            throw error;
          }
        })
        .catch(err => {
          console.error(err);
          alert('Error logging in please try again');
        })       
    
}

As you see the line of redirection, i want to create a logic to redirect if username already login before, it will redirect here this.props.history.push('/dashboard'), otherwise if it is the first time, redirect to here this.props.history.push('/add-user-profile').
I didn’t use Authencticated Context before.

27

I think I understand what you are asking.

But just one more clarification…

Do you want to check if user is already logged in, like how in freecodecamp you are automatically logged in even after you exit browser? Or do you want to check if it is the very first time the user is logging in?

28

by the way you raised a good point, but for the moment to check the user is logged in for the first time.
NB. I want to ask you also your advice: In my app, every new user has to register then login then he has to create his profile before access any functionality.
I want to create a condition or any logic in the handleSubmit function.

29

Based on what I understand you want, you will require server side code. It cannot just be done on front end.

Here’s how the logic would work:

  1. User will send request to register a new account.
  2. Server will store new user in db, as well as create a new user property on db like userLoggedIn and set it to false by default.
  3. When user logsIn server will authorize user, and send back success along with userLoggedIn property in json (which will be set to false by default).
  4. After server will send response to client, server will set userLoggedIn property to true. (All future logins will not be counted)
  5. In your onSubmit handler check the server response for userLoggedIn property and if it is true, send user to create profile else send to dashboard.

Hope this helps

30

thanks for you nice explanation. However, i have questions, i.e.
userLoggedIn property will change every time when user is logged in? or only once it will change to true when user logged in for the first time?

31

Ummm… think about what you just asked…

if you want it to detect whether user logs in for the first time, why would you want to change it back to false?

your server code will just be userLoggedIn = true (whatever the code is to update in mongodb, or whatever db you are using)

if you want to avoid the redundancy of changing userLoggedIn to true even when it is already true, just add an if statement

if (!userLoggedIn) userLoggedIn = true.

32

I will add the property and i will test it what you advice me. I will be back if I get success or not.
Really I appreciate your kindness to help others. Keep it up!!!
See u soon

1 Like