update register
This commit is contained in:
parent
3391a14643
commit
cb14b699a5
3 changed files with 51 additions and 15 deletions
1
.env
Normal file
1
.env
Normal file
|
|
@ -0,0 +1 @@
|
||||||
|
VITE_SERVER_URL=https://backend.planpostai.com/api/v2
|
||||||
|
|
@ -6,6 +6,7 @@ import {
|
||||||
CheckCircle,
|
CheckCircle,
|
||||||
ArrowRight,
|
ArrowRight,
|
||||||
User,
|
User,
|
||||||
|
Phone,
|
||||||
} from "lucide-react";
|
} from "lucide-react";
|
||||||
import { useNavigate } from "react-router-dom";
|
import { useNavigate } from "react-router-dom";
|
||||||
import { useAuthStore } from "@/stores/authStore";
|
import { useAuthStore } from "@/stores/authStore";
|
||||||
|
|
@ -15,6 +16,7 @@ const Signup: React.FC = () => {
|
||||||
const [form, setForm] = useState({
|
const [form, setForm] = useState({
|
||||||
name: "",
|
name: "",
|
||||||
email: "",
|
email: "",
|
||||||
|
phone: "",
|
||||||
password: "",
|
password: "",
|
||||||
confirm: "",
|
confirm: "",
|
||||||
});
|
});
|
||||||
|
|
@ -26,7 +28,13 @@ const Signup: React.FC = () => {
|
||||||
const handleSubmit = async (e: React.FormEvent) => {
|
const handleSubmit = async (e: React.FormEvent) => {
|
||||||
e.preventDefault();
|
e.preventDefault();
|
||||||
|
|
||||||
if (!form.name || !form.email || !form.password || !form.confirm) {
|
if (
|
||||||
|
!form.name ||
|
||||||
|
!form.email ||
|
||||||
|
!form.phone ||
|
||||||
|
!form.password ||
|
||||||
|
!form.confirm
|
||||||
|
) {
|
||||||
return setLocalError("All fields are required");
|
return setLocalError("All fields are required");
|
||||||
}
|
}
|
||||||
if (form.password !== form.confirm) {
|
if (form.password !== form.confirm) {
|
||||||
|
|
@ -36,6 +44,13 @@ const Signup: React.FC = () => {
|
||||||
return setLocalError("Password must be at least 8 characters");
|
return setLocalError("Password must be at least 8 characters");
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// Basic phone validation
|
||||||
|
const phoneRegex =
|
||||||
|
/^[+]?[(]?[0-9]{1,4}[)]?[-\s.]?[(]?[0-9]{1,4}[)]?[-\s.]?[0-9]{1,9}$/;
|
||||||
|
if (!phoneRegex.test(form.phone)) {
|
||||||
|
return setLocalError("Please enter a valid phone number");
|
||||||
|
}
|
||||||
|
|
||||||
setLocalError("");
|
setLocalError("");
|
||||||
|
|
||||||
// Split name into first and last name
|
// Split name into first and last name
|
||||||
|
|
@ -48,6 +63,7 @@ const Signup: React.FC = () => {
|
||||||
email: form.email,
|
email: form.email,
|
||||||
first_name: firstName,
|
first_name: firstName,
|
||||||
last_name: lastName || undefined,
|
last_name: lastName || undefined,
|
||||||
|
phone: form.phone,
|
||||||
password: form.password,
|
password: form.password,
|
||||||
role: "affiliate",
|
role: "affiliate",
|
||||||
});
|
});
|
||||||
|
|
@ -205,6 +221,24 @@ const Signup: React.FC = () => {
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<div>
|
||||||
|
<label className="block text-sm font-medium text-gray-700 mb-2">
|
||||||
|
Phone Number
|
||||||
|
</label>
|
||||||
|
<div className="relative">
|
||||||
|
<Phone className="absolute left-3 top-1/2 transform -translate-y-1/2 w-5 h-5 text-gray-400" />
|
||||||
|
<input
|
||||||
|
type="tel"
|
||||||
|
placeholder="+1 (555) 000-0000"
|
||||||
|
value={form.phone}
|
||||||
|
onChange={(e) =>
|
||||||
|
setForm({ ...form, phone: e.target.value })
|
||||||
|
}
|
||||||
|
className="w-full pl-11 pr-4 py-3 border border-gray-300 rounded-lg focus:ring-2 focus:ring-indigo-500 focus:border-transparent transition-all outline-none"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
<div>
|
<div>
|
||||||
<label className="block text-sm font-medium text-gray-700 mb-2">
|
<label className="block text-sm font-medium text-gray-700 mb-2">
|
||||||
Password
|
Password
|
||||||
|
|
|
||||||
|
|
@ -41,7 +41,7 @@ interface RegisterData {
|
||||||
profile_photo?: File;
|
profile_photo?: File;
|
||||||
}
|
}
|
||||||
|
|
||||||
const API_BASE_URL = "http://localhost:9000/api/v2";
|
const API_BASE_URL = import.meta.env.VITE_SERVER_URL;
|
||||||
|
|
||||||
export const useAuthStore = create<AuthState>((set) => ({
|
export const useAuthStore = create<AuthState>((set) => ({
|
||||||
token: null,
|
token: null,
|
||||||
|
|
@ -70,11 +70,13 @@ export const useAuthStore = create<AuthState>((set) => ({
|
||||||
|
|
||||||
const data = await response.json();
|
const data = await response.json();
|
||||||
|
|
||||||
// Store token (adjust based on your API response structure)
|
|
||||||
const token = data.token || data.access_token || data.data?.token;
|
const token = data.token || data.access_token || data.data?.token;
|
||||||
const user = data.user ||
|
const user = data.user ||
|
||||||
data.data?.user || { email, first_name: "", role: "affiliate" };
|
data.data?.user || { email, first_name: "", role: "affiliate" };
|
||||||
|
|
||||||
|
localStorage.setItem("aff-token", token);
|
||||||
|
localStorage.setItem("aff-user", JSON.stringify(user));
|
||||||
|
|
||||||
set({
|
set({
|
||||||
token,
|
token,
|
||||||
user,
|
user,
|
||||||
|
|
@ -85,8 +87,15 @@ export const useAuthStore = create<AuthState>((set) => ({
|
||||||
|
|
||||||
return { success: true };
|
return { success: true };
|
||||||
} catch (error) {
|
} catch (error) {
|
||||||
console.error("Registration error:", error);
|
console.error("Login error:", error);
|
||||||
return { success: false, error: "Registration error" };
|
|
||||||
|
// Clear localStorage on failure
|
||||||
|
localStorage.removeItem("aff-token");
|
||||||
|
localStorage.removeItem("aff-user");
|
||||||
|
|
||||||
|
set({ isLoading: false, error: "Login failed" });
|
||||||
|
|
||||||
|
return { success: false, error: "Login failed" };
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
|
|
@ -100,18 +109,10 @@ export const useAuthStore = create<AuthState>((set) => ({
|
||||||
formData.append("email", userData.email);
|
formData.append("email", userData.email);
|
||||||
formData.append("first_name", userData.first_name);
|
formData.append("first_name", userData.first_name);
|
||||||
formData.append("password", userData.password);
|
formData.append("password", userData.password);
|
||||||
|
formData.append("phone", userData.phone || "");
|
||||||
formData.append("role", userData.role || "affiliate");
|
formData.append("role", userData.role || "affiliate");
|
||||||
|
|
||||||
// Optional fields
|
const response = await fetch(`${API_BASE_URL}/auth/register`, {
|
||||||
if (userData.last_name) formData.append("last_name", userData.last_name);
|
|
||||||
if (userData.phone) formData.append("phone", userData.phone);
|
|
||||||
if (userData.city) formData.append("city", userData.city);
|
|
||||||
if (userData.country) formData.append("country", userData.country);
|
|
||||||
if (userData.address) formData.append("address", userData.address);
|
|
||||||
if (userData.profile_photo)
|
|
||||||
formData.append("profile_photo", userData.profile_photo);
|
|
||||||
|
|
||||||
const response = await fetch(`${API_BASE_URL}/users`, {
|
|
||||||
method: "POST",
|
method: "POST",
|
||||||
headers: {
|
headers: {
|
||||||
accept: "application/json",
|
accept: "application/json",
|
||||||
|
|
|
||||||
Loading…
Add table
Reference in a new issue