import { ActionButtons } from '@/src/components/common/ActionButtons';
import { MdOutlineWeb } from 'react-icons/md';
import { ActionButton } from '@/src/types/common';
import { FaExternalLinkAlt, FaEye, FaLaptopCode, FaTrashAlt, FaFolderPlus, FaRegCopy } from 'react-icons/fa';
import { FaBoxArchive, FaPencil } from 'react-icons/fa6';
import { useRouter } from 'next/navigation';
import { PortfolioActionButtonsProps } from '@/types/portfolio';
import { generateInviteLink } from '@/src/utils/invite';

export function PortfolioActionButtons({ portfolio, isDeleting, onDelete }: PortfolioActionButtonsProps) {
  const router = useRouter();

  const actions: ActionButton[] = [
    {
      icon: <FaExternalLinkAlt />,
      text: 'View Live',
      onClick: portfolio.is_published
        ? () => window.open(`/${portfolio.owner}/${portfolio.title}`, '_blank')
        : undefined,
      disabled: !portfolio.is_published,
      tooltip: !portfolio.is_published ? 'Portfolio is not published yet' : undefined,
    },
    {
      icon: <FaEye />,
      text: 'Preview',
      onClick: () =>
        window.open(`/portfolios/${portfolio.id}/preview`, '_blank'),
    },
    portfolio.role === 'Owner' && {
      icon: <FaLaptopCode />,
      text: 'Portfolio projects',
      onClick: () => router.push(`/portfolios/${portfolio.id}/projects`),
      notificationCount: portfolio.pendingProjects,
    },
    portfolio.role === 'Owner' && {
      icon: <MdOutlineWeb />,
      text: 'Open Editor',
      onClick: () => router.push(`/portfolios/${portfolio.id}`),
    },
    portfolio.role === 'Owner' && {
      icon: <FaPencil />,
      text: 'Edit Info & Contributors',
      onClick: () => router.push(`/portfolios/${portfolio.id}/settings`),
    },
    portfolio.role === 'Owner' && {
      icon: <FaTrashAlt />,
      text: 'Delete',
      onClick: () => onDelete(portfolio.id),
      isLoading: isDeleting,
    },
    portfolio.role === 'Contributor' && {
      icon: <FaBoxArchive />,
      text: 'My Contributions',
      onClick: () => router.push(`/portfolios/${portfolio.id}/contributions`),
    },
    portfolio.role === 'Contributor' && {
      icon: <FaFolderPlus />,
      text: 'Add Project',
      onClick: () => router.push(`/portfolios/${portfolio.id}/projects/add`),
    },
    portfolio.role === 'Owner' && {
      icon: <FaRegCopy />,
      text: 'Copy Invitation Link',
      onClick: () => {
        const link = generateInviteLink(portfolio.id);
        navigator.clipboard.writeText(link);
        alert('Invitation link copied to clipboard');
      },
    }
  ].filter(Boolean) as ActionButton[];

  return <ActionButtons actions={actions} />;
}
