import React from "react"; import Link from "next/link"; import { useRouter } from "next/router"; // ui import { CustomMenu, Tooltip } from "components/ui"; // icons import { DocumentTextIcon, LockClosedIcon, LockOpenIcon, PencilIcon, StarIcon, TrashIcon, } from "@heroicons/react/24/outline"; // helpers import { truncateText } from "helpers/string.helper"; import { renderShortDate, renderShortTime } from "helpers/date-time.helper"; // types import { IPage } from "types"; type TSingleStatProps = { page: IPage; handleEditPage: () => void; handleDeletePage: () => void; handleAddToFavorites: () => void; handleRemoveFromFavorites: () => void; partialUpdatePage: (page: IPage, formData: Partial) => void; }; export const SinglePageListItem: React.FC = ({ page, handleEditPage, handleDeletePage, handleAddToFavorites, handleRemoveFromFavorites, partialUpdatePage, }) => { const router = useRouter(); const { workspaceSlug, projectId } = router.query; return (
  • {truncateText(page.name, 75)}

    {page.label_details.length > 0 && page.label_details.map((label) => (
    {label.name}
    ))}

    {renderShortTime(page.updated_at)}

    {page.is_favorite ? ( ) : ( )} { e.preventDefault(); e.stopPropagation(); handleEditPage(); }} > Edit Page { e.preventDefault(); e.stopPropagation(); handleDeletePage(); }} > Delete Page
  • ); };