From 896ad1532105db71452f4be54ad5b0c4c650056a Mon Sep 17 00:00:00 2001
From: myrmidex <myrmidex@myrmidex.net>
Date: Sat, 12 Jul 2025 23:39:34 +0200
Subject: [PATCH] Clean up old files

---
 .../js/components/Display/MilestoneModal.tsx  |  33 ---
 .../Display/MilestoneProgressBar.tsx          | 167 ---------------
 .../js/components/Display/PurchaseModal.tsx   |  33 ---
 .../js/components/Display/StatsPanel.tsx      | 193 ------------------
 4 files changed, 426 deletions(-)
 delete mode 100644 resources/js/components/Display/MilestoneModal.tsx
 delete mode 100644 resources/js/components/Display/MilestoneProgressBar.tsx
 delete mode 100644 resources/js/components/Display/PurchaseModal.tsx
 delete mode 100644 resources/js/components/Display/StatsPanel.tsx

diff --git a/resources/js/components/Display/MilestoneModal.tsx b/resources/js/components/Display/MilestoneModal.tsx
deleted file mode 100644
index 848195a..0000000
--- a/resources/js/components/Display/MilestoneModal.tsx
+++ /dev/null
@@ -1,33 +0,0 @@
-import AddMilestoneForm from '@/components/Milestones/AddMilestoneForm';
-import { Dialog, DialogContent, DialogHeader, DialogTitle } from '@/components/ui/dialog';
-
-interface MilestoneModalProps {
-    isOpen: boolean;
-    onClose: () => void;
-    onSuccess?: () => void;
-}
-
-export default function MilestoneModal({ isOpen, onClose, onSuccess }: MilestoneModalProps) {
-    const handleSuccess = () => {
-        if (onSuccess) {
-            onSuccess();
-        }
-        onClose();
-    };
-
-    return (
-        <Dialog open={isOpen} onOpenChange={onClose}>
-            <DialogContent className="bg-black border-red-500/30 text-red-400 max-w-md">
-                <DialogHeader>
-                    <DialogTitle className="text-red-500 font-mono tracking-wide">
-                        ADD MILESTONE
-                    </DialogTitle>
-                </DialogHeader>
-                
-                <div className="mt-4">
-                    <AddMilestoneForm onSuccess={handleSuccess} />
-                </div>
-            </DialogContent>
-        </Dialog>
-    );
-}
\ No newline at end of file
diff --git a/resources/js/components/Display/MilestoneProgressBar.tsx b/resources/js/components/Display/MilestoneProgressBar.tsx
deleted file mode 100644
index 36bbd64..0000000
--- a/resources/js/components/Display/MilestoneProgressBar.tsx
+++ /dev/null
@@ -1,167 +0,0 @@
-import { cn } from '@/lib/utils';
-import { ChevronLeft, ChevronRight, Plus } from 'lucide-react';
-import { useState } from 'react';
-
-interface Milestone {
-    target: number;
-    label: string;
-    color: string;
-}
-
-interface MilestoneProgressBarProps {
-    currentShares: number;
-    className?: string;
-    onStatsToggle?: () => void;
-    showStats?: boolean;
-    isVisible?: boolean;
-    onAddPurchase?: () => void;
-    onHover?: (isHovered: boolean) => void;
-}
-
-const milestones: Milestone[] = [
-    { target: 1500, label: '1.5K', color: 'bg-blue-500' },
-    { target: 3000, label: '3K', color: 'bg-green-500' },
-    { target: 4500, label: '4.5K', color: 'bg-yellow-500' },
-    { target: 6000, label: '6K', color: 'bg-red-500' },
-];
-
-export default function MilestoneProgressBar({ 
-    currentShares, 
-    className,
-    onStatsToggle,
-    showStats = false,
-    isVisible = false,
-    onAddPurchase,
-    onHover
-}: MilestoneProgressBarProps) {
-    const [currentMilestoneIndex, setCurrentMilestoneIndex] = useState(0);
-    
-    const currentMilestone = milestones[currentMilestoneIndex];
-    const progress = Math.min((currentShares / currentMilestone.target) * 100, 100);
-    const isCompleted = currentShares >= currentMilestone.target;
-
-    const nextMilestone = () => {
-        setCurrentMilestoneIndex((prev) => 
-            prev < milestones.length - 1 ? prev + 1 : 0
-        );
-    };
-
-    const prevMilestone = () => {
-        setCurrentMilestoneIndex((prev) => 
-            prev > 0 ? prev - 1 : milestones.length - 1
-        );
-    };
-
-    const handleBarClick = () => {
-        if (onStatsToggle) {
-            onStatsToggle();
-        }
-    };
-
-    return (
-        <div 
-            className={cn(
-                "absolute bottom-0 left-0 right-0",
-                "bg-black/90 backdrop-blur-sm",
-                "border-t border-red-500/30",
-                "transition-all duration-300 transform",
-                isVisible ? "translate-y-0 opacity-100" : "translate-y-full opacity-0",
-                className
-            )}
-            onMouseEnter={() => onHover?.(true)}
-            onMouseLeave={() => onHover?.(false)}
-        >
-            <div className="relative">
-                {/* Progress Bar */}
-                <div 
-                    className="h-2 bg-gray-800 cursor-pointer relative overflow-hidden"
-                    onClick={handleBarClick}
-                >
-                    {/* Background pulse for completed milestones */}
-                    {isCompleted && (
-                        <div className="absolute inset-0 bg-gradient-to-r from-transparent via-white/10 to-transparent animate-pulse" />
-                    )}
-                    
-                    {/* Progress fill */}
-                    <div 
-                        className={cn(
-                            "h-full transition-all duration-1000 ease-out",
-                            currentMilestone.color,
-                            "shadow-lg",
-                            isCompleted ? "animate-pulse" : ""
-                        )}
-                        style={{ width: `${progress}%` }}
-                    />
-                    
-                    {/* Glow effect */}
-                    <div 
-                        className={cn(
-                            "absolute top-0 h-full transition-all duration-1000 ease-out",
-                            "bg-gradient-to-r from-transparent to-white/30",
-                            "blur-sm"
-                        )}
-                        style={{ width: `${Math.min(progress + 10, 100)}%` }}
-                    />
-                </div>
-
-                {/* Milestone Info */}
-                <div className="flex items-center justify-between px-4 py-2">
-                    {/* Left: Previous milestone button */}
-                    <button
-                        onClick={prevMilestone}
-                        className="text-red-400 hover:text-red-300 transition-colors p-1"
-                        aria-label="Previous milestone"
-                    >
-                        <ChevronLeft className="w-4 h-4" />
-                    </button>
-
-                    {/* Center: Milestone info */}
-                    <div className="flex items-center space-x-4 text-center">
-                        <div className="text-red-400 text-sm font-mono">
-                            {currentShares.toFixed(2)} / {currentMilestone.target}
-                        </div>
-                        
-                        <div className="text-red-500 font-bold text-sm">
-                            {currentMilestone.label}
-                        </div>
-                        
-                        <div className="text-red-400 text-sm">
-                            {isCompleted ? 'COMPLETED' : `${(100 - progress).toFixed(1)}% TO GO`}
-                        </div>
-                    </div>
-
-                    {/* Right: Add Purchase, Next milestone button and stats toggle */}
-                    <div className="flex items-center space-x-2">
-                        {/* Add Purchase Button */}
-                        {onAddPurchase && (
-                            <button
-                                onClick={onAddPurchase}
-                                className="flex items-center space-x-1 px-2 py-1 rounded bg-red-600/20 border border-red-500/50 text-red-400 hover:bg-red-600/40 hover:text-red-300 transition-colors text-xs"
-                                aria-label="Add purchase"
-                            >
-                                <Plus className="w-3 h-3" />
-                                <span className="font-mono">ADD</span>
-                            </button>
-                        )}
-                        
-                        <button
-                            onClick={nextMilestone}
-                            className="text-red-400 hover:text-red-300 transition-colors p-1"
-                            aria-label="Next milestone"
-                        >
-                            <ChevronRight className="w-4 h-4" />
-                        </button>
-                        
-                        {/* Stats indicator */}
-                        <div className={cn(
-                            "text-xs text-red-400/60 cursor-pointer transition-colors",
-                            showStats && "text-red-400"
-                        )}>
-                            {showStats ? '▲' : '▼'}
-                        </div>
-                    </div>
-                </div>
-            </div>
-        </div>
-    );
-}
\ No newline at end of file
diff --git a/resources/js/components/Display/PurchaseModal.tsx b/resources/js/components/Display/PurchaseModal.tsx
deleted file mode 100644
index 683a91c..0000000
--- a/resources/js/components/Display/PurchaseModal.tsx
+++ /dev/null
@@ -1,33 +0,0 @@
-import AddPurchaseForm from '@/components/Transactions/AddPurchaseForm';
-import { Dialog, DialogContent, DialogHeader, DialogTitle } from '@/components/ui/dialog';
-
-interface PurchaseModalProps {
-    isOpen: boolean;
-    onClose: () => void;
-    onSuccess?: () => void;
-}
-
-export default function PurchaseModal({ isOpen, onClose, onSuccess }: PurchaseModalProps) {
-    const handleSuccess = () => {
-        if (onSuccess) {
-            onSuccess();
-        }
-        onClose();
-    };
-
-    return (
-        <Dialog open={isOpen} onOpenChange={onClose}>
-            <DialogContent className="bg-black border-red-500/30 text-red-400 max-w-md">
-                <DialogHeader>
-                    <DialogTitle className="text-red-500 font-mono tracking-wide">
-                        ADD PURCHASE
-                    </DialogTitle>
-                </DialogHeader>
-                
-                <div className="mt-4">
-                    <AddPurchaseForm onSuccess={handleSuccess} />
-                </div>
-            </DialogContent>
-        </Dialog>
-    );
-}
\ No newline at end of file
diff --git a/resources/js/components/Display/StatsPanel.tsx b/resources/js/components/Display/StatsPanel.tsx
deleted file mode 100644
index 00ae6f2..0000000
--- a/resources/js/components/Display/StatsPanel.tsx
+++ /dev/null
@@ -1,193 +0,0 @@
-import { cn } from '@/lib/utils';
-import { useState } from 'react';
-
-interface StatsData {
-    totalShares: number;
-    totalInvestment: number;
-    averageCostPerShare: number;
-    currentPrice?: number;
-    currentValue?: number;
-    profitLoss?: number;
-    profitLossPercentage?: number;
-}
-
-interface StatsPanelProps {
-    stats: StatsData;
-    isVisible: boolean;
-    className?: string;
-}
-
-export default function StatsPanel({ stats, isVisible, className }: StatsPanelProps) {
-    const [withdrawalRate, setWithdrawalRate] = useState(0.03); // 3% default
-
-    const calculateWithdrawal = (rate: number) => {
-        if (!stats.currentValue) return 0;
-        return stats.currentValue * rate;
-    };
-
-    const formatCurrency = (amount: number) => {
-        return new Intl.NumberFormat('de-DE', {
-            style: 'currency',
-            currency: 'EUR',
-            minimumFractionDigits: 2,
-        }).format(amount);
-    };
-
-    const formatPercentage = (percentage: number) => {
-        return `${percentage >= 0 ? '+' : ''}${percentage.toFixed(2)}%`;
-    };
-
-    return (
-        <div className={cn(
-            "fixed bottom-12 left-0 right-0",
-            "bg-black/95 backdrop-blur-sm",
-            "border-t border-red-500/30",
-            "transition-all duration-300 ease-in-out",
-            "transform",
-            isVisible ? "translate-y-0 opacity-100" : "translate-y-full opacity-0",
-            className
-        )}>
-            <div className="container mx-auto px-4 py-6">
-                <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-6">
-                    
-                    {/* Portfolio Overview */}
-                    <div className="space-y-3">
-                        <h3 className="text-red-400 font-bold text-sm uppercase tracking-wide">
-                            Portfolio
-                        </h3>
-                        
-                        <div className="space-y-2 font-mono text-sm">
-                            <div className="flex justify-between">
-                                <span className="text-red-300/70">Shares:</span>
-                                <span className="text-red-400">{stats.totalShares.toFixed(6)}</span>
-                            </div>
-                            
-                            <div className="flex justify-between">
-                                <span className="text-red-300/70">Invested:</span>
-                                <span className="text-red-400">{formatCurrency(stats.totalInvestment)}</span>
-                            </div>
-                            
-                            <div className="flex justify-between">
-                                <span className="text-red-300/70">Avg Cost:</span>
-                                <span className="text-red-400">{formatCurrency(stats.averageCostPerShare)}</span>
-                            </div>
-                        </div>
-                    </div>
-
-                    {/* Current Value */}
-                    {stats.currentPrice && (
-                        <div className="space-y-3">
-                            <h3 className="text-red-400 font-bold text-sm uppercase tracking-wide">
-                                Current Value
-                            </h3>
-                            
-                            <div className="space-y-2 font-mono text-sm">
-                                <div className="flex justify-between">
-                                    <span className="text-red-300/70">Price:</span>
-                                    <span className="text-red-400">{formatCurrency(stats.currentPrice)}</span>
-                                </div>
-                                
-                                <div className="flex justify-between">
-                                    <span className="text-red-300/70">Value:</span>
-                                    <span className="text-red-400">{formatCurrency(stats.currentValue || 0)}</span>
-                                </div>
-                                
-                                {stats.profitLoss !== undefined && (
-                                    <div className="flex justify-between">
-                                        <span className="text-red-300/70">P&L:</span>
-                                        <span className={cn(
-                                            "font-bold",
-                                            stats.profitLoss >= 0 ? "text-green-400" : "text-red-500"
-                                        )}>
-                                            {formatCurrency(stats.profitLoss)}
-                                        </span>
-                                    </div>
-                                )}
-                                
-                                {stats.profitLossPercentage !== undefined && (
-                                    <div className="flex justify-between">
-                                        <span className="text-red-300/70">Return:</span>
-                                        <span className={cn(
-                                            "font-bold",
-                                            stats.profitLossPercentage >= 0 ? "text-green-400" : "text-red-500"
-                                        )}>
-                                            {formatPercentage(stats.profitLossPercentage)}
-                                        </span>
-                                    </div>
-                                )}
-                            </div>
-                        </div>
-                    )}
-
-                    {/* Withdrawal Estimates */}
-                    {stats.currentValue && (
-                        <div className="space-y-3">
-                            <h3 className="text-red-400 font-bold text-sm uppercase tracking-wide">
-                                Annual Withdrawal
-                            </h3>
-                            
-                            <div className="space-y-2 font-mono text-sm">
-                                <div className="flex justify-between">
-                                    <span className="text-red-300/70">3%:</span>
-                                    <span className="text-red-400">{formatCurrency(calculateWithdrawal(0.03))}</span>
-                                </div>
-                                
-                                <div className="flex justify-between">
-                                    <span className="text-red-300/70">4%:</span>
-                                    <span className="text-red-400">{formatCurrency(calculateWithdrawal(0.04))}</span>
-                                </div>
-                                
-                                <div className="flex justify-between">
-                                    <span className="text-red-300/70">Custom:</span>
-                                    <div className="flex items-center space-x-1">
-                                        <input
-                                            type="number"
-                                            value={withdrawalRate * 100}
-                                            onChange={(e) => setWithdrawalRate(Number(e.target.value) / 100)}
-                                            className="w-12 bg-transparent text-red-400 text-right text-xs border-b border-red-500/30 focus:border-red-400 outline-none"
-                                            min="0"
-                                            max="10"
-                                            step="0.1"
-                                        />
-                                        <span className="text-red-300/70 text-xs">%</span>
-                                    </div>
-                                </div>
-                                
-                                <div className="flex justify-between">
-                                    <span className="text-red-300/70"></span>
-                                    <span className="text-red-400">{formatCurrency(calculateWithdrawal(withdrawalRate))}</span>
-                                </div>
-                            </div>
-                        </div>
-                    )}
-
-                    {/* Monthly Breakdown */}
-                    {stats.currentValue && (
-                        <div className="space-y-3">
-                            <h3 className="text-red-400 font-bold text-sm uppercase tracking-wide">
-                                Monthly Income
-                            </h3>
-                            
-                            <div className="space-y-2 font-mono text-sm">
-                                <div className="flex justify-between">
-                                    <span className="text-red-300/70">3%:</span>
-                                    <span className="text-red-400">{formatCurrency(calculateWithdrawal(0.03) / 12)}</span>
-                                </div>
-                                
-                                <div className="flex justify-between">
-                                    <span className="text-red-300/70">4%:</span>
-                                    <span className="text-red-400">{formatCurrency(calculateWithdrawal(0.04) / 12)}</span>
-                                </div>
-                                
-                                <div className="flex justify-between">
-                                    <span className="text-red-300/70">Custom:</span>
-                                    <span className="text-red-400">{formatCurrency(calculateWithdrawal(withdrawalRate) / 12)}</span>
-                                </div>
-                            </div>
-                        </div>
-                    )}
-                </div>
-            </div>
-        </div>
-    );
-}
\ No newline at end of file