soufiane
c7c2a3f56c
- Delete unused page-advanced.tsx and page-backup.tsx (dashboard duplicates) - Add useApi hook for centralized API calls with auth token - Add LoadingState, ErrorState, StatusBadge reusable components - Create shared ProfilePage component for admin/employee profiles - Refactor admin and employee profile pages to use shared component This refactoring addresses SonarQube quality gate failure for duplicated lines. 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
54 lines
1.2 KiB
TypeScript
54 lines
1.2 KiB
TypeScript
'use client';
|
|
|
|
import React from 'react';
|
|
import { AlertCircle, RefreshCw } from 'lucide-react';
|
|
|
|
interface ErrorStateProps {
|
|
message?: string;
|
|
onRetry?: () => void;
|
|
retryText?: string;
|
|
fullPage?: boolean;
|
|
}
|
|
|
|
/**
|
|
* Reusable error state component
|
|
*/
|
|
export const ErrorState: React.FC<ErrorStateProps> = ({
|
|
message = 'Une erreur est survenue',
|
|
onRetry,
|
|
retryText = 'Réessayer',
|
|
fullPage = true,
|
|
}) => {
|
|
const content = (
|
|
<div className="text-center">
|
|
<div className="bg-red-50 border border-red-200 text-red-800 px-6 py-4 rounded-lg mb-6 inline-flex items-center gap-3">
|
|
<AlertCircle className="w-5 h-5 flex-shrink-0" />
|
|
<span>{message}</span>
|
|
</div>
|
|
{onRetry && (
|
|
<div>
|
|
<button
|
|
onClick={onRetry}
|
|
className="inline-flex items-center gap-2 bg-blue-600 text-white px-6 py-2 rounded-lg hover:bg-blue-700 transition"
|
|
>
|
|
<RefreshCw className="w-4 h-4" />
|
|
{retryText}
|
|
</button>
|
|
</div>
|
|
)}
|
|
</div>
|
|
);
|
|
|
|
if (fullPage) {
|
|
return (
|
|
<div className="p-8 flex items-center justify-center min-h-[400px]">
|
|
{content}
|
|
</div>
|
|
);
|
|
}
|
|
|
|
return content;
|
|
};
|
|
|
|
export default ErrorState;
|