Get Unit Converter

src/services/queries/unitConverter.ts

@@ -0,0 +1,13 @@
+import { UnitConversion } from '@/types/services/productRecipe'
+import { useQuery } from '@tanstack/react-query'
+import { api } from '../api'
+
+export function useUnitConverterByIngredient(IngredientId: string) {
+  return useQuery<UnitConversion[]>({
+    queryKey: ['unit-converters/ingredient', IngredientId],
+    queryFn: async () => {
+      const res = await api.get(`/unit-converters/ingredient/${IngredientId}`)
+      return res.data.data
+    }
+  })
+}

src/types/services/productRecipe.ts

@@ -73,3 +73,29 @@ export interface IngredientUnitConverterRequest {
   to_unit_id: string
   conversion_factor: number
 }
+
+export interface UnitConversion {
+  id: string
+  organization_id: string
+  ingredient_id: string
+  from_unit_id: string
+  to_unit_id: string
+  conversion_factor: number
+  is_active: boolean
+  created_at: string
+  updated_at: string
+  created_by: string
+  updated_by: string
+  from_unit: UnitConversionFrom
+  to_unit: UnitConversionTo
+}
+
+export interface UnitConversionFrom {
+  id: string
+  name: string
+}
+
+export interface UnitConversionTo {
+  id: string
+  name: string
+}

src/views/apps/ecommerce/products/ingredient/detail/IngredientDetailUnit.tsx

@@ -3,6 +3,7 @@ import React, { useState } from 'react'
 import { Card, CardContent, CardHeader, Typography, Button, Box, Stack } from '@mui/material'
 import IngedientUnitConversionDrawer from './IngedientUnitConversionDrawer' // Sesuaikan dengan path file Anda
 import { Ingredient } from '@/types/services/productRecipe'
+import { useUnitConverterByIngredient } from '@/services/queries/unitConverter'
 
 interface Props {
   data: Ingredient | undefined
@@ -12,6 +13,8 @@ const IngredientDetailUnit = ({ data }: Props) => {
   // State untuk mengontrol drawer
   const [openConversionDrawer, setOpenConversionDrawer] = useState(false)
 
+  const { data: unitConverters, isLoading } = useUnitConverterByIngredient(data?.id as string)
+
   // Function untuk membuka drawer
   const handleOpenConversionDrawer = () => {
     setOpenConversionDrawer(true)
@@ -42,6 +45,16 @@ const IngredientDetailUnit = ({ data }: Props) => {
                 : {data?.unit.name ?? '-'}
               </Typography>
             </Box>
+            {unitConverters?.map(unitConverter => (
+              <Box sx={{ display: 'flex', alignItems: 'center' }}>
+                <Typography variant='body1' color='text.secondary'>
+                  1 {unitConverter.from_unit.name}
+                </Typography>
+                <Typography variant='body1' sx={{ fontWeight: 'medium' }}>
+                  : {unitConverter.conversion_factor} {unitConverter.to_unit.name}
+                </Typography>
+              </Box>
+            )) ?? []}
           </Stack>
 
           <Button