plane/web/components/issues/issue-layouts/list/block.tsx
2023-10-04 15:29:56 +05:30

42 lines
1.4 KiB
TypeScript

// components
import { KanBanProperties } from "./properties";
interface IssueBlockProps {
columnId: string;
issues: any;
handleIssues?: (group_by: string | null, issue: any) => void;
display_properties: any;
}
export const IssueBlock = ({ columnId, issues, handleIssues, display_properties }: IssueBlockProps) => (
<>
{issues && issues.length > 0 ? (
<>
{issues.map((issue: any, index: any) => (
<div
key={index}
className={`text-sm p-3 shadow-custom-shadow-2xs transition-all bg-custom-background-100 flex items-center flex-wrap gap-3 border-b border-custom-border-200`}
>
{display_properties && display_properties?.key && (
<div className="flex-shrink-0 text-xs text-custom-text-300">ONE-{issue.sequence_id}</div>
)}
<div className="line-clamp-1 text-sm font-medium text-custom-text-100">{issue.name}</div>
<div className="ml-auto flex-shrink-0">
<KanBanProperties
columnId={columnId}
issue={issue}
handleIssues={handleIssues}
display_properties={display_properties}
/>
</div>
</div>
))}
</>
) : (
<div className="absolute top-0 left-0 w-full h-full flex items-center justify-center">
No issues are available
</div>
)}
</>
);