- Add text templates with 16 pre-made options across 4 categories (greeting, tech, fun, seasonal) - Add copy history panel tracking last 10 copied items with restore functionality - Add font comparison mode to view multiple fonts side-by-side (up to 6 fonts) - Add smooth animations: slide-down, slide-up, scale-in, fade-in, pulse, and shimmer - Add loading skeletons for better perceived performance - Add EmptyState component with contextual messages and icons - Add hover effects and transitions throughout the UI - Improve visual feedback with animated badges and shadows 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
54 lines
1.1 KiB
TypeScript
54 lines
1.1 KiB
TypeScript
'use client';
|
|
|
|
export interface HistoryItem {
|
|
id: string;
|
|
text: string;
|
|
font: string;
|
|
result: string;
|
|
timestamp: number;
|
|
}
|
|
|
|
const HISTORY_KEY = 'figlet-ui-history';
|
|
const MAX_HISTORY = 10;
|
|
|
|
export function getHistory(): HistoryItem[] {
|
|
if (typeof window === 'undefined') return [];
|
|
|
|
try {
|
|
const stored = localStorage.getItem(HISTORY_KEY);
|
|
return stored ? JSON.parse(stored) : [];
|
|
} catch {
|
|
return [];
|
|
}
|
|
}
|
|
|
|
export function addToHistory(text: string, font: string, result: string): void {
|
|
let history = getHistory();
|
|
|
|
const newItem: HistoryItem = {
|
|
id: `${Date.now()}-${Math.random()}`,
|
|
text,
|
|
font,
|
|
result,
|
|
timestamp: Date.now(),
|
|
};
|
|
|
|
// Add to beginning
|
|
history.unshift(newItem);
|
|
|
|
// Keep only MAX_HISTORY items
|
|
history = history.slice(0, MAX_HISTORY);
|
|
|
|
localStorage.setItem(HISTORY_KEY, JSON.stringify(history));
|
|
}
|
|
|
|
export function clearHistory(): void {
|
|
localStorage.removeItem(HISTORY_KEY);
|
|
}
|
|
|
|
export function removeHistoryItem(id: string): void {
|
|
const history = getHistory();
|
|
const filtered = history.filter(item => item.id !== id);
|
|
localStorage.setItem(HISTORY_KEY, JSON.stringify(filtered));
|
|
}
|