base
This commit is contained in:
@@ -0,0 +1,64 @@
|
||||
/**
|
||||
* Copyright (c) 2023-present Plane Software, Inc. and contributors
|
||||
* SPDX-License-Identifier: AGPL-3.0-only
|
||||
* See the LICENSE file for details.
|
||||
*/
|
||||
|
||||
// components
|
||||
import type { IBlockUpdateData, IGanttBlock } from "@plane/types";
|
||||
import RenderIfVisible from "@/components/core/render-if-visible-HOC";
|
||||
// hooks
|
||||
import { BlockRow } from "@/components/gantt-chart/blocks/block-row";
|
||||
import { BLOCK_HEIGHT } from "@/components/gantt-chart/constants";
|
||||
import type { TSelectionHelper } from "@/hooks/use-multiple-select";
|
||||
// types
|
||||
|
||||
export type GanttChartBlocksProps = {
|
||||
blockIds: string[];
|
||||
blockUpdateHandler: (block: any, payload: IBlockUpdateData) => void;
|
||||
handleScrollToBlock: (block: IGanttBlock) => void;
|
||||
enableAddBlock: boolean | ((blockId: string) => boolean);
|
||||
showAllBlocks: boolean;
|
||||
selectionHelpers: TSelectionHelper;
|
||||
ganttContainerRef: React.RefObject<HTMLDivElement>;
|
||||
};
|
||||
|
||||
export function GanttChartRowList(props: GanttChartBlocksProps) {
|
||||
const {
|
||||
blockIds,
|
||||
blockUpdateHandler,
|
||||
handleScrollToBlock,
|
||||
enableAddBlock,
|
||||
showAllBlocks,
|
||||
selectionHelpers,
|
||||
ganttContainerRef,
|
||||
} = props;
|
||||
|
||||
return (
|
||||
<div className="absolute top-0 left-0 w-max min-w-full">
|
||||
{blockIds?.map((blockId) => (
|
||||
<>
|
||||
<RenderIfVisible
|
||||
root={ganttContainerRef}
|
||||
horizontalOffset={100}
|
||||
verticalOffset={200}
|
||||
classNames="relative min-w-full w-max"
|
||||
placeholderChildren={<div className="pointer-events-none w-full" style={{ height: `${BLOCK_HEIGHT}px` }} />}
|
||||
shouldRecordHeights={false}
|
||||
>
|
||||
<BlockRow
|
||||
key={blockId}
|
||||
blockId={blockId}
|
||||
showAllBlocks={showAllBlocks}
|
||||
blockUpdateHandler={blockUpdateHandler}
|
||||
handleScrollToBlock={handleScrollToBlock}
|
||||
enableAddBlock={typeof enableAddBlock === "function" ? enableAddBlock(blockId) : enableAddBlock}
|
||||
selectionHelpers={selectionHelpers}
|
||||
ganttContainerRef={ganttContainerRef}
|
||||
/>
|
||||
</RenderIfVisible>
|
||||
</>
|
||||
))}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
@@ -0,0 +1,58 @@
|
||||
/**
|
||||
* Copyright (c) 2023-present Plane Software, Inc. and contributors
|
||||
* SPDX-License-Identifier: AGPL-3.0-only
|
||||
* See the LICENSE file for details.
|
||||
*/
|
||||
|
||||
//
|
||||
import type { IBlockUpdateDependencyData } from "@plane/types";
|
||||
import { GanttChartBlock } from "@/components/gantt-chart/blocks/block";
|
||||
|
||||
export type GanttChartBlocksProps = {
|
||||
blockIds: string[];
|
||||
blockToRender: (data: any) => React.ReactNode;
|
||||
enableBlockLeftResize: boolean | ((blockId: string) => boolean);
|
||||
enableBlockRightResize: boolean | ((blockId: string) => boolean);
|
||||
enableBlockMove: boolean | ((blockId: string) => boolean);
|
||||
ganttContainerRef: React.RefObject<HTMLDivElement>;
|
||||
showAllBlocks: boolean;
|
||||
updateBlockDates?: (updates: IBlockUpdateDependencyData[]) => Promise<void>;
|
||||
enableDependency: boolean | ((blockId: string) => boolean);
|
||||
};
|
||||
|
||||
export function GanttChartBlocksList(props: GanttChartBlocksProps) {
|
||||
const {
|
||||
blockIds,
|
||||
blockToRender,
|
||||
enableBlockLeftResize,
|
||||
enableBlockRightResize,
|
||||
enableBlockMove,
|
||||
ganttContainerRef,
|
||||
showAllBlocks,
|
||||
updateBlockDates,
|
||||
enableDependency,
|
||||
} = props;
|
||||
|
||||
return (
|
||||
<>
|
||||
{blockIds?.map((blockId) => (
|
||||
<GanttChartBlock
|
||||
key={blockId}
|
||||
blockId={blockId}
|
||||
showAllBlocks={showAllBlocks}
|
||||
blockToRender={blockToRender}
|
||||
enableBlockLeftResize={
|
||||
typeof enableBlockLeftResize === "function" ? enableBlockLeftResize(blockId) : enableBlockLeftResize
|
||||
}
|
||||
enableBlockRightResize={
|
||||
typeof enableBlockRightResize === "function" ? enableBlockRightResize(blockId) : enableBlockRightResize
|
||||
}
|
||||
enableBlockMove={typeof enableBlockMove === "function" ? enableBlockMove(blockId) : enableBlockMove}
|
||||
enableDependency={typeof enableDependency === "function" ? enableDependency(blockId) : enableDependency}
|
||||
ganttContainerRef={ganttContainerRef}
|
||||
updateBlockDates={updateBlockDates}
|
||||
/>
|
||||
))}
|
||||
</>
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user