Skip to content

Add Password To Create New Customer (lesson) #15

Open
@hazartilirot

Description

@hazartilirot

Well, I don't know what he does behind the scene you won't get a list of customers once a user has been registered.

I've taken a screenshot to show the code in the lesson
Screenshot 2023-05-14 at 14 18 17

The issue is simple as this one. When a user signs up as we don't save a token.

https://github.com/amigoscode/full-stack-professional/blob/react-upload/frontend/react/src/components/shared/CreateCustomerForm.jsx

If you look at his last release there is a function onSuccess

onSubmit={(customer, {setSubmitting}) => {
                    setSubmitting(true);
                    saveCustomer(customer)
                        .then(res => {
                            console.log(res);
                            successNotification(
                                "Customer saved",
                                `${customer.name} was successfully saved`
                            )
                            onSuccess(res.headers["authorization"]);
                        }).catch(err => {
                            console.log(err);
                            errorNotification(
                                err.code,
                                err.response.data.message
                            )
                    }).finally(() => {
                         setSubmitting(false);
                    })
                }}

While typing the message I just unable to figure out the meaning of the snippet:
onSuccess(res.headers["authorization"]);

onSuccess is fetchCustomers() function which doesn't accept arguments. What's the meaning of the code I just don't know.

I did basically as following:

onSubmit={
                    (customer, { setSubmitting }) => {
                        setSubmitting(true);
                        registerCustomer(customer)
                            .then(res => {
                                notifyOnSuccess("Customer saved", `${customer.name} was saved`);
                                return login({
                                    username: customer.email,
                                    password: customer.password
                                })
                            }).then(res => location.reload())
                            .catch(err => notifyOnFailure(err.code, err.response.data.error))
                            .finally(() => setSubmitting(false))
                    }
                }

Don't forget to import the useAuth() to the JSX component
const { login } = useAuth();

In nutshell, we register a new user, then we run our login function, we pass username and password and then reload the page. I have no idea if it is implemented in a correct way - but it works!

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions