fix design bug

src/app/[name]/(Dialogs)/cart/page.tsx

@@ -8,12 +8,17 @@ import { useCart } from './hook/useCart';
 import CartItemsList from './components/CartItemsList';
 import CartSummary from './components/CartSummary';
 import Prompt from '@/components/utils/Prompt';
+import { useGetFoods } from '@/app/[name]/(Main)/hooks/useMenuData';
+import { CartSummarySkeleton } from './components/CartSkeleton';
 
 const CartIndex = () => {
   const { t } = useTranslation('parallels', { keyPrefix: 'Cart' });
   const router = useRouter();
   const { clearCart } = useCart();
   const [showClearConfirm, setShowClearConfirm] = React.useState(false);
+  const { data: foodsResponse, isFetching } = useGetFoods();
+  const foods = React.useMemo(() => foodsResponse?.data ?? [], [foodsResponse?.data]);
+  const isLoading = isFetching && !foods.length;
 
   const handleClearCart = (e: React.MouseEvent) => {
     e?.preventDefault();
@@ -48,7 +53,7 @@ const CartIndex = () => {
 
       <div className='flex overflow-y-auto noscrollbar flex-col h-full pt-4 gap-4 pb-24' dir='rtl'>
         <CartItemsList />
-        <CartSummary />
+        {isLoading ? <CartSummarySkeleton /> : <CartSummary />}
       </div>
 
       <div className={showClearConfirm ? 'fixed inset-0 z-1001' : 'pointer-events-none fixed inset-0 z-1001'}>