checkout to odoo, select address

1 files changed, 25 insertions, 3 deletions

diff --git a/src/pages/my/address/index.js b/src/pages/my/address/index.js
index cac6e8f6..b97e21e7 100644
--- a/src/pages/my/address/index.js
+++ b/src/pages/my/address/index.js
@@ -5,10 +5,15 @@ import Link from "../../../components/Link";
 import WithAuth from "../../../components/WithAuth";
 import apiOdoo from "../../../helpers/apiOdoo";
 import { useAuth } from "../../../helpers/auth";
+import { useRouter } from "next/router";
+import { createOrUpdateItemAddress, getItemAddress } from "../../../helpers/address";
 
 export default function Address() {
-  const [auth] = useAuth();
-  const [addresses, setAddresses] = useState(null);
+  const router = useRouter();
+  const { select } = router.query;
+  const [ auth ] = useAuth();
+  const [ addresses, setAddresses ] = useState(null);
+  const [ selectedAdress, setSelectedAdress ] = useState(null);
 
   useEffect(() => {
     const getAddress = async () => {
@@ -20,6 +25,19 @@ export default function Address() {
     getAddress();
   }, [auth]);
 
+  useEffect(() => {
+    if (select) {
+      setSelectedAdress(getItemAddress(select));
+    }
+  }, [select]);
+  
+  const changeSelectedAddress = (id) => {
+    if (select) {
+      createOrUpdateItemAddress(select, id);
+      router.back();
+    }
+  };
+
   return (
     <WithAuth>
       <Layout>
@@ -31,7 +49,11 @@ export default function Address() {
 
         <div className="grid gap-y-4 p-4">
         { addresses && addresses.map((address, index) => (
-          <div className="p-4 rounded-md border border-gray_r-7" key={index}>
+          <div 
+            key={index} 
+            className={"p-4 rounded-md border " + (selectedAdress && selectedAdress == address.id ? "border-yellow_r-7 bg-yellow_r-2" : "border-gray_r-7") } 
+            onClick={() => changeSelectedAddress(address.id)}
+          >
             <p className="font-medium">{ address.name }</p>
             <p className="mt-3 text-gray_r-11">{ address.mobile }</p>
             <p className="mt-1 text-gray_r-11 leading-6">{ address.street } { address.street2 }</p>