fixed owner and customer register make reuseable component and completed it

app/services/AuthService.js

@@ -1,4 +1,5 @@
 import Cookies from "js-cookie";
+import { getCustomerByUserId, getOwnerByUserId, loginWithEmail, loginWithPhone } from "../utils/api";
 /**
  * AuthService
  * Manages authentication tokens and user role detection via JWT decoding.
@@ -39,19 +40,21 @@ const AuthService = Object.freeze({
     if (typeof window === "undefined") return null;
     return Cookies.get(TOKEN_KEY);
   },
-
   deleteToken() {
-    localStorage.removeItem(USER_KEY);
+    Cookies.remove(USER_KEY);
     Cookies.remove(TOKEN_KEY);
   },
-
   /**
    * Cache full user profile (from API)
    * @param {object} user — { name, email, phone, ... }
    */
   cacheUser(user) {
-    if (!user) return;
-    localStorage.setItem(USER_KEY, JSON.stringify(user));
+    Cookies.set(USER_KEY, JSON.stringify(user), {
+      expires: 7,
+      secure: true,
+      sameSite: "lax",
+      path: "/",
+    });
   },
 
   /**
@@ -59,8 +62,12 @@ const AuthService = Object.freeze({
    * @returns {object|null}
    */
   getCachedUser() {
+    const user = Cookies.get(USER_KEY);
+
+    if (!user) return null;
+
     try {
-      return JSON.parse(localStorage.getItem(USER_KEY));
+      return JSON.parse(user);
     } catch {
       return null;
     }
@@ -88,7 +95,6 @@ const AuthService = Object.freeze({
   getUser() {
     const payload = this.decodeToken();
     if (!payload) return null;
-
     const cached = this.getCachedUser();
 
     return {
@@ -96,7 +102,7 @@ const AuthService = Object.freeze({
       name: cached?.name || payload["http://schemas.xmlsoap.org/ws/2005/05/identity/claims/name"] || null,
       email: cached?.email || payload["http://schemas.xmlsoap.org/ws/2005/05/identity/claims/emailaddress"] || null,
       phone: cached?.phone || payload["http://schemas.xmlsoap.org/ws/2005/05/identity/claims/mobilephone"] || null,
-      roles: this.getRoles(),
+      roles: cached?.roles,
     };
   },
 
@@ -107,7 +113,6 @@ const AuthService = Object.freeze({
   getUserId() {
     const user = this.getUser();
     if (!user?.id) return null;
-
     const parsedId = Number(user.id);
     return Number.isFinite(parsedId) ? parsedId : user.id;
   },
@@ -124,7 +129,21 @@ const AuthService = Object.freeze({
     if (typeof roles === "string") return [roles];
     return [];
   },
+  async cacheCurrentUser(getOwnerByUserId, getCustomerByUserId) {
+    const authUser = this.getUser();
+    if (!authUser?.id) {
+      return;
+    }
 
+    const fetchFn = this.isOwner() ? getOwnerByUserId : getCustomerByUserId;
+    const profile = await fetchFn(authUser.id);
+    this.cacheUser({
+      name: profile.firstName + profile.lastName,
+      email: profile.email,
+      phone: profile.phoneNumber,
+      roles: this.getRoles(),
+    });
+  },
   /**
    * User has Owner role
    * @returns {boolean}
@@ -164,6 +183,37 @@ const AuthService = Object.freeze({
   isAuthenticated() {
     return !!this.getToken();
   },
+
+  async login({ loginMethod, credential, password }) {
+    const loginFn = loginMethod === "email" ? loginWithEmail : loginWithPhone;
+    const result = await loginFn(credential, password);
+    switch (result.status) {
+      case 200: {
+        const token = typeof result.data === "string" ? result.data : result.data.token;
+        this.addToken(token);
+        await this.cacheCurrentUser(getOwnerByUserId, getCustomerByUserId);
+        return {
+          type: "SUCCESS",
+        };
+      }
+
+      case 206: {
+        const token = typeof result.data === "string" ? result.data : result.data.token;
+        this.addToken(token);
+        if (loginMethod === "email") await sendEmailOTP();
+        else await sendPhoneOTP();
+        return {
+          type: "OTP_REQUIRED",
+        };
+      }
+
+      default:
+        return {
+          type: "ERROR",
+          result,
+        };
+    }
+  },
 });
 
 export default AuthService;