import { createEffect, createSignal, onMount, Show } from 'solid-js'; import { IconTrash, IconRestore, IconFileText, IconFileTypePpt, IconFileTypeDocx, IconClock, IconSettings, IconAlertTriangle } from '@tabler/icons-solidjs'; import { getApiV1BaseUrl } from '@/lib/api-url'; interface RemovedItem { id: string; name: string; type: string; removedAt: string; removedBy: string; size?: string; path?: string; daysInTrash?: number; } interface AutoRemoveSettings { enabled: boolean; afterDays: number; autoEmpty: boolean; } const API_BASE_URL = getApiV1BaseUrl(); export const RemovedStuff = () => { const [removedItems, setRemovedItems] = createSignal([]); const [autoRemoveSettings, setAutoRemoveSettings] = createSignal({ enabled: false, afterDays: 30, autoEmpty: false }); const [showSettings, setShowSettings] = createSignal(false); const [selectedItems, setSelectedItems] = createSignal([]); const [loadedRemovedItems, setLoadedRemovedItems] = createSignal(false); createEffect(() => { if (!loadedRemovedItems()) return; localStorage.setItem('removedItems', JSON.stringify(removedItems())); }); onMount(() => { // Load auto-remove settings from localStorage const savedSettings = localStorage.getItem('autoRemoveSettings'); if (savedSettings) { setAutoRemoveSettings(JSON.parse(savedSettings)); } // Try to load from API first, then fallback to localStorage const loadRemovedItems = async () => { try { const token = localStorage.getItem('trackeep_token') || localStorage.getItem('token'); const response = await fetch(`${API_BASE_URL}/trash`, { headers: { ...(token ? { 'Authorization': `Bearer ${token}` } : {}) } }); if (response.ok) { const data = await response.json(); if (Array.isArray(data)) { setRemovedItems(data); localStorage.setItem('removedItems', JSON.stringify(data)); return; } } } catch (error) { console.warn('Failed to load removed items from API:', error); } finally { setLoadedRemovedItems(true); } // Fallback to localStorage const savedItems = localStorage.getItem('removedItems'); if (savedItems) { try { const parsedItems = JSON.parse(savedItems); setRemovedItems(Array.isArray(parsedItems) ? parsedItems : []); } catch { setRemovedItems([]); } } else { // Set demo data if no saved data setRemovedItems([ { id: '1', name: 'Old Project Documentation.pdf', type: 'pdf', removedAt: new Date(Date.now() - 5 * 24 * 60 * 60 * 1000).toLocaleDateString(), removedBy: 'Demo User', size: '2.4 MB', path: '/documents/projects/', daysInTrash: 5 }, { id: '2', name: 'Backup Database.sql', type: 'sql', removedAt: new Date(Date.now() - 12 * 24 * 60 * 60 * 1000).toLocaleDateString(), removedBy: 'Demo User', size: '15.7 MB', path: '/backups/', daysInTrash: 12 }, { id: '3', name: 'Draft Presentation.pptx', type: 'pptx', removedAt: new Date(Date.now() - 3 * 24 * 60 * 60 * 1000).toLocaleDateString(), removedBy: 'Demo User', size: '8.2 MB', path: '/presentations/', daysInTrash: 3 } ]); } }; loadRemovedItems(); // Check for auto-remove on mount checkAutoRemove(); }); const checkAutoRemove = () => { const settings = autoRemoveSettings(); if (!settings.enabled) return; const itemsToRemove = removedItems().filter(item => (item.daysInTrash || 0) >= settings.afterDays ); if (itemsToRemove.length > 0) { if (settings.autoEmpty) { // Auto-empty trash setRemovedItems([]); console.log(`Auto-removed ${itemsToRemove.length} items from trash`); } else { // Show notification for manual review console.log(`${itemsToRemove.length} items are ready for auto-remove`); } } }; const saveAutoRemoveSettings = (settings: AutoRemoveSettings) => { setAutoRemoveSettings(settings); localStorage.setItem('autoRemoveSettings', JSON.stringify(settings)); checkAutoRemove(); }; const getFileIcon = (type: string) => { switch (type) { case 'docx': return IconFileTypeDocx; case 'pptx': return IconFileTypePpt; case 'zip': return IconFileText; case 'folder': return IconFileText; default: return IconFileText; } }; const handleEmptyTrash = () => { if (confirm('Are you sure you want to permanently delete all items in the trash? This action cannot be undone.')) { setRemovedItems([]); alert('Trash emptied successfully!'); } }; const handleRestoreItem = (id: string) => { const item = removedItems().find(item => item.id === id); if (item) { setRemovedItems(prev => prev.filter(item => item.id !== id)); alert(`"${item.name}" has been restored successfully!`); } }; const handlePermanentlyDelete = (id: string) => { const item = removedItems().find(item => item.id === id); if (item && confirm(`Are you sure you want to permanently delete "${item.name}"? This action cannot be undone.`)) { setRemovedItems(prev => prev.filter(item => item.id !== id)); alert(`"${item.name}" has been permanently deleted!`); } }; const handleBulkRestore = () => { if (selectedItems().length === 0) return; if (confirm(`Are you sure you want to restore ${selectedItems().length} items?`)) { const itemsToRestore = removedItems().filter(item => selectedItems().includes(item.id)); setRemovedItems(prev => prev.filter(item => !selectedItems().includes(item.id))); setSelectedItems([]); alert(`${itemsToRestore.length} items have been restored successfully!`); } }; const handleBulkDelete = () => { if (selectedItems().length === 0) return; if (confirm(`Are you sure you want to permanently delete ${selectedItems().length} items? This action cannot be undone.`)) { const itemsToDelete = removedItems().filter(item => selectedItems().includes(item.id)); setRemovedItems(prev => prev.filter(item => !selectedItems().includes(item.id))); setSelectedItems([]); alert(`${itemsToDelete.length} items have been permanently deleted!`); } }; const getItemsReadyForAutoRemove = () => { const settings = autoRemoveSettings(); if (!settings.enabled) return []; return removedItems().filter(item => (item.daysInTrash || 0) >= settings.afterDays ); }; return (

Removed Stuff

{removedItems().length} items in trash {autoRemoveSettings().enabled && ` • Auto-remove enabled (${autoRemoveSettings().afterDays} days)`}

{/* Auto-Remove Settings */}

Auto-Remove Settings

saveAutoRemoveSettings({ ...autoRemoveSettings(), enabled: e.currentTarget.checked })} class="rounded border-input" />
saveAutoRemoveSettings({ ...autoRemoveSettings(), afterDays: parseInt(e.currentTarget.value) || 30 })} class="flex h-10 w-full rounded-md border border-input bg-background px-3 py-2 text-sm text-foreground focus-visible:outline-none focus-visible:ring-1.5 focus-visible:ring-ring" />
saveAutoRemoveSettings({ ...autoRemoveSettings(), autoEmpty: e.currentTarget.checked })} class="rounded border-input" />
{/* Items ready for auto-remove */} 0}>
{getItemsReadyForAutoRemove().length} items are ready for automatic removal
{/* Bulk Actions */} 0}>
{selectedItems().length} items selected
{/* Enhanced Table */}
{removedItems().map((item) => { const FileIcon = getFileIcon(item.type); return ( ); })}
0} onChange={() => { if (selectedItems().length === removedItems().length) { setSelectedItems([]); } else { setSelectedItems(removedItems().map(item => item.id)); } }} class="rounded border-input" /> Item Type Size Removed By Removed At Actions
{ if (selectedItems().includes(item.id)) { setSelectedItems(prev => prev.filter(id => id !== item.id)); } else { setSelectedItems(prev => [...prev, item.id]); } }} class="rounded border-input" />
{item.name}
{item.path}
{item.type} {item.size} {item.removedBy} {item.removedAt}
); };