fix: dragging now switches source unit to update all bars correctly
Fixed dragging behavior so all bars update when you drag: Problem: - Dragging a bar would change values but bars wouldn't visually update - The bar would reset to original length on release - Other bars wouldn't change at all Root cause: - We were converting the dragged value back to the selected unit - This kept the source unit the same, so relative percentages didn't change - The logarithmic scale maintained proportions, preventing visual updates Solution: - When dragging a bar, switch to that unit as the new source unit - Set both inputValue and selectedUnit to the dragged unit's value/name - This changes the conversion base, making all other bars recalculate - Removed draggedPercentage state (not needed with this approach) - All bars now use calculated percentages from conversions How it works now: - Drag the "feet" bar → becomes the source unit (selectedUnit = 'ft') - All conversions recalculate from feet - All bars update their percentages based on new conversion base - No transitions during drag for instant visual feedback - Smooth animation when drag ends 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
@@ -125,11 +125,10 @@ export default function MainConverter() {
|
||||
|
||||
// Handle value change from draggable bars
|
||||
const handleValueChange = useCallback((value: number, unit: string) => {
|
||||
// Convert the dragged unit's value back to the currently selected unit
|
||||
const convertedValue = convertUnit(value, unit, selectedUnit);
|
||||
setInputValue(convertedValue.toString());
|
||||
// Keep selectedUnit the same - user is still inputting in that unit
|
||||
}, [selectedUnit]);
|
||||
// When dragging a bar, switch to that unit as the source
|
||||
setInputValue(value.toString());
|
||||
setSelectedUnit(unit);
|
||||
}, []);
|
||||
|
||||
return (
|
||||
<div className="w-full max-w-6xl mx-auto space-y-6">
|
||||
|
||||
Reference in New Issue
Block a user