From b6f555b86b112441cc8c01e6dcdf33ea6b9cdb2e Mon Sep 17 00:00:00 2001
From: Yaroslav Kuznietsov <kuznetsov.yaroslav.yk@gmail.com>
Date: Thu, 25 Jul 2024 18:58:57 +0300
Subject: [PATCH] [Timeline]: fixed bugs with deadline only.

---
 app/src/demo/tables/editableTable/TaskBar.module.scss | 4 ++++
 app/src/demo/tables/editableTable/TaskBar.tsx         | 8 ++++++--
 app/src/demo/tables/editableTable/helpers.ts          | 8 ++++++--
 3 files changed, 16 insertions(+), 4 deletions(-)

diff --git a/app/src/demo/tables/editableTable/TaskBar.module.scss b/app/src/demo/tables/editableTable/TaskBar.module.scss
index c87c5f52c0..b395a25d9f 100644
--- a/app/src/demo/tables/editableTable/TaskBar.module.scss
+++ b/app/src/demo/tables/editableTable/TaskBar.module.scss
@@ -54,6 +54,10 @@
     border-radius: 3px 0 0 3px;
 }
 
+.taskBarDeadlineOnly {
+    border-radius: 3px 3px 3px 3px;
+}
+
 .taskBarOnTime {
     border-radius: 3px 3px 3px 3px;
 }
diff --git a/app/src/demo/tables/editableTable/TaskBar.tsx b/app/src/demo/tables/editableTable/TaskBar.tsx
index 28efcf929d..411f41bcfc 100644
--- a/app/src/demo/tables/editableTable/TaskBar.tsx
+++ b/app/src/demo/tables/editableTable/TaskBar.tsx
@@ -200,7 +200,7 @@ export function TaskBar({ task, timelineController }: { task: Task, timelineCont
                     className={ cx(
                         css.taskBar,
                         css[`taskBarStatus${statusTags[task.status] ?? 'None'}`],
-                        isMissingDeadline ? css.taskBarWithMissingDeadline : css.taskBarOnTime,
+                        isMissingDeadline && positionConfig.taskBarWidth ? css.taskBarWithMissingDeadline : css.taskBarOnTime,
                     ) }
                 >
                     { positionConfig.taskBarWidth > 50 && (
@@ -213,7 +213,11 @@ export function TaskBar({ task, timelineController }: { task: Task, timelineCont
                     ) }
                 </div>
                 <div
-                    className={ classNames(css.taskBar, css.taskBarDeadline) }
+                    className={ classNames(
+                        css.taskBar,
+                        css.taskBarDeadline,
+                        isMissingDeadline && positionConfig.taskBarWidth === 0 ? css.taskBarDeadlineOnly : undefined,
+                    ) }
                     style={ { width: `${deadlineWidth}px` } }
                 >
                 </div>
diff --git a/app/src/demo/tables/editableTable/helpers.ts b/app/src/demo/tables/editableTable/helpers.ts
index 0435a9af70..6fb438d2cc 100644
--- a/app/src/demo/tables/editableTable/helpers.ts
+++ b/app/src/demo/tables/editableTable/helpers.ts
@@ -618,10 +618,14 @@ export const getWidth = (from: Date, to: Date, t: TimelineTransform) => {
 };
 
 export const getTaskBarWidth = (from: Date, deadline: Date, estimatedTo: Date, t: TimelineTransform) => {
-    if (!deadline || deadline.getTime() < from.getTime()) {
+    if (!deadline) {
         return getWidth(from, estimatedTo, t);
     }
 
-    const to = deadline.getTime() < estimatedTo.getTime() ? deadline : estimatedTo;
+    let realDeadline = deadline;
+    if (deadline.getTime() < from.getTime()) {
+        realDeadline = from;
+    }
+    const to = realDeadline.getTime() < estimatedTo.getTime() ? realDeadline : estimatedTo;
     return getWidth(from, to, t);
 };