2023-10-20 11:37:46 +00:00
|
|
|
import { FC } from "react";
|
|
|
|
// components
|
|
|
|
import { IssueBlock } from "components/issues";
|
|
|
|
// types
|
2023-11-06 15:13:10 +00:00
|
|
|
import { IIssue, IIssueDisplayProperties } from "types";
|
2023-10-20 11:37:46 +00:00
|
|
|
|
|
|
|
interface Props {
|
|
|
|
columnId: string;
|
|
|
|
issues: IIssue[];
|
2023-11-03 14:50:05 +00:00
|
|
|
isReadonly?: boolean;
|
2023-10-20 11:37:46 +00:00
|
|
|
handleIssues: (group_by: string | null, issue: IIssue, action: "update" | "delete") => void;
|
|
|
|
quickActions: (group_by: string | null, issue: IIssue) => React.ReactNode;
|
2023-11-06 15:13:10 +00:00
|
|
|
displayProperties: IIssueDisplayProperties;
|
2023-11-02 13:14:02 +00:00
|
|
|
showEmptyGroup?: boolean;
|
2023-10-20 11:37:46 +00:00
|
|
|
}
|
|
|
|
|
|
|
|
export const IssueBlocksList: FC<Props> = (props) => {
|
2023-11-06 15:13:10 +00:00
|
|
|
const { columnId, issues, handleIssues, quickActions, displayProperties, showEmptyGroup, isReadonly } = props;
|
2023-10-20 11:37:46 +00:00
|
|
|
|
|
|
|
return (
|
2023-10-31 06:44:06 +00:00
|
|
|
<div className="w-full h-full relative divide-y-[0.5px] divide-custom-border-200">
|
|
|
|
{issues && issues.length > 0 ? (
|
2023-10-20 11:37:46 +00:00
|
|
|
issues.map((issue) => (
|
|
|
|
<IssueBlock
|
|
|
|
key={issue.id}
|
|
|
|
columnId={columnId}
|
|
|
|
issue={issue}
|
|
|
|
handleIssues={handleIssues}
|
|
|
|
quickActions={quickActions}
|
2023-11-03 14:50:05 +00:00
|
|
|
isReadonly={isReadonly}
|
2023-11-06 15:13:10 +00:00
|
|
|
displayProperties={displayProperties}
|
2023-11-02 13:14:02 +00:00
|
|
|
showEmptyGroup={showEmptyGroup}
|
2023-10-20 11:37:46 +00:00
|
|
|
/>
|
2023-10-31 06:44:06 +00:00
|
|
|
))
|
|
|
|
) : (
|
|
|
|
<div className="bg-custom-background-100 text-custom-text-400 text-sm p-3">No issues</div>
|
|
|
|
)}
|
|
|
|
</div>
|
2023-10-20 11:37:46 +00:00
|
|
|
);
|
|
|
|
};
|