refactor: Integrate group health check logic into ServiceRow and ServiceGroupItem components, enhancing health status display and improving overall service monitoring capabilities

apps/web/src/components/services-board/service-group-item.tsx

@@ -80,6 +80,9 @@ export function ServiceGroupItem({
   const serviceIds = column.items.map((s) => s.id)
   const groupAllSelected = isAllSelected?.(serviceIds) ?? false
   const groupSomeSelected = isSomeSelected?.(serviceIds) ?? false
+  const groupHealthEnabled = Boolean(
+    column.group?.domain && column.group?.health_check_enabled && column.enabled,
+  )
 
   useEffect(() => {
     if (isOver && isDragging && !dragDisabled) {
@@ -138,6 +141,7 @@ export function ServiceGroupItem({
                       onSelectedChange={(selected) =>
                         onSelectedChange?.(service.id, selected)
                       }
+                      groupHealthEnabled={groupHealthEnabled}
                     />
                   </div>
                 ))}

apps/web/src/components/services-board/service-row.tsx

@@ -42,6 +42,7 @@ export interface ServiceRowProps {
   selected?: boolean
   onSelectedChange?: (selected: boolean) => void
   showCheckbox?: boolean
+  groupHealthEnabled?: boolean
 }
 
 export const ServiceRow = memo(function ServiceRow({
@@ -56,6 +57,7 @@ export const ServiceRow = memo(function ServiceRow({
   selected = false,
   onSelectedChange,
   showCheckbox = false,
+  groupHealthEnabled = false,
 }: ServiceRowProps) {
   const {
     attributes,
@@ -159,7 +161,11 @@ export const ServiceRow = memo(function ServiceRow({
 
       <div className="flex shrink-0 items-center gap-2">
         {healthBindings.map((binding) => (
-          <BindingHealthBadge key={binding.binding_id} binding={binding} />
+          <BindingHealthBadge
+            key={binding.binding_id}
+            binding={binding}
+            groupHealthEnabled={groupHealthEnabled}
+          />
         ))}
         {syncStatus ? <StatusBadge status={syncStatus} /> : null}
         {isToggling ? (
@@ -207,8 +213,14 @@ export const ServiceRow = memo(function ServiceRow({
   )
 })
 
-function BindingHealthBadge({ binding }: { binding: ServiceDomainBinding }) {
-  const enabled = Boolean(binding.health_check_enabled)
+function BindingHealthBadge({
+  binding,
+  groupHealthEnabled,
+}: {
+  binding: ServiceDomainBinding
+  groupHealthEnabled: boolean
+}) {
+  const enabled = Boolean(binding.health_check_enabled) || groupHealthEnabled
   const { data: health } = useAggregatedHealth(
     'binding',
     binding.binding_id,