Set up test prod db connection

inventory/src/components/settings/DataManagement.tsx

@@ -13,7 +13,7 @@ import {
   AlertDialogTitle,
   AlertDialogTrigger,
 } from "@/components/ui/alert-dialog";
-import { Loader2, RefreshCw, Upload, X } from "lucide-react";
+import { Loader2, RefreshCw, Upload, X, Database } from "lucide-react";
 import config from '../../config';
 import { toast } from "sonner";
 
@@ -71,6 +71,9 @@ export function DataManagement() {
   // Track cancellation state
   const [cancelledOperations, setCancelledOperations] = useState<Set<string>>(new Set());
 
+  // Add new state for testing connection
+  const [isTestingConnection, setIsTestingConnection] = useState(false);
+
   // Helper to check if any operation is running
   const isAnyOperationRunning = () => {
     return isUpdating || isImporting || isResetting || isResettingMetrics || isCalculatingMetrics;
@@ -829,8 +832,56 @@ export function DataManagement() {
     }
   };
 
+  const handleTestConnection = async () => {
+    setIsTestingConnection(true);
+    try {
+      const response = await fetch(`${config.apiUrl}/test-prod-connection`, {
+        credentials: 'include'
+      });
+      
+      const data = await response.json();
+      
+      if (response.ok) {
+        toast.success(`Successfully connected to production database. Found ${data.productCount.toLocaleString()} products.`);
+      } else {
+        throw new Error(data.error || 'Failed to connect to production database');
+      }
+    } catch (error) {
+      toast.error(`Connection test failed: ${error instanceof Error ? error.message : 'Unknown error'}`);
+    } finally {
+      setIsTestingConnection(false);
+    }
+  };
+
   return (
     <div className="max-w-[400px] space-y-4">
+      {/* Test Production Connection Card */}
+      <Card>
+        <CardHeader>
+          <CardTitle>Test Production Connection</CardTitle>
+          <CardDescription>Verify connection to production database</CardDescription>
+        </CardHeader>
+        <CardContent>
+          <Button 
+            className="w-full"
+            onClick={handleTestConnection}
+            disabled={isTestingConnection || isAnyOperationRunning()}
+          >
+            {isTestingConnection ? (
+              <>
+                <Loader2 className="mr-2 h-4 w-4 animate-spin" />
+                Testing Connection...
+              </>
+            ) : (
+              <>
+                <Database className="mr-2 h-4 w-4" />
+                Test Production Connection
+              </>
+            )}
+          </Button>
+        </CardContent>
+      </Card>
+
       {/* Update CSV Card */}
       <Card>
         <CardHeader>