From d5220e95a5c49a21202e7b52bc9eee232ddbd690 Mon Sep 17 00:00:00 2001
From: Prateek Shourya <prateekshourya29@gmail.com>
Date: Wed, 13 Aug 2025 15:16:37 +0530
Subject: [PATCH 1/3] [WEB-4693] fix: remove initial load flicker on
 auto-archive and auto-close automation page

---
 .../components/automation/auto-archive-automation.tsx    | 9 +++++++--
 .../core/components/automation/auto-close-automation.tsx | 9 +++++++--
 2 files changed, 14 insertions(+), 4 deletions(-)

diff --git a/apps/web/core/components/automation/auto-archive-automation.tsx b/apps/web/core/components/automation/auto-archive-automation.tsx
index 91c7bd62cb1..3342b6aa30d 100644
--- a/apps/web/core/components/automation/auto-archive-automation.tsx
+++ b/apps/web/core/components/automation/auto-archive-automation.tsx
@@ -48,6 +48,11 @@ export const AutoArchiveAutomation: React.FC<Props> = observer((props) => {
     currentProjectDetails?.id
   );
 
+  const getAutoArchiveStatus = () => {
+    if (currentProjectDetails === undefined || currentProjectDetails.archive_in === undefined) return false;
+    return currentProjectDetails.archive_in !== 0;
+  };
+
   return (
     <>
       <SelectMonthModal
@@ -71,7 +76,7 @@ export const AutoArchiveAutomation: React.FC<Props> = observer((props) => {
             </div>
           </div>
           <ToggleSwitch
-            value={currentProjectDetails?.archive_in !== 0}
+            value={getAutoArchiveStatus()}
             onChange={async () => {
               if (currentProjectDetails?.archive_in === 0) {
                 await handleChange({ archive_in: 1 });
@@ -94,7 +99,7 @@ export const AutoArchiveAutomation: React.FC<Props> = observer((props) => {
         </div>
 
         {currentProjectDetails ? (
-          currentProjectDetails.archive_in !== 0 && (
+          getAutoArchiveStatus() && (
             <div className="mx-6">
               <div className="flex w-full items-center justify-between gap-2 rounded border border-custom-border-200 bg-custom-background-90 px-5 py-4">
                 <div className="w-1/2 text-sm font-medium">
diff --git a/apps/web/core/components/automation/auto-close-automation.tsx b/apps/web/core/components/automation/auto-close-automation.tsx
index 736abbc24e0..47056eb31f0 100644
--- a/apps/web/core/components/automation/auto-close-automation.tsx
+++ b/apps/web/core/components/automation/auto-close-automation.tsx
@@ -75,6 +75,11 @@ export const AutoCloseAutomation: React.FC<Props> = observer((props) => {
     currentProjectDetails?.id
   );
 
+  const getAutoCloseStatus = () => {
+    if (currentProjectDetails === undefined || currentProjectDetails.close_in === undefined) return false;
+    return currentProjectDetails.close_in !== 0;
+  };
+
   return (
     <>
       <SelectMonthModal
@@ -98,7 +103,7 @@ export const AutoCloseAutomation: React.FC<Props> = observer((props) => {
             </div>
           </div>
           <ToggleSwitch
-            value={currentProjectDetails?.close_in !== 0}
+            value={getAutoCloseStatus()}
             onChange={async () => {
               if (currentProjectDetails?.close_in === 0) {
                 await handleChange({ close_in: 1, default_state: defaultState });
@@ -121,7 +126,7 @@ export const AutoCloseAutomation: React.FC<Props> = observer((props) => {
         </div>
 
         {currentProjectDetails ? (
-          currentProjectDetails.close_in !== 0 && (
+          getAutoCloseStatus() && (
             <div className="mx-6">
               <div className="flex flex-col rounded border border-custom-border-200 bg-custom-background-90">
                 <div className="flex w-full items-center justify-between gap-2 px-5 py-4">

From 036e229ff06988a24123e1b255860c13e46de51a Mon Sep 17 00:00:00 2001
From: Prateek Shourya <prateekshourya29@gmail.com>
Date: Wed, 13 Aug 2025 18:24:13 +0530
Subject: [PATCH 2/3] refactor: optimize auto-archive and auto-close status
 calculations using useMemo

---
 .../components/automation/auto-archive-automation.tsx  | 10 +++++-----
 .../components/automation/auto-close-automation.tsx    | 10 +++++-----
 2 files changed, 10 insertions(+), 10 deletions(-)

diff --git a/apps/web/core/components/automation/auto-archive-automation.tsx b/apps/web/core/components/automation/auto-archive-automation.tsx
index 3342b6aa30d..efd8c9d673a 100644
--- a/apps/web/core/components/automation/auto-archive-automation.tsx
+++ b/apps/web/core/components/automation/auto-archive-automation.tsx
@@ -1,6 +1,6 @@
 "use client";
 
-import React, { useState } from "react";
+import React, { useMemo, useState } from "react";
 import { observer } from "mobx-react";
 import { useParams } from "next/navigation";
 import { ArchiveRestore } from "lucide-react";
@@ -48,10 +48,10 @@ export const AutoArchiveAutomation: React.FC<Props> = observer((props) => {
     currentProjectDetails?.id
   );
 
-  const getAutoArchiveStatus = () => {
+  const autoArchiveStatus = useMemo(() => {
     if (currentProjectDetails === undefined || currentProjectDetails.archive_in === undefined) return false;
     return currentProjectDetails.archive_in !== 0;
-  };
+  }, [currentProjectDetails]);
 
   return (
     <>
@@ -76,7 +76,7 @@ export const AutoArchiveAutomation: React.FC<Props> = observer((props) => {
             </div>
           </div>
           <ToggleSwitch
-            value={getAutoArchiveStatus()}
+            value={autoArchiveStatus}
             onChange={async () => {
               if (currentProjectDetails?.archive_in === 0) {
                 await handleChange({ archive_in: 1 });
@@ -99,7 +99,7 @@ export const AutoArchiveAutomation: React.FC<Props> = observer((props) => {
         </div>
 
         {currentProjectDetails ? (
-          getAutoArchiveStatus() && (
+          autoArchiveStatus && (
             <div className="mx-6">
               <div className="flex w-full items-center justify-between gap-2 rounded border border-custom-border-200 bg-custom-background-90 px-5 py-4">
                 <div className="w-1/2 text-sm font-medium">
diff --git a/apps/web/core/components/automation/auto-close-automation.tsx b/apps/web/core/components/automation/auto-close-automation.tsx
index 47056eb31f0..f8f2b0765c5 100644
--- a/apps/web/core/components/automation/auto-close-automation.tsx
+++ b/apps/web/core/components/automation/auto-close-automation.tsx
@@ -1,6 +1,6 @@
 "use client";
 
-import React, { useState } from "react";
+import React, { useMemo, useState } from "react";
 import { observer } from "mobx-react";
 import { useParams } from "next/navigation";
 // icons
@@ -75,10 +75,10 @@ export const AutoCloseAutomation: React.FC<Props> = observer((props) => {
     currentProjectDetails?.id
   );
 
-  const getAutoCloseStatus = () => {
+  const autoCloseStatus = useMemo(() => {
     if (currentProjectDetails === undefined || currentProjectDetails.close_in === undefined) return false;
     return currentProjectDetails.close_in !== 0;
-  };
+  }, [currentProjectDetails]);
 
   return (
     <>
@@ -103,7 +103,7 @@ export const AutoCloseAutomation: React.FC<Props> = observer((props) => {
             </div>
           </div>
           <ToggleSwitch
-            value={getAutoCloseStatus()}
+            value={autoCloseStatus}
             onChange={async () => {
               if (currentProjectDetails?.close_in === 0) {
                 await handleChange({ close_in: 1, default_state: defaultState });
@@ -126,7 +126,7 @@ export const AutoCloseAutomation: React.FC<Props> = observer((props) => {
         </div>
 
         {currentProjectDetails ? (
-          getAutoCloseStatus() && (
+          autoCloseStatus && (
             <div className="mx-6">
               <div className="flex flex-col rounded border border-custom-border-200 bg-custom-background-90">
                 <div className="flex w-full items-center justify-between gap-2 px-5 py-4">

From 37a64a6c3a3325ec6fc0d24231f85dcb35ad4c5d Mon Sep 17 00:00:00 2001
From: Prateek Shourya <prateekshourya29@gmail.com>
Date: Wed, 13 Aug 2025 18:35:42 +0530
Subject: [PATCH 3/3] chore: add requested changes

---
 apps/web/core/components/automation/auto-archive-automation.tsx | 2 +-
 apps/web/core/components/automation/auto-close-automation.tsx   | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/apps/web/core/components/automation/auto-archive-automation.tsx b/apps/web/core/components/automation/auto-archive-automation.tsx
index efd8c9d673a..e83c1965117 100644
--- a/apps/web/core/components/automation/auto-archive-automation.tsx
+++ b/apps/web/core/components/automation/auto-archive-automation.tsx
@@ -49,7 +49,7 @@ export const AutoArchiveAutomation: React.FC<Props> = observer((props) => {
   );
 
   const autoArchiveStatus = useMemo(() => {
-    if (currentProjectDetails === undefined || currentProjectDetails.archive_in === undefined) return false;
+    if (currentProjectDetails?.archive_in === undefined) return false;
     return currentProjectDetails.archive_in !== 0;
   }, [currentProjectDetails]);
 
diff --git a/apps/web/core/components/automation/auto-close-automation.tsx b/apps/web/core/components/automation/auto-close-automation.tsx
index f8f2b0765c5..44c8b76713c 100644
--- a/apps/web/core/components/automation/auto-close-automation.tsx
+++ b/apps/web/core/components/automation/auto-close-automation.tsx
@@ -76,7 +76,7 @@ export const AutoCloseAutomation: React.FC<Props> = observer((props) => {
   );
 
   const autoCloseStatus = useMemo(() => {
-    if (currentProjectDetails === undefined || currentProjectDetails.close_in === undefined) return false;
+    if (currentProjectDetails?.close_in === undefined) return false;
     return currentProjectDetails.close_in !== 0;
   }, [currentProjectDetails]);