From 2dcae5aae631e7f8fe7899a2637c2b175d3d6597 Mon Sep 17 00:00:00 2001
From: Mike Fortman <michael.fortman@datastax.com>
Date: Thu, 9 Oct 2025 13:19:24 -0500
Subject: [PATCH 1/2] Add docling banner to onboarding

---
 frontend/src/app/onboarding/page.tsx | 3 +++
 1 file changed, 3 insertions(+)

diff --git a/frontend/src/app/onboarding/page.tsx b/frontend/src/app/onboarding/page.tsx
index ca938eeb..af85beae 100644
--- a/frontend/src/app/onboarding/page.tsx
+++ b/frontend/src/app/onboarding/page.tsx
@@ -7,6 +7,7 @@ import {
   type OnboardingVariables,
   useOnboardingMutation,
 } from "@/app/api/mutations/useOnboardingMutation";
+import { DoclingHealthBanner } 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";
@@ -130,6 +131,8 @@ function OnboardingPage() {
         )}
       />
 
+      <DoclingHealthBanner className="absolute top-0 left-0 right-0 w-full z-20" />
+
       <div className="flex flex-col items-center gap-5 min-h-[550px] w-full z-10">
         <div className="flex flex-col items-center justify-center gap-4">
           <h1 className="text-2xl font-medium font-chivo">

From 02989722d7621baec2ccbf80e5b4cd9720c79fa5 Mon Sep 17 00:00:00 2001
From: Mike Fortman <michael.fortman@datastax.com>
Date: Thu, 9 Oct 2025 13:48:33 -0500
Subject: [PATCH 2/2] add tooltip and docling check to disable button

---
 frontend/components/docling-health-banner.tsx | 17 +++++++++++++++--
 frontend/src/app/onboarding/page.tsx          |  9 ++++++---
 2 files changed, 21 insertions(+), 5 deletions(-)

diff --git a/frontend/components/docling-health-banner.tsx b/frontend/components/docling-health-banner.tsx
index afa79deb..673d952d 100644
--- a/frontend/components/docling-health-banner.tsx
+++ b/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;
diff --git a/frontend/src/app/onboarding/page.tsx b/frontend/src/app/onboarding/page.tsx
index af85beae..094349c7 100644
--- a/frontend/src/app/onboarding/page.tsx
+++ b/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>