piyushkdasOriginal post
Rank 1: Thread
import React, { useState } from "react";
import { account } from "../appwrite/appwriteConfig";
import { useNavigate } from "react-router-dom";
import { v4 as uuidv4 } from "uuid";
import "../styles/Login.css";
function Register() {
const navigate = useNavigate();
const [user, setUser] = useState({
name: "",
email: "",
password: "",
});
const isValidEmail = (email) => {
// Regular expression for a simple email validation
const emailRegex = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
return emailRegex.test(email);
};
const registerUser = async (e) => {
e.preventDefault();
if (!isValidEmail(user.email)) {
console.log("Invalid email address");
return;
}
const promise = account.create(
uuidv4(),
user.name,
user.email,
user.password
);
promise.then(
(res) => {
console.log(res);
navigate("/todolist");
},
(err) => {
console.log(err);
}
);
};
return (
<div className="landing">
<div className="register">
<h2>Register</h2>
<form onSubmit={registerUser}>
<label htmlFor="name">Name: </label>
<input
type="text"
onChange={(e) => setUser({ ...user, name: e.target.value })}
/>
<label htmlFor="email">Email: </label>
<input
type="email"
onChange={(e) => setUser({ ...user, email: e.target.value })}
/>
<label htmlFor="password">Password: </label>
<input
type="password"
onChange={(e) => setUser({ ...user, password: e.target.value })}
/>
<button type="submit">Register</button>
<p>Already an user?</p>
<button onClick={()=>navigate('/')}>Login</button>
</form>
</div>
</div>
);
}
export default Register;
Summary
The issue is with the order of parameters in the `account.create` call. The correct order should be:
- id
- email
- password
- name
The updated code that fixes the issue is as follows:
```
import React, { useState } from "react";
import { account } from "../appwrite/appwriteConfig";
import { useNavigate } from "react-router-dom";
import { v4 as uuidv4 } from "uuid";
import "../styles/Login.css";
function Register() {
const navigate = useNavigate();
const [user, setUser] = useState({
name: "",
email: