From b5ebce6ce23e6390002ff90dbbbdd63071ce8a97 Mon Sep 17 00:00:00 2001
From: rahulramesha <rahulramesham@gmail.com>
Date: Thu, 8 Feb 2024 19:41:50 +0530
Subject: [PATCH] add comments and minor changes

---
 web/components/core/render-if-visible-HOC.tsx            | 9 ++++-----
 .../issues/issue-layouts/kanban/kanban-group.tsx         | 2 +-
 web/components/issues/issue-layouts/kanban/swimlanes.tsx | 2 +-
 3 files changed, 6 insertions(+), 7 deletions(-)

diff --git a/web/components/core/render-if-visible-HOC.tsx b/web/components/core/render-if-visible-HOC.tsx
index 8a08f1d04..26ae15285 100644
--- a/web/components/core/render-if-visible-HOC.tsx
+++ b/web/components/core/render-if-visible-HOC.tsx
@@ -24,10 +24,10 @@ const RenderIfVisible: React.FC<Props> = (props) => {
     as = "div",
     children,
     classNames = "",
-    alwaysRender = false,
-    placeholderChildren = null,
-    pauseHeightUpdateWhileRendering = false,
-    changingReference,
+    alwaysRender = false, //render the children even if it is not visble in root
+    placeholderChildren = null, //placeholder children
+    pauseHeightUpdateWhileRendering = false, //while this is true the height of the blocks are maintained
+    changingReference, //This is to force render when this reference is changed
   } = props;
   const [shouldVisible, setShouldVisible] = useState<boolean>(alwaysRender);
   const placeholderHeight = useRef<string>(defaultHeight);
@@ -53,7 +53,6 @@ const RenderIfVisible: React.FC<Props> = (props) => {
           rootMargin: `${verticalOffset}% ${horizonatlOffset}% ${verticalOffset}% ${horizonatlOffset}%`,
         }
       );
-      observer.unobserve(intersectionRef.current);
       observer.observe(intersectionRef.current);
       return () => {
         if (intersectionRef.current) {
diff --git a/web/components/issues/issue-layouts/kanban/kanban-group.tsx b/web/components/issues/issue-layouts/kanban/kanban-group.tsx
index 571a7bfb9..7cbda05e1 100644
--- a/web/components/issues/issue-layouts/kanban/kanban-group.tsx
+++ b/web/components/issues/issue-layouts/kanban/kanban-group.tsx
@@ -1,3 +1,4 @@
+import { MutableRefObject } from "react";
 import { Droppable } from "@hello-pangea/dnd";
 // hooks
 import { useProjectState } from "hooks/store";
@@ -13,7 +14,6 @@ import {
   TUnGroupedIssues,
 } from "@plane/types";
 import { EIssueActions } from "../types";
-import { MutableRefObject } from "react";
 
 interface IKanbanGroup {
   groupId: string;
diff --git a/web/components/issues/issue-layouts/kanban/swimlanes.tsx b/web/components/issues/issue-layouts/kanban/swimlanes.tsx
index 462ade1f8..5fdb58ef0 100644
--- a/web/components/issues/issue-layouts/kanban/swimlanes.tsx
+++ b/web/components/issues/issue-layouts/kanban/swimlanes.tsx
@@ -1,3 +1,4 @@
+import { MutableRefObject } from "react";
 import { observer } from "mobx-react-lite";
 // components
 import { KanBan } from "./default";
@@ -20,7 +21,6 @@ import { EIssueActions } from "../types";
 import { useLabel, useMember, useProject, useProjectState } from "hooks/store";
 import { getGroupByColumns } from "../utils";
 import { TCreateModalStoreTypes } from "constants/issue";
-import { MutableRefObject } from "react";
 
 interface ISubGroupSwimlaneHeader {
   issueIds: TGroupedIssues | TSubGroupedIssues | TUnGroupedIssues;