Skip to content

Add Password To Create New Customer (lesson) #15

@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
    No fields configured for issues without a type.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions