fix: 🐛 [Timeline] Print unit above of length = rowHeight

melfore · Oct 26, 2023 · ea9a047 · ea9a047
1 parent 3f5415d
commit ea9a047
Show file tree

Hide file tree

Showing 2 changed files with 7 additions and 8 deletions.
diff --git a/src/grid/CellGroup/index.tsx b/src/grid/CellGroup/index.tsx
@@ -7,11 +7,10 @@ import { displayAboveInterval } from "../../utils/time-resolution";
 
 interface GridCellGroupProps {
   column: Interval;
-  height: number;
   index: number;
 }
 
-const GridCellGroup = ({ column, height, index }: GridCellGroupProps) => {
+const GridCellGroup = ({ column, index }: GridCellGroupProps) => {
   const {
     columnWidth,
     resolution: { sizeInUnits, unit, unitAbove },
@@ -21,7 +20,7 @@ const GridCellGroup = ({ column, height, index }: GridCellGroupProps) => {
 
   const cellLabel = useMemo(() => displayAboveInterval(column, unitAbove), [column, unitAbove]);
 
-  const points = useMemo(() => [0, 0, 0, height], [height]);
+  const points = useMemo(() => [0, 0, 0, rowHeight], [rowHeight]);
 
   const unitAboveInUnitBelow = useMemo(
     () => Duration.fromObject({ [unitAbove]: 1 }).as(unit) / sizeInUnits,

diff --git a/src/grid/Cells/index.tsx b/src/grid/Cells/index.tsx
@@ -3,20 +3,20 @@ import React, { memo } from "react";
 import { KonvaGroup } from "../../@konva";
 import { useTimelineContext } from "../../timeline/TimelineContext";
 import GridCell from "../Cell";
-// import GridCellGroup from "../CellGroup";
+import GridCellGroup from "../CellGroup";
 
 interface GridCellsProps {
   height: number;
 }
 
 const GridCells = ({ height }: GridCellsProps) => {
-  const { /*aboveTimeBlocks,*/ visibleTimeBlocks } = useTimelineContext();
+  const { aboveTimeBlocks, visibleTimeBlocks } = useTimelineContext();
 
   return (
     <KonvaGroup>
-      {/* {aboveTimeBlocks.map((column, index) => (
-        <GridCellGroup key={`cell-group-${index}`} column={column} height={height} index={index} />
-      ))} */}
+      {aboveTimeBlocks.map((column, index) => (
+        <GridCellGroup key={`cell-group-${index}`} column={column} index={index} />
+      ))}
       {visibleTimeBlocks.map((column, index) => (
         <GridCell key={`cell-${index}`} column={column} height={height} index={index} />
       ))}