Fix unit conversions in forms

src/components/admin/editors/CoasterStatsEditor.tsx

@@ -5,6 +5,13 @@ import { Label } from "@/components/ui/label";
 import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "@/components/ui/select";
 import { Textarea } from "@/components/ui/textarea";
 import { Card } from "@/components/ui/card";
+import { useUnitPreferences } from "@/hooks/useUnitPreferences";
+import { 
+  convertValueToMetric, 
+  convertValueFromMetric, 
+  detectUnitType,
+  getMetricUnit
+} from "@/lib/units";
 
 interface CoasterStat {
   stat_name: string;
@@ -38,6 +45,7 @@ export function CoasterStatsEditor({
   onChange, 
   categories = DEFAULT_CATEGORIES 
 }: CoasterStatsEditorProps) {
+  const { preferences } = useUnitPreferences();
   
   const addStat = () => {
     onChange([
@@ -78,6 +86,23 @@ export function CoasterStatsEditor({
     onChange(newStats);
   };
 
+  // Get display value (convert from metric if needed)
+  const getDisplayValue = (stat: CoasterStat): string => {
+    if (!stat.stat_value || !stat.unit) return String(stat.stat_value || '');
+    
+    const numValue = Number(stat.stat_value);
+    if (isNaN(numValue)) return String(stat.stat_value);
+    
+    const unitType = detectUnitType(stat.unit);
+    if (unitType === 'unknown') return String(stat.stat_value);
+    
+    // Assume stored value is in metric, convert to user's preferred units
+    const metricUnit = getMetricUnit(stat.unit);
+    const displayValue = convertValueFromMetric(numValue, stat.unit, metricUnit);
+    
+    return String(displayValue);
+  };
+
   return (
     <div className="space-y-4">
       <div className="flex items-center justify-between">
@@ -129,10 +154,27 @@ export function CoasterStatsEditor({
                     <Input
                       type="number"
                       step="0.01"
-                      value={stat.stat_value}
-                      onChange={(e) => updateStat(index, 'stat_value', parseFloat(e.target.value) || 0)}
+                      value={getDisplayValue(stat)}
+                      onChange={(e) => {
+                        const inputValue = e.target.value;
+                        // If unit is recognized, convert to metric for storage
+                        if (stat.unit) {
+                          const numValue = parseFloat(inputValue);
+                          if (!isNaN(numValue)) {
+                            const metricValue = convertValueToMetric(numValue, stat.unit);
+                            updateStat(index, 'stat_value', metricValue);
+                          } else {
+                            updateStat(index, 'stat_value', 0);
+                          }
+                        } else {
+                          updateStat(index, 'stat_value', parseFloat(inputValue) || 0);
+                        }
+                      }}
                       placeholder="0"
                     />
+                    <p className="text-xs text-muted-foreground mt-1">
+                      Using {preferences.measurement_system} units
+                    </p>
                   </div>
                   <div>
                     <Label className="text-xs">Unit</Label>

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>