ui phase 6

client/src/components/PriceBreakdown/PriceBreakdown.tsx

@@ -1,10 +1,9 @@
 'use client';
 import { FunctionComponent } from 'react';
-import { useLocale } from 'next-intl';
 import { Divider, Stack, Typography } from '@mui/material';
 import Money from '@/components/common/Money';
 import SurfaceCard from '@/components/common/SurfaceCard';
-import { formatIrrToToman, parseIrr } from '@/utils';
+import { parseIrr } from '@/utils';
 
 export interface PriceBreakdownRow {
   /** Stable row key (e.g. `service_cost`) — also exposed as `data-row` for tests/automation. */
@@ -31,8 +30,6 @@ export interface PriceBreakdownProps {
  * @component PriceBreakdown
  */
 const PriceBreakdown: FunctionComponent<PriceBreakdownProps> = ({ rows, totalLabel, totalAmountIrr }) => {
-  const locale = useLocale();
-
   if (process.env.NODE_ENV !== 'production') {
     const sum = rows.reduce((acc, row) => acc + parseIrr(row.amountIrr), BigInt(0));
     if (sum !== parseIrr(totalAmountIrr)) {
@@ -50,9 +47,7 @@ const PriceBreakdown: FunctionComponent<PriceBreakdownProps> = ({ rows, totalLab
             <Typography variant="body2" sx={{ color: 'text.secondary' }}>
               {row.label}
             </Typography>
-            <Typography variant="body2" sx={{ fontWeight: 500 }}>
-              {formatIrrToToman(row.amountIrr, locale)}
-            </Typography>
+            <Money amountIrr={row.amountIrr} size="sm" sx={{ fontWeight: 500 }} />
           </Stack>
         ))}
         <Divider />