Fix wire gauge bugs, add extra outputs to generic calc generation

package-lock.json

@@ -19,6 +19,7 @@
         "@mui/material": "^5.15.20",
         "@playwright/test": "^1.45.0",
         "@types/ffmpeg": "^1.0.7",
+        "@types/js-quantities": "^1.6.6",
         "@types/lodash": "^4.17.5",
         "@types/morsee": "^1.0.2",
         "@types/omggif": "^1.0.5",
@@ -26,6 +27,7 @@
         "color": "^4.2.3",
         "formik": "^2.4.6",
         "jimp": "^0.22.12",
+        "js-quantities": "^1.8.0",
         "lint-staged": "^15.4.3",
         "lodash": "^4.17.21",
         "mime": "^4.0.6",
@@ -3112,6 +3114,11 @@
         "hoist-non-react-statics": "^3.3.0"
       }
     },
+    "node_modules/@types/js-quantities": {
+      "version": "1.6.6",
+      "resolved": "https://registry.npmjs.org/@types/js-quantities/-/js-quantities-1.6.6.tgz",
+      "integrity": "sha512-k2Q8/Avj4Oz50flfTnfVGnUCkt7OYQ3U+lfQVELE/x5mdbwChZ7fM0wpUpVWzbuSL8kIYt9ZsFQ0RFNBv8T3Qw=="
+    },
     "node_modules/@types/json-schema": {
       "version": "7.0.15",
       "resolved": "https://registry.npmjs.org/@types/json-schema/-/json-schema-7.0.15.tgz",
@@ -6970,6 +6977,11 @@
       "integrity": "sha512-WZzeDOEtTOBK4Mdsar0IqEU5sMr3vSV2RqkAIzUEV2BHnUfKGyswWFPFwK5EeDo93K3FohSHbLAjj0s1Wzd+dg==",
       "license": "BSD-3-Clause"
     },
+    "node_modules/js-quantities": {
+      "version": "1.8.0",
+      "resolved": "https://registry.npmjs.org/js-quantities/-/js-quantities-1.8.0.tgz",
+      "integrity": "sha512-swDw9RJpXACAWR16vAKoSojAsP6NI7cZjjnjKqhOyZSdybRUdmPr071foD3fejUKSU2JMHz99hflWkRWvfLTpQ=="
+    },
     "node_modules/js-tokens": {
       "version": "4.0.0",
       "resolved": "https://registry.npmjs.org/js-tokens/-/js-tokens-4.0.0.tgz",

package.json

@@ -36,6 +36,7 @@
     "@mui/material": "^5.15.20",
     "@playwright/test": "^1.45.0",
     "@types/ffmpeg": "^1.0.7",
+    "@types/js-quantities": "^1.6.6",
     "@types/lodash": "^4.17.5",
     "@types/morsee": "^1.0.2",
     "@types/omggif": "^1.0.5",
@@ -43,6 +44,7 @@
     "color": "^4.2.3",
     "formik": "^2.4.6",
     "jimp": "^0.22.12",
+    "js-quantities": "^1.8.0",
     "lint-staged": "^15.4.3",
     "lodash": "^4.17.21",
     "mime": "^4.0.6",

src/components/input/NumericInputWithUnit.tsx

@@ -0,0 +1,78 @@
+import React, { useState, useEffect } from 'react';
+import { TextField, Grid } from '@mui/material';
+import Autocomplete from '@mui/material/Autocomplete';
+import Qty from 'js-quantities';
+
+export default function NumericInputWithUnit(props: {
+  value: { value: number; unit: string };
+  onChange: (value: { value: number; unit: string }) => void;
+}) {
+  const [inputValue, setInputValue] = useState(props.value.value);
+  const [unit, setUnit] = useState(props.value.unit);
+  const [unitOptions, setUnitOptions] = useState<string[]>([]);
+
+  useEffect(() => {
+    try {
+      const kind = Qty(props.value.unit).kind();
+      const units = Qty.getUnits(kind);
+      setUnitOptions(units);
+    } catch (error) {
+      console.error('Invalid unit kind', error);
+    }
+  }, [props.value.unit]);
+
+  useEffect(() => {
+    setInputValue(props.value.value);
+    setUnit(props.value.unit);
+  }, [props.value]);
+
+  const handleValueChange = (event: React.ChangeEvent<HTMLInputElement>) => {
+    const newValue = parseFloat(event.target.value) || 0;
+    setInputValue(newValue);
+    if (props.onChange) {
+      try {
+        const qty = Qty(newValue, unit).to('meters');
+        props.onChange({ unit: 'meters', value: qty.scalar });
+      } catch (error) {
+        console.error('Conversion error', error);
+      }
+    }
+  };
+
+  const handleUnitChange = (newUnit: string) => {
+    if (!newUnit) return;
+    setUnit(newUnit);
+    try {
+      const convertedValue = Qty(inputValue, unit).to(newUnit).scalar;
+      setInputValue(convertedValue);
+    } catch (error) {
+      console.error('Unit conversion error', error);
+    }
+  };
+
+  return (
+    <Grid container spacing={2} alignItems="center">
+      <Grid item xs={6}>
+        <TextField
+          type="number"
+          fullWidth
+          value={inputValue}
+          onChange={handleValueChange}
+          label="Value"
+        />
+      </Grid>
+      <Grid item xs={6}>
+        <Autocomplete
+          options={unitOptions}
+          value={unit}
+          onChange={() => {
+            handleUnitChange(unit);
+          }}
+          renderInput={(params) => (
+            <TextField {...params} label="Unit" fullWidth />
+          )}
+        />
+      </Grid>
+    </Grid>
+  );
+}

src/datatables/data/wire_gauge.ts

@@ -69,7 +69,7 @@ const data: DataTable = {
 };
 
 for (const key in data.data) {
-  data.data[key].area = Math.PI * data.data[key].diameter ** 2;
+  data.data[key].area = Math.PI * (data.data[key].diameter / 2) ** 2;
 }
 
 export default data;

src/pages/tools/number/generic-calc/data/types.ts

@@ -2,6 +2,12 @@ export interface GenericCalcType {
   title: string;
   name: string;
   formula: string;
+
+  extraOutputs?: {
+    title: string;
+    formula: string;
+    unit: string;
+  }[];
   selections?: {
     title: string;
     source: string;

src/pages/tools/number/generic-calc/data/wire_voltage_drop.ts

@@ -2,7 +2,7 @@ import type { GenericCalcType } from './types';
 const voltagedropinwire: GenericCalcType = {
   title: 'Round trip voltage drop in cable',
   name: 'cable-voltage-drop',
-  formula: 'x = (((p * L) / (A/10**6) ) *2) * I**2',
+  formula: 'x = (((p * L) / (A/10**6) ) *2) * I',
   selections: [
     {
       title: 'Material',
@@ -22,6 +22,19 @@ const voltagedropinwire: GenericCalcType = {
       }
     }
   ],
+
+  extraOutputs: [
+    {
+      title: 'Total Resistance',
+      formula: '((p * L) / (A/10**6))*2',
+      unit: 'Ω'
+    },
+    {
+      title: 'Total Power Dissipated',
+      formula: 'I**2 * (((p * L) / (A/10**6))*2)',
+      unit: 'W'
+    }
+  ],
   variables: [
     {
       name: 'L',

src/pages/tools/number/generic-calc/index.tsx

@@ -49,6 +49,10 @@ export default async function makeTool(
       [key: string]: string;
     }>({});
 
+    const [extraOutputs, setExtraOutputs] = useState<{
+      [key: string]: string;
+    }>({});
+
     const updateVarField = (
       name: string,
       value: number,
@@ -273,6 +277,15 @@ export default async function makeTool(
                       </TableCell>
                     </TableRow>
                   ))}
+
+                  {calcData.extraOutputs?.map((extraOutput) => (
+                    <TableRow key={extraOutput.title}>
+                      <TableCell>{extraOutput.title}</TableCell>
+                      <TableCell>{extraOutputs[extraOutput.title]}</TableCell>
+                      <TableCell>{extraOutput.unit}</TableCell>
+                      <TableCell></TableCell>
+                    </TableRow>
+                  ))}
                 </TableBody>
               </Table>
             )
@@ -311,6 +324,25 @@ export default async function makeTool(
           } else {
             setShortResult('');
           }
+
+          if (calcData.extraOutputs !== undefined) {
+            for (let i = 0; i < calcData.extraOutputs.length; i++) {
+              const extraOutput = calcData.extraOutputs[i];
+
+              let expr = nerdamer(extraOutput.formula);
+
+              Object.keys(values.vars).forEach((key) => {
+                if (key === values.outputVariable) return;
+                expr = expr.sub(key, values.vars[key].value.toString());
+              });
+
+              const result: nerdamer.Expression = expr.evaluate();
+
+              if (result) {
+                extraOutputs[extraOutput.title] = result.toDecimal();
+              }
+            }
+          }
         }}
       />
     );