Fix unit conversions in forms

src/components/admin/editors/TechnicalSpecsEditor.tsx

@@ -4,6 +4,13 @@ import { Input } from "@/components/ui/input";
 import { Label } from "@/components/ui/label";
 import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "@/components/ui/select";
 import { Card } from "@/components/ui/card";
+import { useUnitPreferences } from "@/hooks/useUnitPreferences";
+import { 
+  convertValueToMetric, 
+  convertValueFromMetric, 
+  detectUnitType,
+  getMetricUnit 
+} from "@/lib/units";
 
 interface TechnicalSpec {
   spec_name: string;
@@ -30,6 +37,7 @@ export function TechnicalSpecsEditor({
   categories = DEFAULT_CATEGORIES,
   commonSpecs = []
 }: TechnicalSpecsEditorProps) {
+  const { preferences } = useUnitPreferences();
   
   const addSpec = () => {
     onChange([
@@ -57,6 +65,23 @@ export function TechnicalSpecsEditor({
     onChange(newSpecs);
   };
 
+  // Get display value (convert from metric if needed)
+  const getDisplayValue = (spec: TechnicalSpec): string => {
+    if (!spec.spec_value || !spec.unit || spec.spec_type !== 'number') return spec.spec_value;
+    
+    const numValue = parseFloat(spec.spec_value);
+    if (isNaN(numValue)) return spec.spec_value;
+    
+    const unitType = detectUnitType(spec.unit);
+    if (unitType === 'unknown') return spec.spec_value;
+    
+    // Assume stored value is in metric, convert to user's preferred units
+    const metricUnit = getMetricUnit(spec.unit);
+    const displayValue = convertValueFromMetric(numValue, spec.unit, metricUnit);
+    
+    return String(displayValue);
+  };
+
   const moveSpec = (index: number, direction: 'up' | 'down') => {
     if ((direction === 'up' && index === 0) || (direction === 'down' && index === specs.length - 1)) {
       return;
@@ -107,11 +132,30 @@ export function TechnicalSpecsEditor({
                 <div>
                   <Label className="text-xs">Value</Label>
                   <Input
-                    value={spec.spec_value}
-                    onChange={(e) => updateSpec(index, 'spec_value', e.target.value)}
+                    value={getDisplayValue(spec)}
+                    onChange={(e) => {
+                      const inputValue = e.target.value;
+                      // If type is number and unit is recognized, convert to metric for storage
+                      if (spec.spec_type === 'number' && spec.unit) {
+                        const numValue = parseFloat(inputValue);
+                        if (!isNaN(numValue)) {
+                          const metricValue = convertValueToMetric(numValue, spec.unit);
+                          updateSpec(index, 'spec_value', String(metricValue));
+                        } else {
+                          updateSpec(index, 'spec_value', inputValue);
+                        }
+                      } else {
+                        updateSpec(index, 'spec_value', inputValue);
+                      }
+                    }}
                     placeholder="Value"
                     type={spec.spec_type === 'number' ? 'number' : 'text'}
                   />
+                  {spec.spec_type === 'number' && spec.unit && (
+                    <p className="text-xs text-muted-foreground mt-1">
+                      Using {preferences.measurement_system} units
+                    </p>
+                  )}
                 </div>
 
                 <div>