From 4066cbc6f0b65cfb9f0fce62b7849498cbe1c823 Mon Sep 17 00:00:00 2001
From: SohamBhattacharjee2003
 <125297948+SohamBhattacharjee2003@users.noreply.github.com>
Date: Wed, 8 Apr 2026 04:39:39 +0530
Subject: [PATCH] fix: remove unnecessary 'use client' directives to reduce
 client bundle

- Remove 'use client' from connector-document-mapping.ts (only exports constants and pure functions)
- Remove 'use client' from sidebar-separator.tsx (purely presentational component)
- Remove 'use client' and Framer Motion from logs/loading.tsx, replace with Tailwind animations
- Reduces client bundle size by moving server-compatible code to server components
---
 .../[search_space_id]/logs/loading.tsx        | 64 ++++---------------
 surfsense_web/app/docs/sidebar-separator.tsx  |  2 -
 .../utils/connector-document-mapping.ts       |  2 -
 3 files changed, 14 insertions(+), 54 deletions(-)

diff --git a/surfsense_web/app/dashboard/[search_space_id]/logs/loading.tsx b/surfsense_web/app/dashboard/[search_space_id]/logs/loading.tsx
index 961ca468e..e8ea64890 100644
--- a/surfsense_web/app/dashboard/[search_space_id]/logs/loading.tsx
+++ b/surfsense_web/app/dashboard/[search_space_id]/logs/loading.tsx
@@ -1,22 +1,10 @@
-"use client";
-
-import { motion } from "motion/react";
 import { Skeleton } from "@/components/ui/skeleton";
 
 export default function Loading() {
 	return (
-		<motion.div
-			initial={{ opacity: 0, y: 20 }}
-			animate={{ opacity: 1, y: 0 }}
-			transition={{ duration: 0.3 }}
-			className="w-full px-6 py-4 space-y-6 min-h-[calc(100vh-64px)]"
-		>
+		<div className="w-full px-6 py-4 space-y-6 min-h-[calc(100vh-64px)] animate-in fade-in duration-300">
 			{/* Summary Dashboard Skeleton */}
-			<motion.div
-				className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-4"
-				initial={{ opacity: 0 }}
-				animate={{ opacity: 1 }}
-			>
+			<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-4">
 				{[...Array(4)].map((_, i) => (
 					<div key={i} className="rounded-lg border p-4">
 						<div className="flex flex-row items-center justify-between space-y-0 pb-2">
@@ -29,44 +17,29 @@ export default function Loading() {
 						</div>
 					</div>
 				))}
-			</motion.div>
+			</div>
 
 			{/* Header Section Skeleton */}
-			<motion.div
-				className="flex items-center justify-between"
-				initial={{ opacity: 0, y: 10 }}
-				animate={{ opacity: 1, y: 0 }}
-				transition={{ delay: 0.1 }}
-			>
+			<div className="flex items-center justify-between">
 				<div className="space-y-2">
 					<Skeleton className="h-8 w-48" />
 					<Skeleton className="h-4 w-64" />
 				</div>
 				<Skeleton className="h-9 w-24" />
-			</motion.div>
+			</div>
 
 			{/* Filters Skeleton */}
-			<motion.div
-				className="flex flex-wrap items-center justify-start gap-3 w-full"
-				initial={{ opacity: 0, y: 10 }}
-				animate={{ opacity: 1, y: 0 }}
-				transition={{ delay: 0.2 }}
-			>
+			<div className="flex flex-wrap items-center justify-start gap-3 w-full">
 				<div className="flex items-center gap-3 flex-wrap w-full sm:w-auto">
 					<Skeleton className="h-9 w-full sm:w-60" />
 					<Skeleton className="h-9 w-24" />
 					<Skeleton className="h-9 w-24" />
 					<Skeleton className="h-9 w-20" />
 				</div>
-			</motion.div>
+			</div>
 
 			{/* Table Skeleton */}
-			<motion.div
-				className="rounded-md border overflow-hidden"
-				initial={{ opacity: 0, y: 20 }}
-				animate={{ opacity: 1, y: 0 }}
-				transition={{ delay: 0.3 }}
-			>
+			<div className="rounded-md border overflow-hidden">
 				{/* Table Header */}
 				<div className="border-b bg-muted/50 px-4 py-3 flex items-center gap-4">
 					<Skeleton className="h-4 w-4" />
@@ -99,27 +72,18 @@ export default function Loading() {
 						<Skeleton className="h-8 w-8" />
 					</div>
 				))}
-			</motion.div>
+			</div>
 
 			{/* Pagination Skeleton */}
 			<div className="flex items-center justify-between gap-8 mt-4">
-				<motion.div
-					className="flex items-center gap-3"
-					initial={{ opacity: 0, x: -20 }}
-					animate={{ opacity: 1, x: 0 }}
-				>
+				<div className="flex items-center gap-3">
 					<Skeleton className="h-4 w-20 max-sm:sr-only" />
 					<Skeleton className="h-9 w-16" />
-				</motion.div>
+				</div>
 
-				<motion.div
-					className="flex grow justify-end"
-					initial={{ opacity: 0 }}
-					animate={{ opacity: 1 }}
-					transition={{ delay: 0.2 }}
-				>
+				<div className="flex grow justify-end">
 					<Skeleton className="h-4 w-40" />
-				</motion.div>
+				</div>
 
 				<div className="flex items-center gap-2">
 					<Skeleton className="h-9 w-9" />
@@ -128,6 +92,6 @@ export default function Loading() {
 					<Skeleton className="h-9 w-9" />
 				</div>
 			</div>
-		</motion.div>
+		</div>
 	);
 }
diff --git a/surfsense_web/app/docs/sidebar-separator.tsx b/surfsense_web/app/docs/sidebar-separator.tsx
index 36fff09a4..ceb56b160 100644
--- a/surfsense_web/app/docs/sidebar-separator.tsx
+++ b/surfsense_web/app/docs/sidebar-separator.tsx
@@ -1,5 +1,3 @@
-"use client";
-
 import type { Separator } from "fumadocs-core/page-tree";
 
 export function SidebarSeparator({ item }: { item: Separator }) {
diff --git a/surfsense_web/components/assistant-ui/connector-popup/utils/connector-document-mapping.ts b/surfsense_web/components/assistant-ui/connector-popup/utils/connector-document-mapping.ts
index f924bb15f..d194fd0ed 100644
--- a/surfsense_web/components/assistant-ui/connector-popup/utils/connector-document-mapping.ts
+++ b/surfsense_web/components/assistant-ui/connector-popup/utils/connector-document-mapping.ts
@@ -1,5 +1,3 @@
-"use client";
-
 /**
  * Maps SearchSourceConnectorType to DocumentType for fetching document counts
  *