✨ feat: add shipping address to order

:%s

src/components/modules/checkout/CheckoutInfo/CheckoutInfo.tsx

@@ -4,7 +4,6 @@ import CheckoutCollapse from 'src/components/common/CheckoutCollapse/CheckoutCol
 import { useActiveCustomer } from 'src/components/hooks/auth'
 import { useAddProductToCart, useGetActiveOrder } from 'src/components/hooks/cart'
 import { removeItem } from 'src/utils/funtion.utils'
-import { CheckOutForm } from 'src/utils/types.utils'
 import s from './CheckoutInfo.module.scss'
 import CustomerInfoForm from './components/CustomerInfoForm/CustomerInfoForm'
 import PaymentInfoForm from './components/PaymentInfoForm/PaymentInfoForm'
@@ -22,7 +21,6 @@ enum CheckoutStep {
 const CheckoutInfo = ({ onViewCart }: CheckoutInfoProps) => {
   const [activeStep, setActiveStep] = useState(1)
   const [doneSteps, setDoneSteps] = useState<CheckoutStep[]>([])
-  const [info, setInfo] = useState<CheckOutForm>({})
   const { order } = useGetActiveOrder()
   const { customer } = useActiveCustomer()
 
@@ -53,12 +51,16 @@ const CheckoutInfo = ({ onViewCart }: CheckoutInfoProps) => {
 
   const updateActiveStep = (step: CheckoutStep) => {
     if (doneSteps.length > 0) {
-      for (let i = step + 1; i <= Object.keys(CheckoutStep).length; i++) {
+      for (let i = step + 1; i < Object.keys(CheckoutStep).length; i++) {
         if (!doneSteps.includes(i)) {
+          // console.log("here: ", doneSteps, i)
           setActiveStep(i)
+          return
         }
       }
     } else {
+      // console.log("here 2: ", doneSteps, step)
+
       setActiveStep(step + 1)
     }
   }
@@ -86,7 +88,11 @@ const CheckoutInfo = ({ onViewCart }: CheckoutInfoProps) => {
           return ''
         }
       case CheckoutStep.ShippingInfo:
-        return `${info.address}, ${info.state}, ${info.city}, ${info.code}, ${info.phone}, `
+        if (order?.shippingAddress) {
+          const { streetLine1, city, province, postalCode, countryCode, phoneNumber } = order.shippingAddress
+          return `${streetLine1}, ${city}, ${province}, ${postalCode}, ${countryCode}, ${phoneNumber}`
+        }
+        return ''
       default:
         return ""
     }
@@ -96,12 +102,12 @@ const CheckoutInfo = ({ onViewCart }: CheckoutInfoProps) => {
     {
       id: CheckoutStep.CustomerInfo,
       title: 'Customer Information',
-      form: <CustomerInfoForm onConfirm={onConfirm} id={CheckoutStep.CustomerInfo}/>,
+      form: <CustomerInfoForm onConfirm={onConfirm} id={CheckoutStep.CustomerInfo} />,
     },
     {
       id: CheckoutStep.ShippingInfo,
       title: 'Shipping Information',
-      form: <ShippingInfoForm onConfirm={onConfirm} id={CheckoutStep.ShippingInfo} activeStep={activeStep}/>,
+      form: <ShippingInfoForm onConfirm={onConfirm} id={CheckoutStep.ShippingInfo} activeStep={activeStep} />,
     },
     {
       id: CheckoutStep.PaymentInfo,

src/components/modules/checkout/CheckoutInfo/components/CustomerInfoForm/CustomerInfoForm.tsx

@@ -9,7 +9,6 @@ import { ErrorCode } from 'src/domains/enums/ErrorCode'
 import { CommonError } from 'src/domains/interfaces/CommonError'
 import { LANGUAGE } from 'src/utils/language.utils'
 import { CustomInputCommon } from 'src/utils/type.utils'
-import { CheckOutForm } from 'src/utils/types.utils'
 import * as Yup from 'yup'
 import ChekoutNotePolicy from '../ChekoutNotePolicy/ChekoutNotePolicy'
 import s from './CustomerInfoForm.module.scss'

src/components/modules/checkout/CheckoutInfo/components/PaymentInfoForm/PaymentInfoForm.tsx

@@ -1,19 +1,18 @@
 import React from 'react'
 import { ButtonCommon, TabCommon, TabPane } from 'src/components/common'
-import { CheckOutForm } from 'src/utils/types.utils'
 import BankTransfer from '../BankTransfer/BankTransfer'
-import Link from 'next/link'
-
-import s from './PaymentInfoForm.module.scss'
+import ChekoutNotePolicy from '../ChekoutNotePolicy/ChekoutNotePolicy'
 import CreditCardForm from '../CreditCardForm/CreditCardForm'
+import s from './PaymentInfoForm.module.scss'
+
 interface PaymentInfoFormProps {
-  onConfirm?: (id: number, formInfo: CheckOutForm) => void
+  onConfirm?: (id: number) => void
   id: number
 }
 
 const PaymentInfoForm = ({onConfirm,id}: PaymentInfoFormProps) => {
   const handleConfirmClick = () => {
-    onConfirm && onConfirm(id,{})
+    onConfirm && onConfirm(id)
   }
   return (
     <div className={s.wrapper}>
@@ -29,21 +28,7 @@ const PaymentInfoForm = ({onConfirm,id}: PaymentInfoFormProps) => {
         </TabPane>
       </TabCommon>
       <div className={s.bottom}>
-        <div className={s.note}>
-          By clicking continue you agree to Casper's{' '}
-          {
-            <Link href="#">
-              <strong>terms and conditions</strong>
-            </Link>
-          }{' '}
-          and{' '}
-          {
-            <Link href="#">
-              <strong>privacy policy </strong>
-            </Link>
-          }
-          .
-        </div>
+        <ChekoutNotePolicy/>
         <div className={s.button}>
           <ButtonCommon onClick={handleConfirmClick}>
             Submit Order

src/components/modules/checkout/CheckoutInfo/components/ShippingInfoForm/ShippingInfoForm.tsx

@@ -1,17 +1,14 @@
-import React, { useEffect, useRef } from 'react'
-import { ButtonCommon, Inputcommon, InputFiledInForm, SelectCommon, SelectFieldInForm } from 'src/components/common'
-import s from './ShippingInfoForm.module.scss'
-import Link from 'next/link'
-import { CustomInputCommon } from 'src/utils/type.utils'
-import { Shipping } from 'src/components/icons'
-import { CheckOutForm } from 'src/utils/types.utils'
 import { Form, Formik } from 'formik'
+import React, { useEffect, useRef } from 'react'
+import { ButtonCommon, InputFiledInForm, SelectFieldInForm } from 'src/components/common'
+import { useMessage } from 'src/components/contexts'
+import { useSetOrderShippingAddress } from 'src/components/hooks/order'
+import { COUNTRY_CODE } from 'src/domains/data/countryCode'
 import { LANGUAGE } from 'src/utils/language.utils'
+import { CustomInputCommon } from 'src/utils/type.utils'
 import * as Yup from 'yup'
 import ChekoutNotePolicy from '../ChekoutNotePolicy/ChekoutNotePolicy'
-import { useSetOrderShippingAddress } from 'src/components/hooks/order'
-import { useMessage } from 'src/components/contexts'
-import { COUNTRY_CODE } from 'src/domains/data/countryCode'
+import s from './ShippingInfoForm.module.scss'
 
 interface ShippingInfoFormProps {
   id: number