refactor calculation code

- implement fee
- centralize the code

src/components/ArabicPrice/ArabicPrice.tsx

@@ -9,6 +9,7 @@ interface ArabicPriceProps {
   strong?: boolean;
   type?: "secondary" | "success" | "warning" | "danger";
   className?: string;
+  hideCurrency?: boolean;
 }
 
 const ArabicPrice: React.FC<ArabicPriceProps> = ({
@@ -17,6 +18,7 @@ const ArabicPrice: React.FC<ArabicPriceProps> = ({
   strong = false,
   type,
   className,
+  hideCurrency = false,
 }) => {
   const { t } = useTranslation();
   const { isRTL } = useAppSelector((state) => state.locale);
@@ -32,12 +34,12 @@ const ArabicPrice: React.FC<ArabicPriceProps> = ({
       style={{
         display: "inline-flex",
         alignItems: "baseline",
-        gap: "0.1em",
+        gap: "0.2em",
         lineHeight: 1,
         ...style,
       }}
     >
-      {isRTL ? (
+      {isRTL && !hideCurrency ? (
         <>
           <span
             style={{
@@ -47,7 +49,6 @@ const ArabicPrice: React.FC<ArabicPriceProps> = ({
           >
             {formattedPrice}
           </span>
-          <span style={{margin: "0 0.1em"}} />
           <span
             style={{
               fontSize: "0.9em",
@@ -60,7 +61,7 @@ const ArabicPrice: React.FC<ArabicPriceProps> = ({
             {t("common.omanCurrency")}
           </span>
         </>
-      ) : (
+      ) : !hideCurrency ? (
         <>
           <span
             style={{
@@ -82,6 +83,8 @@ const ArabicPrice: React.FC<ArabicPriceProps> = ({
             {t("common.omanCurrency")}
           </span>
         </>
+      ) : (
+        <>{formattedPrice}</>
       )}
     </ProText>
   );