Merge pull request #1071 from JoeMakuta/feature/optimize-package-imports

feature : optimize package imports

surfsense_web/app/error.tsx

@@ -1,6 +1,6 @@
 "use client";
 
-import posthog from "posthog-js";
+
 import { useEffect } from "react";
 
 export default function ErrorPage({
@@ -11,7 +11,11 @@ export default function ErrorPage({
 	reset: () => void;
 }) {
 	useEffect(() => {
-		posthog.captureException(error);
+		import("posthog-js")
+			.then(({ default: posthog }) => {
+				posthog.captureException(error);
+			})
+			.catch(() => {});
 	}, [error]);
 
 	return (

surfsense_web/components/ui/checkbox.tsx

@@ -1,7 +1,7 @@
 "use client";
 
 import { CheckIcon } from "lucide-react";
-import { Checkbox as CheckboxPrimitive } from "radix-ui";
+import * as CheckboxPrimitive from "@radix-ui/react-checkbox";
 import type * as React from "react";
 
 import { cn } from "@/lib/utils";

surfsense_web/components/ui/dropdown-menu.tsx

@@ -1,7 +1,7 @@
 "use client";
 
 import { CheckIcon, ChevronRightIcon, CircleIcon } from "lucide-react";
-import { DropdownMenu as DropdownMenuPrimitive } from "radix-ui";
+import * as DropdownMenuPrimitive from "@radix-ui/react-dropdown-menu";
 import type * as React from "react";
 
 import { cn } from "@/lib/utils";

surfsense_web/components/ui/separator.tsx

@@ -1,6 +1,6 @@
 "use client";
 
-import { Separator as SeparatorPrimitive } from "radix-ui";
+import * as SeparatorPrimitive from "@radix-ui/react-separator";
 import type * as React from "react";
 
 import { cn } from "@/lib/utils";

surfsense_web/components/ui/toggle-group.tsx

@@ -1,7 +1,7 @@
 "use client";
 
 import type { VariantProps } from "class-variance-authority";
-import { ToggleGroup as ToggleGroupPrimitive } from "radix-ui";
+import * as ToggleGroupPrimitive from "@radix-ui/react-toggle-group";
 import * as React from "react";
 import { toggleVariants } from "@/components/ui/toggle";
 import { cn } from "@/lib/utils";

surfsense_web/components/ui/toggle.tsx

@@ -1,7 +1,7 @@
 "use client";
 
 import { cva, type VariantProps } from "class-variance-authority";
-import { Toggle as TogglePrimitive } from "radix-ui";
+import * as TogglePrimitive from "@radix-ui/react-toggle";
 import type * as React from "react";
 
 import { cn } from "@/lib/utils";

surfsense_web/components/ui/tooltip.tsx

@@ -1,6 +1,6 @@
 "use client";
 
-import { Tooltip as TooltipPrimitive } from "radix-ui";
+import * as TooltipPrimitive from "@radix-ui/react-tooltip";
 import type * as React from "react";
 
 import { cn } from "@/lib/utils";

surfsense_web/lib/apis/base-api.service.ts

@@ -1,4 +1,3 @@
-import posthog from "posthog-js";
 import type { ZodType } from "zod";
 import { getBearerToken, handleUnauthorized, refreshAccessToken } from "../auth-utils";
 import { AppError, AuthenticationError, AuthorizationError, NotFoundError } from "../error";
@@ -234,18 +233,21 @@ class BaseApiService {
 		} catch (error) {
 			console.error("Request failed:", JSON.stringify(error));
 			if (!(error instanceof AuthenticationError)) {
-				try {
-					posthog.captureException(error, {
-						api_url: url,
-						api_method: options?.method ?? "GET",
-						...(error instanceof AppError && {
-							status_code: error.status,
-							status_text: error.statusText,
-						}),
+				import("posthog-js")
+					.then(({ default: posthog }) => {
+						posthog.captureException(error, {
+							api_url: url,
+							api_method: options?.method ?? "GET",
+							...(error instanceof AppError && {
+								status_code: error.status,
+								status_text: error.statusText,
+							}),
+						});
+					})
+					.catch(() => {
+						// PostHog is not available in the current environment
+						console.error("Failed to capture exception in PostHog");
 					});
-				} catch {
-					// PostHog capture failed — don't block the error flow
-				}
 			}
 			throw error;
 		}

surfsense_web/next.config.ts

@@ -24,6 +24,16 @@ const nextConfig: NextConfig = {
 			},
 		],
 	},
+	experimental: {
+		optimizePackageImports: [
+			"lucide-react",
+			"@tabler/icons-react",
+			"date-fns",
+			"@assistant-ui/react",
+			"@assistant-ui/react-markdown",
+			"motion",
+		],
+	},
 	// Turbopack config (used during `next dev --turbopack`)
 	turbopack: {
 		rules: {