Implemented Phases 2-4 of the implementation plan: **Phase 2: Font Management System** - Created font loading service with caching - Added API route to list all 373 figlet fonts - Implemented font metadata types **Phase 3: Core Figlet Engine** - Built figlet.js wrapper service for ASCII art generation - Added async/sync rendering methods - Implemented debounced text updates (300ms) - Created utility functions (cn, debounce) **Phase 4: Main UI Components** - Built reusable UI primitives (Button, Input, Card) - Created TextInput component with character counter (100 char limit) - Implemented FontPreview with loading states - Added FontSelector with real-time search - Built main FigletConverter orchestrating all components **Features Implemented:** - Live preview with 300ms debounce - 373 fonts from xero/figlet-fonts collection - Fuzzy font search - Copy to clipboard - Download as .txt file - Responsive 3-column layout (mobile-friendly) - Character counter - Loading states - Empty states **Tech Stack:** - Next.js 16 App Router with Turbopack - React 19 with client components - TypeScript with strict types - Tailwind CSS 4 for styling - figlet.js for rendering - Font caching for performance The application is fully functional and ready for testing! 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
30 lines
812 B
TypeScript
30 lines
812 B
TypeScript
import { NextResponse } from 'next/server';
|
|
import fs from 'fs';
|
|
import path from 'path';
|
|
|
|
export const dynamic = 'force-static';
|
|
|
|
export async function GET() {
|
|
try {
|
|
const fontsDir = path.join(process.cwd(), 'public/fonts/figlet-fonts');
|
|
const files = fs.readdirSync(fontsDir);
|
|
|
|
const fonts = files
|
|
.filter(file => file.endsWith('.flf'))
|
|
.map(file => {
|
|
const name = file.replace('.flf', '');
|
|
return {
|
|
name,
|
|
fileName: file,
|
|
path: `/fonts/figlet-fonts/${file}`,
|
|
};
|
|
})
|
|
.sort((a, b) => a.name.localeCompare(b.name));
|
|
|
|
return NextResponse.json(fonts);
|
|
} catch (error) {
|
|
console.error('Error reading fonts directory:', error);
|
|
return NextResponse.json({ error: 'Failed to load fonts' }, { status: 500 });
|
|
}
|
|
}
|