"use client";

import React from "react";

interface ErrorCardProps {
  message: string;
  onRetry?: () => void;
  retryLabel?: string;
}

// Shared error state for the authorized pages — a centered card with a message
// and an optional "Try again" button. Used by My Account, My Content and the
// public user profile so the failure state looks identical everywhere.
const ErrorCard: React.FC<ErrorCardProps> = ({
  message,
  onRetry,
  retryLabel = "Try again",
}) => (
  <div className="bg-white rounded-2xl border border-[#E2E2E2] px-6 py-14 flex flex-col items-center gap-4 text-center">
    <p className="text-coolgray-500 text-[15px]">{message}</p>
    {onRetry && (
      <button
        type="button"
        onClick={onRetry}
        className="px-5 py-2.5 rounded-full bg-blue-light text-white font-semibold text-[14px] hover:bg-blue-light-hover transition-all"
      >
        {retryLabel}
      </button>
    )}
  </div>
);

export default ErrorCard;