checkout: reafactor UI

src/pages/checkout/page.tsx

@@ -8,15 +8,15 @@ import { useTranslation } from "react-i18next";
 import { useAppSelector } from "redux/hooks";
 import styles from "../address/address.module.css";
 import { AddressSummary } from "./components/AddressSummary";
-import BriefMenu from "./components/BriefMenu";
 import CheckoutButton from "./components/CheckoutButton";
 import { GiftCard } from "./components/GiftCard";
-import PhoneCard from "./components/phoneCard";
 import { OrderType } from "./hooks/types";
 import RewardWaiterCard from "pages/cart/components/RewardWaiterCard";
 import ProInputCard from "components/ProInputCard/ProInputCard";
 import ProRatioGroups from "components/ProRatioGroups/ProRatioGroups";
 import CouponCard from "pages/cart/components/CouponCard";
+import PhoneCard from "./components/PhoneCard";
+import BriefMenuCard from "./components/BriefMenuCard";
 
 export default function CheckoutPage() {
   const { t } = useTranslation();
@@ -36,8 +36,9 @@ export default function CheckoutPage() {
         <Layout>
           <ProHeader>{t("checkout.title")}</ProHeader>
           <Layout.Content className={styles.checkoutContainer}>
-            <AddressSummary />
+            <PaymentMethods />
             {!token && <PhoneCard />}
+            <AddressSummary />
             {orderType === OrderType.ToRoom && (
               <InputCard
                 title={t("address.roomNo")}
@@ -59,7 +60,6 @@ export default function CheckoutPage() {
             <OfficeDetails /> */}
             {/* <GiftDetails /> */}
             {/* <BriefMenu /> */}
-            <PaymentMethods />
             <CouponCard />
 
             {/* Collection Method */}
@@ -99,6 +99,7 @@ export default function CheckoutPage() {
 
             {/* Reward Your Waiter */}
             <RewardWaiterCard />
+            <BriefMenuCard />
             <OrderSummary />
           </Layout.Content>