forked from github/plane
75 lines
2.3 KiB
TypeScript
75 lines
2.3 KiB
TypeScript
import { MutableRefObject, memo } from "react";
|
|
//types
|
|
import { TIssue, IIssueDisplayProperties, IIssueMap } from "@plane/types";
|
|
import { KanbanIssueBlock } from "@/components/issues";
|
|
// components
|
|
|
|
interface IssueBlocksListProps {
|
|
sub_group_id: string;
|
|
columnId: string;
|
|
issuesMap: IIssueMap;
|
|
peekIssueId?: string;
|
|
issueIds: string[];
|
|
displayProperties: IIssueDisplayProperties | undefined;
|
|
isDragDisabled: boolean;
|
|
updateIssue: ((projectId: string, issueId: string, data: Partial<TIssue>) => Promise<void>) | undefined;
|
|
quickActions: (issue: TIssue, customActionButton?: React.ReactElement) => React.ReactNode;
|
|
canEditProperties: (projectId: string | undefined) => boolean;
|
|
scrollableContainerRef?: MutableRefObject<HTMLDivElement | null>;
|
|
isDragStarted?: boolean;
|
|
}
|
|
|
|
const KanbanIssueBlocksListMemo: React.FC<IssueBlocksListProps> = (props) => {
|
|
const {
|
|
sub_group_id,
|
|
columnId,
|
|
issuesMap,
|
|
peekIssueId,
|
|
issueIds,
|
|
displayProperties,
|
|
isDragDisabled,
|
|
updateIssue,
|
|
quickActions,
|
|
canEditProperties,
|
|
scrollableContainerRef,
|
|
isDragStarted,
|
|
} = props;
|
|
|
|
return (
|
|
<>
|
|
{issueIds && issueIds.length > 0 ? (
|
|
<>
|
|
{issueIds.map((issueId, index) => {
|
|
if (!issueId) return null;
|
|
|
|
let draggableId = issueId;
|
|
if (columnId) draggableId = `${draggableId}__${columnId}`;
|
|
if (sub_group_id) draggableId = `${draggableId}__${sub_group_id}`;
|
|
|
|
return (
|
|
<KanbanIssueBlock
|
|
key={draggableId}
|
|
peekIssueId={peekIssueId}
|
|
issueId={issueId}
|
|
issuesMap={issuesMap}
|
|
displayProperties={displayProperties}
|
|
updateIssue={updateIssue}
|
|
quickActions={quickActions}
|
|
draggableId={draggableId}
|
|
index={index}
|
|
isDragDisabled={isDragDisabled}
|
|
canEditProperties={canEditProperties}
|
|
scrollableContainerRef={scrollableContainerRef}
|
|
isDragStarted={isDragStarted}
|
|
issueIds={issueIds} //passing to force render for virtualization whenever parent rerenders
|
|
/>
|
|
);
|
|
})}
|
|
</>
|
|
) : null}
|
|
</>
|
|
);
|
|
};
|
|
|
|
export const KanbanIssueBlocksList = memo(KanbanIssueBlocksListMemo);
|