From 67cedd6d2f05cca09b4405d3045eb853829296a7 Mon Sep 17 00:00:00 2001
From: Aquiles Oliveira de Souza
 <aquilesoliveira@MacBook-Air-de-Aquiles-2.local>
Date: Thu, 3 Nov 2022 17:21:28 -0300
Subject: [PATCH] Add project date change option

---
 README.md                                    | 1 +
 src/components/gantt/gantt.tsx               | 2 ++
 src/components/gantt/task-gantt-content.tsx  | 2 ++
 src/components/task-item/project/project.tsx | 4 ++--
 src/components/task-item/task-item.tsx       | 8 +++++++-
 src/types/public-types.ts                    | 4 ++++
 6 files changed, 18 insertions(+), 3 deletions(-)

diff --git a/README.md b/README.md
index bec63821..7b072f2f 100644
--- a/README.md
+++ b/README.md
@@ -79,6 +79,7 @@ npm start
 | onProgressChange\* | (task: Task, children: Task[]) => void/boolean/Promise<void>/Promise<boolean> | Specifies the function to be executed when drag taskbar progress event has finished.    |
 | onExpanderClick\*  | onExpanderClick: (task: Task) => void;                                        | Specifies the function to be executed on the table expander click                       |
 | timeStep           | number                                                                        | A time step value for onDateChange. Specify in milliseconds.                            |
+| allowProjectDateChange           | boolean                                                                        | Allows change of project date
 
 \* Chart undoes operation if method return false or error. Parameter children returns one level deep records.
 
diff --git a/src/components/gantt/gantt.tsx b/src/components/gantt/gantt.tsx
index b90483f3..0ae11061 100644
--- a/src/components/gantt/gantt.tsx
+++ b/src/components/gantt/gantt.tsx
@@ -65,6 +65,7 @@ export const Gantt: React.FunctionComponent<GanttProps> = ({
   onDelete,
   onSelect,
   onExpanderClick,
+  allowProjectDateChange,
 }) => {
   const wrapperRef = useRef<HTMLDivElement>(null);
   const taskListRef = useRef<HTMLDivElement>(null);
@@ -429,6 +430,7 @@ export const Gantt: React.FunctionComponent<GanttProps> = ({
     onDoubleClick,
     onClick,
     onDelete,
+    allowProjectDateChange
   };
 
   const tableProps: TaskListProps = {
diff --git a/src/components/gantt/task-gantt-content.tsx b/src/components/gantt/task-gantt-content.tsx
index 33326df9..94f622b0 100644
--- a/src/components/gantt/task-gantt-content.tsx
+++ b/src/components/gantt/task-gantt-content.tsx
@@ -55,6 +55,7 @@ export const TaskGanttContent: React.FC<TaskGanttContentProps> = ({
   onDoubleClick,
   onClick,
   onDelete,
+  allowProjectDateChange,
 }) => {
   const point = svg?.current?.createSVGPoint();
   const [xStep, setXStep] = useState(0);
@@ -283,6 +284,7 @@ export const TaskGanttContent: React.FC<TaskGanttContentProps> = ({
         {tasks.map(task => {
           return (
             <TaskItem
+              allowProjectDateChange={allowProjectDateChange}
               task={task}
               arrowIndent={arrowIndent}
               taskHeight={taskHeight}
diff --git a/src/components/task-item/project/project.tsx b/src/components/task-item/project/project.tsx
index 5a47ba90..19fa8969 100644
--- a/src/components/task-item/project/project.tsx
+++ b/src/components/task-item/project/project.tsx
@@ -2,7 +2,7 @@ import React from "react";
 import { TaskItemProps } from "../task-item";
 import styles from "./project.module.css";
 
-export const Project: React.FC<TaskItemProps> = ({ task, isSelected }) => {
+export const Project: React.FC<TaskItemProps> = ({ task, isSelected, onMouseDown }) => {
   const barColor = isSelected
     ? task.styles.backgroundSelectedColor
     : task.styles.backgroundColor;
@@ -29,7 +29,7 @@ export const Project: React.FC<TaskItemProps> = ({ task, isSelected }) => {
   ].join(",");
 
   return (
-    <g tabIndex={0} className={styles.projectWrapper}>
+    <g onMouseDown={onMouseDown} tabIndex={0} className={styles.projectWrapper}>
       <rect
         fill={barColor}
         x={task.x1}
diff --git a/src/components/task-item/task-item.tsx b/src/components/task-item/task-item.tsx
index cf062849..8948ae32 100644
--- a/src/components/task-item/task-item.tsx
+++ b/src/components/task-item/task-item.tsx
@@ -16,11 +16,13 @@ export type TaskItemProps = {
   isDelete: boolean;
   isSelected: boolean;
   rtl: boolean;
+  allowProjectDateChange?: boolean;
   onEventStart: (
     action: GanttContentMoveAction,
     selectedTask: BarTask,
     event?: React.MouseEvent | React.KeyboardEvent
   ) => any;
+  onMouseDown?: (event: React.MouseEvent<SVGPolygonElement, MouseEvent>) => void;
 };
 
 export const TaskItem: React.FC<TaskItemProps> = props => {
@@ -30,7 +32,9 @@ export const TaskItem: React.FC<TaskItemProps> = props => {
     isDelete,
     taskHeight,
     isSelected,
+    isDateChangeable,
     rtl,
+    allowProjectDateChange,
     onEventStart,
   } = {
     ...props,
@@ -45,7 +49,9 @@ export const TaskItem: React.FC<TaskItemProps> = props => {
         setTaskItem(<Milestone {...props} />);
         break;
       case "project":
-        setTaskItem(<Project {...props} />);
+        setTaskItem(<Project  onMouseDown={e => 
+          isDateChangeable && allowProjectDateChange && onEventStart("move", task, e)
+        } {...props} />);
         break;
       case "smalltask":
         setTaskItem(<BarSmall {...props} />);
diff --git a/src/types/public-types.ts b/src/types/public-types.ts
index f4c641a6..2239f75e 100644
--- a/src/types/public-types.ts
+++ b/src/types/public-types.ts
@@ -71,6 +71,10 @@ export interface EventOption {
    * Invokes on expander on task list
    */
   onExpanderClick?: (task: Task) => void;
+  /**
+   * Allow project date change
+   */
+  allowProjectDateChange?: boolean;
 }
 
 export interface DisplayOption {