textarea cart
This commit is contained in:
@@ -1,17 +1,17 @@
|
||||
'use client';
|
||||
"use client";
|
||||
|
||||
import React from 'react';
|
||||
import Link from 'next/link';
|
||||
import { useParams, useRouter, usePathname } from 'next/navigation';
|
||||
import Button from '@/components/button/PrimaryButton';
|
||||
import { useGetFoods } from '@/app/[name]/(Main)/hooks/useMenuData';
|
||||
import { useCart } from '../hook/useCart';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
import { useGetProfile } from '@/app/[name]/(Profile)/profile/hooks/userProfileData';
|
||||
import { useGetCartItems } from '../hooks/useCartData';
|
||||
import { useCartStore } from '../store/Store';
|
||||
import { guestCartItemsToFoods } from '../lib/cartUtils';
|
||||
import { glassSurfaceNav } from '@/lib/styles/glassSurface';
|
||||
import { useGetFoods } from "@/app/[name]/(Main)/hooks/useMenuData";
|
||||
import { useGetProfile } from "@/app/[name]/(Profile)/profile/hooks/userProfileData";
|
||||
import Button from "@/components/button/PrimaryButton";
|
||||
import { glassSurfaceNav } from "@/lib/styles/glassSurface";
|
||||
import Link from "next/link";
|
||||
import { useParams, usePathname, useRouter } from "next/navigation";
|
||||
import React from "react";
|
||||
import { useTranslation } from "react-i18next";
|
||||
import { useCart } from "../hook/useCart";
|
||||
import { useGetCartItems } from "../hooks/useCartData";
|
||||
import { guestCartItemsToFoods } from "../lib/cartUtils";
|
||||
import { useCartStore } from "../store/Store";
|
||||
|
||||
interface CartSummaryProps {
|
||||
isPremium: boolean;
|
||||
@@ -27,7 +27,7 @@ const CartSummary = ({ isPremium, hasItems }: CartSummaryProps) => {
|
||||
const { data: foodsResponse } = useGetFoods();
|
||||
const { items } = useCart();
|
||||
const { data: cartData } = useGetCartItems(isSuccess);
|
||||
const { t } = useTranslation('parallels', { keyPrefix: 'Cart' });
|
||||
const { t } = useTranslation("parallels", { keyPrefix: "Cart" });
|
||||
const { description, setDescription } = useCartStore();
|
||||
|
||||
const totalPrice = React.useMemo(() => {
|
||||
@@ -46,10 +46,7 @@ const CartSummary = ({ isPremium, hasItems }: CartSummaryProps) => {
|
||||
}, 0);
|
||||
}, [isSuccess, cartData?.data?.total, foodsResponse?.data, items]);
|
||||
|
||||
const formatPrice = React.useCallback(
|
||||
(value: number) => value.toLocaleString('fa-IR'),
|
||||
[]
|
||||
);
|
||||
const formatPrice = React.useCallback((value: number) => value.toLocaleString("fa-IR"), []);
|
||||
|
||||
if (!hasItems) {
|
||||
return null;
|
||||
@@ -58,36 +55,32 @@ const CartSummary = ({ isPremium, hasItems }: CartSummaryProps) => {
|
||||
return (
|
||||
<>
|
||||
{isPremium && (
|
||||
<div className='mt-2 mb-4'>
|
||||
<div className='relative'>
|
||||
<h3 className='text-sm'>{t('InputDescription.Label')}</h3>
|
||||
<div className="mt-2 mb-4">
|
||||
<div className="relative">
|
||||
<h3 className="text-sm">{t("InputDescription.Label")}</h3>
|
||||
<textarea
|
||||
className='w-full px-4 py-2.5 mt-4 text-sm2 leading-6 outline-0 border border-border rounded-normal resize-none focus:ring-0'
|
||||
placeholder={t('InputDescription.Placeholder')}
|
||||
id='description'
|
||||
name='description'
|
||||
className="w-full px-4 py-2.5 mt-4 text-sm2 leading-6 outline-0 border border-white rounded-normal bg-white/50 resize-none focus:ring-0"
|
||||
placeholder={t("InputDescription.Placeholder")}
|
||||
id="description"
|
||||
name="description"
|
||||
value={description}
|
||||
onChange={(e) => setDescription(e.target.value)}
|
||||
></textarea>
|
||||
<span className='absolute top-4 right-2 px-2 bg-background text-foreground text-xs'></span>
|
||||
<span className="absolute top-4 right-2 px-2 bg-background text-foreground text-xs"></span>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
|
||||
<div className={glassSurfaceNav('fixed bottom-0 left-0 right-0 z-50 border-t border-border p-4 w-full')}>
|
||||
<div className='flex justify-between items-center gap-4'>
|
||||
<div className='flex flex-col'>
|
||||
<div className='text-xs text-gray-400 dark:text-disabled-text'>{t('PayableAmountLabel')}</div>
|
||||
{isPremium && (
|
||||
<div className='text-sm mt-2 font-semibold dark:text-foreground'>
|
||||
{formatPrice(totalPrice)} تومان
|
||||
</div>
|
||||
)}
|
||||
<div className={glassSurfaceNav("fixed bottom-0 left-0 right-0 z-50 border-t border-border p-4 w-full")}>
|
||||
<div className="flex justify-between items-center gap-4">
|
||||
<div className="flex flex-col">
|
||||
<div className="text-xs text-gray-400 dark:text-disabled-text">{t("PayableAmountLabel")}</div>
|
||||
{isPremium && <div className="text-sm mt-2 font-semibold dark:text-foreground">{formatPrice(totalPrice)} تومان</div>}
|
||||
</div>
|
||||
|
||||
{isPremium && (
|
||||
<Link
|
||||
href={'order/checkout/0'}
|
||||
href={"order/checkout/0"}
|
||||
onClick={(event) => {
|
||||
if (!isSuccess) {
|
||||
event.preventDefault();
|
||||
@@ -97,16 +90,10 @@ const CartSummary = ({ isPremium, hasItems }: CartSummaryProps) => {
|
||||
}
|
||||
}}
|
||||
>
|
||||
<Button className='w-fit! px-10 dark:bg-white dark:text-black! dark:hover:bg-gray-100'>
|
||||
{t('ButtonCheckout')}
|
||||
</Button>
|
||||
<Button className="w-fit! px-10 dark:bg-white dark:text-black! dark:hover:bg-gray-100">{t("ButtonCheckout")}</Button>
|
||||
</Link>
|
||||
)}
|
||||
{!isPremium && (
|
||||
<div className='text-sm mt-2 font-semibold dark:text-foreground'>
|
||||
{formatPrice(totalPrice)} تومان
|
||||
</div>
|
||||
)}
|
||||
{!isPremium && <div className="text-sm mt-2 font-semibold dark:text-foreground">{formatPrice(totalPrice)} تومان</div>}
|
||||
</div>
|
||||
</div>
|
||||
</>
|
||||
|
||||
Reference in New Issue
Block a user