From 0e0aec13f3a28ba35e3d8b94e048b9f8753b5f81 Mon Sep 17 00:00:00 2001
From: Anish Sarkar <104695310+AnishSarkar22@users.noreply.github.com>
Date: Tue, 13 Jan 2026 21:17:17 +0530
Subject: [PATCH] refactor: Update indexing status display in connector
 components

- Replaced the previous "Syncing..." text with a more concise "Syncing" in various components to enhance clarity.
- Adjusted the UI to maintain consistent styling and improve user experience during indexing operations.
- Simplified conditional rendering for indexing status across ConnectorCard, ActiveConnectorsTab, and ConnectorAccountsListView components.
---
 .../components/connector-card.tsx             | 19 +++---------
 .../tabs/active-connectors-tab.tsx            | 30 ++++++++++---------
 .../views/connector-accounts-list-view.tsx    |  2 +-
 3 files changed, 21 insertions(+), 30 deletions(-)

diff --git a/surfsense_web/components/assistant-ui/connector-popup/components/connector-card.tsx b/surfsense_web/components/assistant-ui/connector-popup/components/connector-card.tsx
index cd8e2cf99..9701c3259 100644
--- a/surfsense_web/components/assistant-ui/connector-popup/components/connector-card.tsx
+++ b/surfsense_web/components/assistant-ui/connector-popup/components/connector-card.tsx
@@ -61,20 +61,6 @@ export const ConnectorCard: FC<ConnectorCardProps> = ({
 
 	// Determine the status content to display
 	const getStatusContent = () => {
-		if (isIndexing) {
-			return (
-				<div className="flex items-center gap-2 w-full max-w-[200px]">
-					<span className="text-[11px] text-primary font-medium whitespace-nowrap">
-						Syncing...
-					</span>
-					{/* Indeterminate progress bar with animation */}
-					<div className="relative flex-1 h-1 overflow-hidden rounded-full bg-primary/20">
-						<div className="absolute h-full bg-primary rounded-full animate-progress-indeterminate" />
-					</div>
-				</div>
-			);
-		}
-
 		if (isConnected) {
 			// Don't show last indexed in overview tabs - only show in accounts list view
 			return null;
@@ -120,7 +106,10 @@ export const ConnectorCard: FC<ConnectorCardProps> = ({
 					)}
 				</div>
 				{isIndexing ? (
-					<div className="text-[10px] text-muted-foreground mt-1">{getStatusContent()}</div>
+					<p className="text-[11px] text-primary mt-1 flex items-center gap-1.5">
+						<Loader2 className="size-3 animate-spin" />
+						Syncing
+					</p>
 				) : isConnected ? (
 					<p className="text-[10px] text-muted-foreground mt-1 flex items-center gap-1.5">
 						<span>{formatDocumentCount(documentCount)}</span>
diff --git a/surfsense_web/components/assistant-ui/connector-popup/tabs/active-connectors-tab.tsx b/surfsense_web/components/assistant-ui/connector-popup/tabs/active-connectors-tab.tsx
index 54ad1db0a..8188e6723 100644
--- a/surfsense_web/components/assistant-ui/connector-popup/tabs/active-connectors-tab.tsx
+++ b/surfsense_web/components/assistant-ui/connector-popup/tabs/active-connectors-tab.tsx
@@ -192,19 +192,20 @@ export const ActiveConnectorsTab: FC<ActiveConnectorsTabProps> = ({
 											</div>
 											<div className="flex-1 min-w-0">
 												<p className="text-[14px] font-semibold leading-tight truncate">{title}</p>
-												{isAnyIndexing && (
+												{isAnyIndexing ? (
 													<p className="text-[11px] text-primary mt-1 flex items-center gap-1.5">
 														<Loader2 className="size-3 animate-spin" />
-														Indexing...
+														Syncing
+													</p>
+												) : (
+													<p className="text-[10px] text-muted-foreground mt-1 flex items-center gap-1.5">
+														<span>{formatDocumentCount(documentCount)}</span>
+														<span className="text-muted-foreground/50">•</span>
+														<span>
+															{accountCount} {accountCount === 1 ? "Account" : "Accounts"}
+														</span>
 													</p>
 												)}
-												<p className="text-[10px] text-muted-foreground mt-1 flex items-center gap-1.5">
-													<span>{formatDocumentCount(documentCount)}</span>
-													<span className="text-muted-foreground/50">•</span>
-													<span>
-														{accountCount} {accountCount === 1 ? "Account" : "Accounts"}
-													</span>
-												</p>
 											</div>
 											<Button
 												variant="secondary"
@@ -250,15 +251,16 @@ export const ActiveConnectorsTab: FC<ActiveConnectorsTabProps> = ({
 												<p className="text-[14px] font-semibold leading-tight truncate">
 													{connector.name}
 												</p>
-												{isIndexing && (
+												{isIndexing ? (
 													<p className="text-[11px] text-primary mt-1 flex items-center gap-1.5">
 														<Loader2 className="size-3 animate-spin" />
-														Syncing...
+														Syncing
+													</p>
+												) : (
+													<p className="text-[10px] text-muted-foreground mt-1">
+														{formatDocumentCount(documentCount)}
 													</p>
 												)}
-												<p className="text-[10px] text-muted-foreground mt-1">
-													{formatDocumentCount(documentCount)}
-												</p>
 											</div>
 											<Button
 												variant="secondary"
diff --git a/surfsense_web/components/assistant-ui/connector-popup/views/connector-accounts-list-view.tsx b/surfsense_web/components/assistant-ui/connector-popup/views/connector-accounts-list-view.tsx
index 2bbbc98e8..17a5368bc 100644
--- a/surfsense_web/components/assistant-ui/connector-popup/views/connector-accounts-list-view.tsx
+++ b/surfsense_web/components/assistant-ui/connector-popup/views/connector-accounts-list-view.tsx
@@ -162,7 +162,7 @@ export const ConnectorAccountsListView: FC<ConnectorAccountsListViewProps> = ({
 									{isIndexing ? (
 										<p className="text-[11px] text-primary mt-1 flex items-center gap-1.5">
 											<Loader2 className="size-3 animate-spin" />
-											Syncing...
+											Syncing
 										</p>
 									) : (
 										<p className="text-[10px] text-muted-foreground mt-1 whitespace-nowrap truncate">