🎨 Modern React Frontend: - Complete Chakra UI integration with custom theme and dark/light mode - Responsive design with mobile-first navigation and layout - Beautiful component library with cards, forms, and data visualization - Professional typography and color system with brand consistency 🚀 Advanced URL Tracking Interface: - Comprehensive tracking form with real-time validation using React Hook Form + Zod - Advanced options panel with configurable parameters (max hops, timeout, headers) - SSL, SEO, and security analysis toggles with user-friendly controls - Smart URL normalization and method selection interface 📊 Rich Results Visualization: - Interactive tracking results with hop-by-hop analysis tables - Performance metrics with latency visualization and progress bars - Status badges with color-coded redirect types and HTTP status codes - Comprehensive error handling and user feedback system 🧭 Navigation & Layout: - Responsive navigation bar with user authentication state - Mobile-friendly drawer navigation with touch-optimized interactions - Professional footer with feature highlights and API documentation links - Breadcrumb navigation and page structure for optimal UX 🔐 Authentication Integration: - Complete authentication context with JWT token management - User registration and login flow preparation (backend ready) - Protected routes and role-based access control framework - Session management with automatic token refresh and error handling 🌟 User Experience Features: - Toast notifications for all user actions and API responses - Loading states and skeleton screens for smooth interactions - Copy-to-clipboard functionality for tracking IDs and results - Tooltips and help text for advanced features and configuration 📱 Responsive Design: - Mobile-first design approach with breakpoint-aware components - Touch-friendly interfaces with appropriate sizing and spacing - Optimized layouts for desktop, tablet, and mobile viewports - Accessible design with proper ARIA labels and keyboard navigation 🔧 Developer Experience: - TypeScript throughout with comprehensive type safety - React Query for efficient API state management and caching - Custom hooks for authentication and API interactions - Modular component architecture with clear separation of concerns 🎯 API Integration: - Complete integration with all v2 API endpoints - Real-time health monitoring and status display - Backward compatibility with legacy API endpoints - Comprehensive error handling with user-friendly messages Ready for enhanced dashboard and analysis features in future phases!
62 lines
1.6 KiB
JSON
62 lines
1.6 KiB
JSON
{
|
|
"name": "@redirect-intelligence/web",
|
|
"version": "2.0.0",
|
|
"private": true,
|
|
"dependencies": {
|
|
"react": "^18.2.0",
|
|
"react-dom": "^18.2.0",
|
|
"@chakra-ui/react": "^2.8.2",
|
|
"@chakra-ui/icons": "^2.1.1",
|
|
"@emotion/react": "^11.11.1",
|
|
"@emotion/styled": "^11.11.0",
|
|
"framer-motion": "^10.16.16",
|
|
"@tanstack/react-query": "^5.17.9",
|
|
"@tanstack/react-query-devtools": "^5.17.9",
|
|
"react-router-dom": "^6.20.1",
|
|
"mermaid": "^10.6.1",
|
|
"axios": "^1.6.7",
|
|
"react-hook-form": "^7.48.2",
|
|
"@hookform/resolvers": "^3.3.2",
|
|
"zod": "^3.22.4",
|
|
"react-dropzone": "^14.2.3",
|
|
"date-fns": "^3.0.6",
|
|
"recharts": "^2.8.0",
|
|
"react-icons": "^4.12.0"
|
|
},
|
|
"devDependencies": {
|
|
"@types/react": "^18.2.43",
|
|
"@types/react-dom": "^18.2.17",
|
|
"@types/node": "^20.10.0",
|
|
"@vitejs/plugin-react": "^4.2.1",
|
|
"typescript": "^5.3.0",
|
|
"vite": "^5.0.8",
|
|
"eslint": "^8.55.0",
|
|
"@typescript-eslint/eslint-plugin": "^6.14.0",
|
|
"@typescript-eslint/parser": "^6.14.0",
|
|
"eslint-plugin-react": "^7.33.2",
|
|
"eslint-plugin-react-hooks": "^4.6.0"
|
|
},
|
|
"scripts": {
|
|
"dev": "vite",
|
|
"build": "tsc && vite build",
|
|
"preview": "vite preview",
|
|
"lint": "eslint src --ext ts,tsx --report-unused-disable-directives --max-warnings 0",
|
|
"lint:fix": "eslint src --ext ts,tsx --fix",
|
|
"test": "vitest",
|
|
"test:ui": "vitest --ui",
|
|
"clean": "rm -rf dist"
|
|
},
|
|
"browserslist": {
|
|
"production": [
|
|
">0.2%",
|
|
"not dead",
|
|
"not op_mini all"
|
|
],
|
|
"development": [
|
|
"last 1 chrome version",
|
|
"last 1 firefox version",
|
|
"last 1 safari version"
|
|
]
|
|
}
|
|
}
|