diff --git a/web/components/gantt-chart/chart/index.tsx b/web/components/gantt-chart/chart/index.tsx
index 869f5f81b..44f630970 100644
--- a/web/components/gantt-chart/chart/index.tsx
+++ b/web/components/gantt-chart/chart/index.tsx
@@ -72,7 +72,7 @@ export const ChartViewRoot: FC<ChartViewRootProps> = (props) => {
   // refs
   const sidebarRef = useRef<HTMLDivElement>(null);
   // hooks
-  const { currentView, currentViewData, renderView, dispatch, allViews, updateScrollLeft, scrollTop, updateScrollTop } =
+  const { currentView, currentViewData, renderView, dispatch, allViews, updateScrollLeft, updateScrollTop } =
     useChart();
 
   const renderBlockStructure = (view: any, blocks: IGanttBlock[] | null) =>
@@ -159,9 +159,9 @@ export const ChartViewRoot: FC<ChartViewRootProps> = (props) => {
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, []);
 
-  const updatingCurrentLeftScrollPosition = (width: number) => {
-    const scrollContainer = document.getElementById("scroll-container") as HTMLElement;
+  const scrollContainer = document.getElementById("scroll-container") as HTMLDivElement;
 
+  const updatingCurrentLeftScrollPosition = (width: number) => {
     if (!scrollContainer) return;
 
     scrollContainer.scrollLeft = width + scrollContainer?.scrollLeft;
@@ -169,8 +169,6 @@ export const ChartViewRoot: FC<ChartViewRootProps> = (props) => {
   };
 
   const handleScrollToCurrentSelectedDate = (currentState: ChartDataType, date: Date) => {
-    const scrollContainer = document.getElementById("scroll-container") as HTMLElement;
-
     if (!scrollContainer) return;
 
     const clientVisibleWidth: number = scrollContainer?.clientWidth;
@@ -198,19 +196,13 @@ export const ChartViewRoot: FC<ChartViewRootProps> = (props) => {
   };
 
   // handling scroll functionality
-  const onScroll = () => {
-    const scrollContainer = document.getElementById("scroll-container") as HTMLElement;
-
-    if (!scrollContainer) return;
-
-    const scrollWidth: number = scrollContainer?.scrollWidth;
-    const clientVisibleWidth: number = scrollContainer?.clientWidth;
-    const currentLeftScrollPosition: number = scrollContainer?.scrollLeft;
+  const onScroll = (e: React.UIEvent<HTMLDivElement, UIEvent>) => {
+    const { clientWidth: clientVisibleWidth, scrollLeft: currentLeftScrollPosition, scrollWidth } = e.currentTarget;
 
     updateScrollLeft(currentLeftScrollPosition);
 
-    const approxRangeLeft: number = scrollWidth >= clientVisibleWidth + 1000 ? 1000 : scrollWidth - clientVisibleWidth;
-    const approxRangeRight: number = scrollWidth - (approxRangeLeft + clientVisibleWidth);
+    const approxRangeLeft = scrollWidth >= clientVisibleWidth + 1000 ? 1000 : scrollWidth - clientVisibleWidth;
+    const approxRangeRight = scrollWidth - (approxRangeLeft + clientVisibleWidth);
 
     if (currentLeftScrollPosition >= approxRangeRight) updateCurrentViewRenderPayload("right", currentView);
     if (currentLeftScrollPosition <= approxRangeLeft) updateCurrentViewRenderPayload("left", currentView);
diff --git a/web/components/gantt-chart/helpers/draggable.tsx b/web/components/gantt-chart/helpers/draggable.tsx
index e3f6bc3d2..9df420934 100644
--- a/web/components/gantt-chart/helpers/draggable.tsx
+++ b/web/components/gantt-chart/helpers/draggable.tsx
@@ -31,10 +31,10 @@ export const ChartDraggable: React.FC<Props> = (props) => {
 
     let delWidth = 0;
 
-    const ganttContainer = document.querySelector("#gantt-container") as HTMLElement;
-    const ganttSidebar = document.querySelector("#gantt-sidebar") as HTMLElement;
+    const ganttContainer = document.querySelector("#gantt-container") as HTMLDivElement;
+    const ganttSidebar = document.querySelector("#gantt-sidebar") as HTMLDivElement;
 
-    const scrollContainer = document.querySelector("#scroll-container") as HTMLElement;
+    const scrollContainer = document.querySelector("#scroll-container") as HTMLDivElement;
 
     if (!ganttContainer || !ganttSidebar || !scrollContainer) return 0;
 
@@ -223,8 +223,6 @@ export const ChartDraggable: React.FC<Props> = (props) => {
 
   const textDisplacement = scrollLeft - (block.position?.marginLeft ?? 0);
 
-  console.log("scrollLeft", scrollLeft);
-
   return (
     <>
       {/* move to left side hidden block button */}