EqualltyChoiceBottomSheet: enhance styles

src/features/order/orderSlice.ts

@@ -44,7 +44,7 @@ interface DiscountData {
 interface CartState {
   restaurant: Partial<RestaurantDetails>;
   items: CartItem[];
-  tmp: unknown;
+  tmp: any;
   specialRequest: string;
   location: LocationData | null;
   roomDetails: RoomDetailsType | null;

src/pages/pay/components/splitBill/EqualltyChoiceBottomSheet.tsx

@@ -1,12 +1,10 @@
 import { Button } from "antd";
 import { ProBottomSheet } from "components/ProBottomSheet/ProBottomSheet.tsx";
-import { useEffect, useMemo } from "react";
+import { useMemo } from "react";
 import { useTranslation } from "react-i18next";
 
 import PeopleIcon from "components/Icons/PeopleIcon";
-import ProInputCard from "components/ProInputCard/ProInputCard";
 import ProText from "components/ProText";
-import ProTitle from "components/ProTitle";
 import {
   selectCart,
   selectGrandTotal,
@@ -40,7 +38,7 @@ export function EqualltyChoiceBottomSheet({
   const grandTotal = useAppSelector(selectGrandTotal);
 
   const splitBillTmp = tmp as SplitBillTmp;
-  const totalPeople = splitBillTmp?.totalPeople || 1;
+  const totalPeople = splitBillTmp?.totalPeople || 2;
   const payFor = splitBillTmp?.payFor || 1;
 
   // Calculate split amount
@@ -62,8 +60,6 @@ export function EqualltyChoiceBottomSheet({
     onClose();
   };
 
-  console.log(grandTotal);
-
   return (
     <ProBottomSheet
       isOpen={isOpen}
@@ -71,18 +67,16 @@ export function EqualltyChoiceBottomSheet({
       title={t("splitBill.divideTheBillEqually")}
       showCloseButton={true}
       initialSnap={1}
-      height={810}
+      height={610}
-      snapPoints={[810]}
+      snapPoints={[610]}
     >
       <div
         style={{
-          padding: "20px 0",
           display: "flex",
           flexDirection: "column",
-          gap: 20,
+          marginTop: 20,
         }}
       >
-        <ProInputCard title={t("checkout.splitBill")}>
         <div
           style={{
             display: "flex",
@@ -172,7 +166,6 @@ export function EqualltyChoiceBottomSheet({
             <PayForActions />
           </div>
         </div>
-        </ProInputCard>
 
         {/* Spinner Visualization - Blank Spin Wheel */}
         {totalPeople > 0 && (
@@ -181,13 +174,9 @@ export function EqualltyChoiceBottomSheet({
               display: "flex",
               flexDirection: "column",
               gap: 12,
-              padding: 16,
               alignItems: "center",
             }}
           >
-            <ProTitle level={5} style={{ marginBottom: 8 }}>
-              {t("splitBill.divisionPreview")}
-            </ProTitle>
             <div
               style={{
                 position: "relative",
@@ -237,7 +226,9 @@ export function EqualltyChoiceBottomSheet({
                     <path
                       key={index}
                       d={pathData}
-                      fill={isSelected ? "var(--primary)" : "rgba(0, 0, 0, 0.1)"}
+                      fill={
+                        isSelected ? "var(--primary)" : "rgba(0, 0, 0, 0.1)"
+                      }
                       stroke="#fff"
                       strokeWidth="2"
                     />

src/pages/split-bill/components/TotalPeopleActions.tsx

@@ -8,10 +8,10 @@ export default function TotalPeopleActions() {
 
   return (
     <ActionsButtons
-      quantity={tmp?.totalPeople || 1}
+      quantity={tmp?.totalPeople || 2}
       setQuantity={(value) => dispatch(setTmp({ ...tmp, totalPeople: value }))}
       max={10}
-      min={1}
+      min={2}
     />
   );
 }