add tooltip and docling check to disable button

frontend/components/docling-health-banner.tsx

@@ -86,13 +86,26 @@ function DoclingSetupDialog({
   );
 }
 
-export function DoclingHealthBanner({ className }: DoclingHealthBannerProps) {
+// Custom hook to check docling health status
+export function useDoclingHealth() {
   const { data: health, isLoading, isError } = useDoclingHealthQuery();
-  const [showDialog, setShowDialog] = useState(false);
 
   const isHealthy = health?.status === "healthy" && !isError;
   const isUnhealthy = health?.status === "unhealthy" || isError;
 
+  return {
+    health,
+    isLoading,
+    isError,
+    isHealthy,
+    isUnhealthy,
+  };
+}
+
+export function DoclingHealthBanner({ className }: DoclingHealthBannerProps) {
+  const { isLoading, isHealthy, isUnhealthy } = useDoclingHealth();
+  const [showDialog, setShowDialog] = useState(false);
+
   // Only show banner when service is unhealthy
   if (isLoading || isHealthy) {
     return null;

frontend/src/app/onboarding/page.tsx

@@ -7,7 +7,7 @@ import {
   type OnboardingVariables,
   useOnboardingMutation,
 } from "@/app/api/mutations/useOnboardingMutation";
-import { DoclingHealthBanner } from "@/components/docling-health-banner";
+import { DoclingHealthBanner, useDoclingHealth } from "@/components/docling-health-banner";
 import IBMLogo from "@/components/logo/ibm-logo";
 import OllamaLogo from "@/components/logo/ollama-logo";
 import OpenAILogo from "@/components/logo/openai-logo";
@@ -35,6 +35,7 @@ import { OpenAIOnboarding } from "./components/openai-onboarding";
 function OnboardingPage() {
   const { data: settingsDb, isLoading: isSettingsLoading } =
     useGetSettingsQuery();
+  const { isHealthy: isDoclingHealthy } = useDoclingHealth();
 
   const redirect = "/";
 
@@ -115,7 +116,7 @@ function OnboardingPage() {
     onboardingMutation.mutate(onboardingData);
   };
 
-  const isComplete = !!settings.llm_model && !!settings.embedding_model;
+  const isComplete = !!settings.llm_model && !!settings.embedding_model && isDoclingHealthy;
 
   return (
     <div className="min-h-dvh w-full flex gap-5 flex-col items-center justify-center bg-background relative p-4">
@@ -200,7 +201,9 @@ function OnboardingPage() {
               </TooltipTrigger>
               {!isComplete && (
                 <TooltipContent>
-                  Please fill in all required fields
+                  {!!settings.llm_model && !!settings.embedding_model && !isDoclingHealthy
+                    ? "docling-serve must be running to continue"
+                    : "Please fill in all required fields"}
                 </TooltipContent>
               )}
             </Tooltip>