progress & list table hotfix

MaTeMaTuK · Sep 1, 2020 · b555e8a · b555e8a
1 parent 75e929f
commit b555e8a
Show file tree

Hide file tree

Showing 6 changed files with 23 additions and 19 deletions.
diff --git a/example/package-lock.json b/example/package-lock.json
diff --git a/example/src/App.tsx b/example/src/App.tsx
@@ -111,7 +111,7 @@ const App = () => {
         onTaskDelete={onTaskDelete}
         onProgressChange={onProgressChange}
         onDoubleClick={onDblClick}
-        listCellWidth={isChecked ? "150px" : ""}
+        listCellWidth={isChecked ? "155px" : ""}
         columnWidth={columnWidth}
       />
       <h3>Gantt With Limited Height</h3>
@@ -122,7 +122,7 @@ const App = () => {
         onTaskDelete={onTaskDelete}
         onProgressChange={onProgressChange}
         onDoubleClick={onDblClick}
-        listCellWidth={isChecked ? "150px" : ""}
+        listCellWidth={isChecked ? "155px" : ""}
         ganttHeight={300}
         columnWidth={columnWidth}
       />

diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "gantt-task-react",
-  "version": "0.1.7",
+  "version": "0.1.8",
   "description": "Interactive Gantt Chart for React with TypeScript.",
   "author": "MaTeMaTuK <[email protected]>",
   "homepage": "https://github.com/MaTeMaTuK/gantt-task-react",

diff --git a/src/components/gantt/gantt.tsx b/src/components/gantt/gantt.tsx
@@ -16,7 +16,7 @@ export const Gantt: React.SFC<GanttProps> = ({
   tasks,
   headerHeight = 50,
   columnWidth = 60,
-  listCellWidth = "150px",
+  listCellWidth = "155px",
   rowHeight = 50,
   ganttHeight = 0,
   viewMode = ViewMode.Day,
@@ -151,7 +151,7 @@ export const Gantt: React.SFC<GanttProps> = ({
   };
 
   // task change event
-  const onTasksDateChange = (tasks: Task[]) => {
+  const handleTasksChange = (tasks: Task[]) => {
     setGanttTasks(tasks);
   };
 
@@ -190,7 +190,7 @@ export const Gantt: React.SFC<GanttProps> = ({
     fontSize,
     arrowIndent,
     svgHeight,
-    onTasksDateChange: onTasksDateChange,
+    onTasksChange: handleTasksChange,
     onDateChange,
     onProgressChange,
     onDoubleClick,

diff --git a/src/components/gantt/task-gantt-content.tsx b/src/components/gantt/task-gantt-content.tsx
@@ -46,7 +46,7 @@ export type TaskGanttContentProps = {
     fontSize: string;
     fontFamily: string;
   }>;
-  onTasksDateChange: (tasks: Task[]) => void;
+  onTasksChange: (tasks: Task[]) => void;
 } & EventOption;
 
 export const TaskGanttContent: React.FC<TaskGanttContentProps> = ({
@@ -68,7 +68,7 @@ export const TaskGanttContent: React.FC<TaskGanttContentProps> = ({
   arrowIndent,
   fontFamily,
   fontSize,
-  onTasksDateChange,
+  onTasksChange,
   onDateChange,
   onProgressChange,
   onDoubleClick,
@@ -139,7 +139,7 @@ export const TaskGanttContent: React.FC<TaskGanttContentProps> = ({
         if (onTaskDelete) {
           await onTaskDelete(selectedTask);
           const newTasks = barTasks.filter(t => t.id !== selectedTask.id);
-          onTasksDateChange(newTasks);
+          onTasksChange(newTasks);
         }
       }
     } else if (action === "mouseenter") {
@@ -226,13 +226,15 @@ export const TaskGanttContent: React.FC<TaskGanttContentProps> = ({
         isNotLikeOriginal
       ) {
         await onDateChange(changedTask);
-        const newTasks = barTasks.map(t =>
-          t.id === changedTask.id ? changedTask : t
-        );
-        onTasksDateChange(newTasks);
       } else if (onProgressChange && isNotLikeOriginal) {
         await onProgressChange(changedTask);
       }
+
+      const newTasks = barTasks.map(t =>
+        t.id === changedTask.id ? changedTask : t
+      );
+      onTasksChange(newTasks);
+
       svg.current.removeEventListener("mousemove", handleMouseMove);
       svg.current.removeEventListener("mouseup", handleMouseUp);
       setBarEvent({ action: "" });

diff --git a/src/components/task-list/task-list-table.tsx b/src/components/task-list/task-list-table.tsx
@@ -45,6 +45,7 @@ export const TaskListTableDefault: React.FC<{
               className={styles.taskListCell}
               style={{
                 minWidth: rowWidth,
+                maxWidth: rowWidth,
               }}
             >
               &nbsp;{t.start.toLocaleDateString(locale, dateTimeOptions)}
@@ -53,6 +54,7 @@ export const TaskListTableDefault: React.FC<{
               className={styles.taskListCell}
               style={{
                 minWidth: rowWidth,
+                maxWidth: rowWidth,
               }}
             >
               &nbsp;{t.end.toLocaleDateString(locale, dateTimeOptions)}