feat(kafka): show Hadoop (HDFS3) sink connector in Kafka Connect panel

ui/src/components/features/SparkKafkaPanel.tsx

@@ -228,7 +228,7 @@ export function SparkKafkaPanel({
             </div>
 
             <div>
-              <p className="mb-1 text-[9px] font-semibold uppercase tracking-wide text-foreground-muted">Debezium connectors</p>
+              <p className="mb-1 text-[9px] font-semibold uppercase tracking-wide text-foreground-muted">Kafka Connect connectors</p>
               <div className="space-y-1">
                 {(kafka?.connectors ?? []).map((c) => {
                   const running = (c.state || '').toUpperCase() === 'RUNNING'
@@ -236,6 +236,7 @@ export function SparkKafkaPanel({
                   return (
                     <div key={c.name} className="flex flex-wrap items-center gap-2 rounded border border-border bg-surface-overlay/30 px-2 py-1.5">
                       <span className="min-w-0 flex-1 truncate font-mono text-[10px] text-foreground">{c.name}</span>
+                      {/hdfs/i.test(c.name) && (<span className="rounded bg-orange-500/20 px-1 py-0.5 text-[8px] font-semibold text-orange-200">Hadoop sink</span>)}
                       <span className={cn('text-[9px] font-medium', running ? 'text-emerald-300' : 'text-amber-300')}>{c.state}</span>
                       <button type="button" disabled={!!busy} onClick={() => onConnector(c.name, 'restart')} className="inline-flex items-center gap-0.5 rounded border border-border px-1.5 py-0.5 text-[8px] hover:bg-surface-overlay disabled:opacity-50">
                         {b ? <Loader2 className="h-2.5 w-2.5 animate-spin" /> : <RotateCcw className="h-2.5 w-2.5" />} Restart