danak/dmenu-plus-front
1
0
Fork 0
Code Issues Pull Requests Actions 3 Packages Projects Releases Wiki Activity

textarea cart

Browse Source
This commit is contained in:
hamid zarghami
2026-06-21 15:08:14 +03:30
parent c565c0957f
commit ed5df3d7b7
1 changed files with 31 additions and 44 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/app/[name]/(Main)/cart/components/CartSummary.tsx
+31 -44
View File
@@ -1,17 +1,17 @@
'use client'; "use client";
import React from 'react'; import { useGetFoods } from "@/app/[name]/(Main)/hooks/useMenuData";
import Link from 'next/link'; import { useGetProfile } from "@/app/[name]/(Profile)/profile/hooks/userProfileData";
import { useParams, useRouter, usePathname } from 'next/navigation'; import Button from "@/components/button/PrimaryButton";
import Button from '@/components/button/PrimaryButton'; import { glassSurfaceNav } from "@/lib/styles/glassSurface";
import { useGetFoods } from '@/app/[name]/(Main)/hooks/useMenuData'; import Link from "next/link";
import { useCart } from '../hook/useCart'; import { useParams, usePathname, useRouter } from "next/navigation";
import { useTranslation } from 'react-i18next'; import React from "react";
import { useGetProfile } from '@/app/[name]/(Profile)/profile/hooks/userProfileData'; import { useTranslation } from "react-i18next";
import { useGetCartItems } from '../hooks/useCartData'; import { useCart } from "../hook/useCart";
import { useCartStore } from '../store/Store'; import { useGetCartItems } from "../hooks/useCartData";
import { guestCartItemsToFoods } from '../lib/cartUtils'; import { guestCartItemsToFoods } from "../lib/cartUtils";
import { glassSurfaceNav } from '@/lib/styles/glassSurface'; import { useCartStore } from "../store/Store";
interface CartSummaryProps { interface CartSummaryProps {
isPremium: boolean; isPremium: boolean;
@@ -27,7 +27,7 @@ const CartSummary = ({ isPremium, hasItems }: CartSummaryProps) => {
const { data: foodsResponse } = useGetFoods(); const { data: foodsResponse } = useGetFoods();
const { items } = useCart(); const { items } = useCart();
const { data: cartData } = useGetCartItems(isSuccess); const { data: cartData } = useGetCartItems(isSuccess);
const { t } = useTranslation('parallels', { keyPrefix: 'Cart' }); const { t } = useTranslation("parallels", { keyPrefix: "Cart" });
const { description, setDescription } = useCartStore(); const { description, setDescription } = useCartStore();
const totalPrice = React.useMemo(() => { const totalPrice = React.useMemo(() => {
@@ -46,10 +46,7 @@ const CartSummary = ({ isPremium, hasItems }: CartSummaryProps) => {
}, 0); }, 0);
}, [isSuccess, cartData?.data?.total, foodsResponse?.data, items]); }, [isSuccess, cartData?.data?.total, foodsResponse?.data, items]);
const formatPrice = React.useCallback( const formatPrice = React.useCallback((value: number) => value.toLocaleString("fa-IR"), []);
(value: number) => value.toLocaleString('fa-IR'),
[]
);
if (!hasItems) { if (!hasItems) {
return null; return null;
@@ -58,36 +55,32 @@ const CartSummary = ({ isPremium, hasItems }: CartSummaryProps) => {
return ( return (
<> <>
{isPremium && ( {isPremium && (
<div className='mt-2 mb-4'> <div className="mt-2 mb-4">
<div className='relative'> <div className="relative">
<h3 className='text-sm'>{t('InputDescription.Label')}</h3> <h3 className="text-sm">{t("InputDescription.Label")}</h3>
<textarea <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' 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')} placeholder={t("InputDescription.Placeholder")}
id='description' id="description"
name='description' name="description"
value={description} value={description}
onChange={(e) => setDescription(e.target.value)} onChange={(e) => setDescription(e.target.value)}
></textarea> ></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> </div>
)} )}
<div className={glassSurfaceNav('fixed bottom-0 left-0 right-0 z-50 border-t border-border p-4 w-full')}> <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 justify-between items-center gap-4">
<div className='flex flex-col'> <div className="flex flex-col">
<div className='text-xs text-gray-400 dark:text-disabled-text'>{t('PayableAmountLabel')}</div> <div className="text-xs text-gray-400 dark:text-disabled-text">{t("PayableAmountLabel")}</div>
{isPremium && ( {isPremium && <div className="text-sm mt-2 font-semibold dark:text-foreground">{formatPrice(totalPrice)} تومان</div>}
<div className='text-sm mt-2 font-semibold dark:text-foreground'>
{formatPrice(totalPrice)} تومان
</div>
)}
</div> </div>
{isPremium && ( {isPremium && (
<Link <Link
href={'order/checkout/0'} href={"order/checkout/0"}
onClick={(event) => { onClick={(event) => {
if (!isSuccess) { if (!isSuccess) {
event.preventDefault(); 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'> <Button className="w-fit! px-10 dark:bg-white dark:text-black! dark:hover:bg-gray-100">{t("ButtonCheckout")}</Button>
{t('ButtonCheckout')}
</Button>
</Link> </Link>
)} )}
{!isPremium && ( {!isPremium && <div className="text-sm mt-2 font-semibold dark:text-foreground">{formatPrice(totalPrice)} تومان</div>}
<div className='text-sm mt-2 font-semibold dark:text-foreground'>
{formatPrice(totalPrice)} تومان
</div>
)}
</div> </div>
</div> </div>
</> </>