From 0db8ea8773f971478601fb97ea5f04f07a9d9131 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Sebastian=20Kr=C3=BCger?= <valknar@pivoine.art>
Date: Thu, 26 Feb 2026 12:40:03 +0100
Subject: [PATCH] refactor: remove favorite and copy features from units
 converter

---
 app/globals.css                    |  2 +
 components/units/MainConverter.tsx | 59 +-----------------------------
 2 files changed, 3 insertions(+), 58 deletions(-)

diff --git a/app/globals.css b/app/globals.css
index 5c3d16f..5448156 100644
--- a/app/globals.css
+++ b/app/globals.css
@@ -4,6 +4,8 @@
 @source "../components/ui/*.{js,ts,jsx,tsx}";
 @source "*.{js,ts,jsx,tsx}";
 
+@custom-variant hover (&:hover);
+
 @theme {
   --color-background: var(--background);
   --color-foreground: var(--foreground);
diff --git a/components/units/MainConverter.tsx b/components/units/MainConverter.tsx
index e367413..0086d46 100644
--- a/components/units/MainConverter.tsx
+++ b/components/units/MainConverter.tsx
@@ -1,7 +1,7 @@
 'use client';
 
 import { useState, useEffect, useCallback } from 'react';
-import { Copy, Star, Check, ArrowLeftRight, BarChart3 } from 'lucide-react';
+import { ArrowLeftRight, BarChart3 } from 'lucide-react';
 import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card';
 import { Input } from '@/components/ui/input';
 import { Button } from '@/components/ui/button';
@@ -25,7 +25,6 @@ import {
   type ConversionResult,
 } from '@/lib/units/units';
 import { parseNumberInput, formatNumber, cn } from '@/lib/utils';
-import { getFavorites, toggleFavorite } from '@/lib/units/storage';
 
 export default function MainConverter() {
   const [selectedMeasure, setSelectedMeasure] = useState<Measure>('length');
@@ -33,19 +32,12 @@ export default function MainConverter() {
   const [targetUnit, setTargetUnit] = useState<string>('ft');
   const [inputValue, setInputValue] = useState<string>('1');
   const [conversions, setConversions] = useState<ConversionResult[]>([]);
-  const [favorites, setFavorites] = useState<string[]>([]);
-  const [copiedUnit, setCopiedUnit] = useState<string | null>(null);
   const [showVisualComparison, setShowVisualComparison] = useState(false);
   const [isDragging, setIsDragging] = useState(false);
 
   const measures = getAllMeasures();
   const units = getUnitsForMeasure(selectedMeasure);
 
-  // Load favorites
-  useEffect(() => {
-    setFavorites(getFavorites());
-  }, []);
-
   // Update conversions when input changes
   useEffect(() => {
     const numValue = parseNumberInput(inputValue);
@@ -80,23 +72,6 @@ export default function MainConverter() {
     }
   }, [selectedUnit, targetUnit, inputValue]);
 
-  // Copy to clipboard
-  const copyToClipboard = useCallback(async (value: number, unit: string) => {
-    try {
-      await navigator.clipboard.writeText(`${formatNumber(value)} ${unit}`);
-      setCopiedUnit(unit);
-      setTimeout(() => setCopiedUnit(null), 2000);
-    } catch (error) {
-      console.error('Failed to copy:', error);
-    }
-  }, []);
-
-  // Toggle favorite
-  const handleToggleFavorite = useCallback((unit: string) => {
-    const isFavorite = toggleFavorite(unit);
-    setFavorites(getFavorites());
-  }, []);
-
   // Handle search selection
   const handleSearchSelect = useCallback((unit: string, measure: Measure) => {
     setSelectedMeasure(measure);
@@ -250,43 +225,11 @@ export default function MainConverter() {
           ) : (
             <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4">
               {conversions.map((conversion) => {
-              const isFavorite = favorites.includes(conversion.unit);
-              const isCopied = copiedUnit === conversion.unit;
-
               return (
                 <div
                   key={conversion.unit}
                   className="group relative p-4 rounded-lg border bg-card hover:bg-accent/50 transition-colors border-l-4 border-l-primary/30"
                 >
-                  {/* Favorite & Copy buttons */}
-                  <div className="absolute top-2 right-2 flex gap-1 opacity-0 group-hover:opacity-100 transition-opacity">
-                    <Button
-                      variant="ghost"
-                      size="icon"
-                      className="h-8 w-8"
-                      onClick={() => handleToggleFavorite(conversion.unit)}
-                    >
-                      <Star
-                        className={cn(
-                          'h-4 w-4',
-                          isFavorite && 'fill-yellow-400 text-yellow-400'
-                        )}
-                      />
-                    </Button>
-                    <Button
-                      variant="ghost"
-                      size="icon"
-                      className="h-8 w-8"
-                      onClick={() => copyToClipboard(conversion.value, conversion.unit)}
-                    >
-                      {isCopied ? (
-                        <Check className="h-4 w-4 text-green-500" />
-                      ) : (
-                        <Copy className="h-4 w-4" />
-                      )}
-                    </Button>
-                  </div>
-
                   <div className="text-sm text-muted-foreground mb-1">
                     {conversion.unitInfo.plural}
                   </div>