51 lines
1.4 KiB
TypeScript
51 lines
1.4 KiB
TypeScript
import { Form } from "antd";
|
|
import { useEffect } from "react";
|
|
|
|
import { selectCart } from "features/order/orderSlice";
|
|
import useBreakPoint from "hooks/useBreakPoint.ts";
|
|
import CartDesktopLayout from "pages/cart/components/CartDesktopLayout.tsx";
|
|
import CartMobileTabletLayout from "pages/cart/components/CartMobileTabletLayout.tsx";
|
|
import { useAppSelector } from "redux/hooks";
|
|
|
|
export default function CartPage() {
|
|
const { isDesktop } = useBreakPoint();
|
|
const [form] = Form.useForm();
|
|
const { specialRequest, plateCar } = useAppSelector(selectCart);
|
|
|
|
useEffect(() => {
|
|
form.setFieldsValue({ specialRequest, plateCar });
|
|
}, [form, specialRequest, plateCar]);
|
|
|
|
// Prevent keyboard from appearing automatically on mobile
|
|
useEffect(() => {
|
|
// Blur any focused element when component mounts
|
|
if (document.activeElement instanceof HTMLElement) {
|
|
document.activeElement.blur();
|
|
}
|
|
|
|
// Prevent focus on any input elements
|
|
const inputs = document.querySelectorAll("input, textarea, select");
|
|
inputs.forEach((input) => {
|
|
if (input instanceof HTMLElement) {
|
|
input.blur();
|
|
}
|
|
});
|
|
}, []);
|
|
|
|
// Enhanced desktop layout
|
|
if (isDesktop) {
|
|
return (
|
|
<Form form={form} layout="vertical">
|
|
<CartDesktopLayout form={form} />
|
|
</Form>
|
|
);
|
|
}
|
|
|
|
// Mobile/Tablet Layout (existing code)
|
|
return (
|
|
<Form form={form} layout="vertical">
|
|
<CartMobileTabletLayout form={form} />
|
|
</Form>
|
|
);
|
|
}
|