Fix convertion rendering and logic

recipes/src/components/Dialog/index.tsx

@@ -23,9 +23,11 @@ interface DialogProps {
 const CBKDialog = ({measure, onConvert}: DialogProps) => {
   const { name, values } = GetMeasure(measure.unit);
   const [ isOpen, setOpen ] = useState(false);
-  const [ result, setResult ] = useState({...measure})
+  const [ result, setResult ] = useState({
+    unit: measure.unit,
+    quantity: measure.quantity
+  })
   
-
   const convert = (qty: number, from: string, to: string) => {
     setResult({unit: to, quantity: Convert(qty, from, to, name as Measure)})
   }
@@ -41,7 +43,6 @@ const CBKDialog = ({measure, onConvert}: DialogProps) => {
       ></Button>
       <Dialog
         onClose={(action) => {
-          console.log(action)
           if (action === 'confirm') {
             onConvert(result)
           }

recipes/src/components/RecipeForm/index.tsx

@@ -98,10 +98,12 @@ const SubrecipeForm = (props: any) => {
                         </Cell>
                         <Cell columns={1}>
                           <Field name={`ingredients[${selectedTab}].ingredients[${index}].quantity`}/>
-                          <Dialog
-                            measure={{unit: ingredient.unit, quantity: ingredient.quantity}}
-                            onConvert={result => ingredientHelpers.replace(index, { ...ingredient, ...result })}
-                          />
+                          {ingredient.unit && ingredient.quantity ? (
+                            <Dialog
+                              measure={{unit: ingredient.unit, quantity: ingredient.quantity}}
+                              onConvert={result => ingredientHelpers.replace(index, { ...ingredient, ...result })}
+                            />
+                          ): null}
                         </Cell>
                         <Cell columns={1}>
                           <Field component='select' name={`ingredients[${selectedTab}].ingredients[${index}].unit`}>
@@ -159,6 +161,7 @@ const RenderForm = ({
   handleChange,
   handleSubmit
 }: FormikProps<Recipe|DBRecipe>) => {
+  console.log("initial values", values)
   return (
     <Grid>
       <form onSubmit={handleSubmit} className='cbk-recipe-form'>

recipes/src/services/measurements.ts

@@ -18,7 +18,7 @@ const conversionTable: {
   volume: {
     ml: 1,
     l: 1000,
-    cup: 240,
+    cup: 236.58,
     tbsp: 14.78,
     tsp: 4.92,
     gal: 3785.41,
@@ -33,7 +33,7 @@ const conversionTableDic: { [measure: string]: string[] } = {
 
 const Convert = (qty: number, from: string, to: string, measure: Measure) => {
   const toAnchor = (unit: string, amount: number) => conversionTable[measure][unit] * amount;
-  return ((qty * toAnchor(from, qty)) / toAnchor(to, 1)).toFixed(2);
+  return parseFloat((toAnchor(from, qty) / toAnchor(to, 1)).toFixed(3));
 }
 
 const GetMeasure = (unit: string): { name: string, values: string[]} => {