{ "$schema": "https://uipkge.dev/schema/registry-item.json", "name": "stream-processing-flink-topology", "title": "Stream Processing Flink Topology", "type": "registry:block", "files": [ { "path": "packages/registry-angular/blocks/stream-processing-flink-topology/stream-processing-flink-topology.component.ts", "content": "// Apache Flink & RisingWave stateful streaming graph: real-time DAG topology, window\n// throughput, checkpointing duration, RocksDB state inspector, and backpressure heat\n// monitor. Port of the React block 1:1.\nimport { ChangeDetectionStrategy, Component, Input, computed, signal } from '@angular/core'\nimport {\n AlertTriangle,\n ArrowRight,\n Camera,\n Check,\n CheckCircle2,\n Clock,\n Copy,\n Cpu,\n Database,\n Loader2,\n LucideAngularModule,\n Radio,\n Square,\n Workflow,\n} from 'lucide-angular'\nimport { cn } from '@/lib/utils'\nimport { UiBadgeComponent } from '@/ui/badge/badge.component'\nimport { UiButtonComponent } from '@/ui/button/button.component'\nimport {\n UiCardComponent,\n UiCardContentComponent,\n UiCardDescriptionComponent,\n UiCardHeaderComponent,\n UiCardTitleComponent,\n} from '@/ui/card/card.component'\nimport { UiStreamOperatorDetailComponent } from './stream-operator-detail.component'\nimport { UiStreamTopologyTelemetryComponent } from './stream-topology-telemetry.component'\nimport type { FlinkOperatorNode, FlinkSubtask } from './stream-topology-types'\nimport { defaultFlinkOperators } from './stream-topology-data'\n\nexport type { FlinkOperatorNode, FlinkSubtask }\n\n@Component({\n changeDetection: ChangeDetectionStrategy.Eager,\n selector: 'ui-stream-processing-flink-topology, [ui-stream-processing-flink-topology]',\n standalone: true,\n // React renders the root
itself: the host stays out of layout and `class` goes to the root.\n host: { '[attr.class]': '\"contents\"' },\n imports: [\n LucideAngularModule,\n UiBadgeComponent,\n UiButtonComponent,\n UiCardComponent,\n UiCardContentComponent,\n UiCardDescriptionComponent,\n UiCardHeaderComponent,\n UiCardTitleComponent,\n UiStreamOperatorDetailComponent,\n UiStreamTopologyTelemetryComponent,\n ],\n template: `\n
\n \n
\n
\n
\n \n \n
\n
\n

\n realtime-fraud-scoring-pipeline\n

\n Flink 1.19 on Kubernetes\n
\n \n \n \n \n \n Job Running · Checkpointing Healthy\n \n
\n

\n Checkpoint Interval: Every 10s · RocksDB StateBackend · SLA Target: < 50ms Lag · Job ID: flink_job_992014\n

\n
\n\n \n
\n \n @if (isTriggeringSavepoint()) {\n \n } @else {\n \n }\n {{ isTriggeringSavepoint() ? 'Creating Savepoint...' : 'Trigger Savepoint' }}\n \n\n \n @if (isCanceling()) {\n \n } @else {\n \n }\n {{ isCanceling() ? 'Canceling with Savepoint...' : 'Cancel Job with Savepoint' }}\n \n
\n
\n\n \n @if (savepointNotice(); as notice) {\n \n
\n \n
\n Savepoint completed successfully:\n {{ notice }}\n
\n
\n \n @if (copiedKey() === 'savepoint') {\n \n } @else {\n \n }\n {{ copiedKey() === 'savepoint' ? 'Copied' : 'Copy URI' }}\n \n
\n }\n\n \n @if (cancelConfirmed()) {\n \n
\n \n
\n Graceful Job Drain Initiated:\n Stopping topology sources and committing final RocksDB savepoint to S3 storage.\n
\n
\n Drain Status: 100%\n \n }\n\n \n \n\n \n
\n
\n
\n
\n
\n

Streaming Execution Topology DAG

\n 4 Stateful Operators\n
\n

\n Live dataflow graph with event-time watermarking, state sizes, and backpressure telemetry. Click any\n operator to inspect metrics and subtasks.\n

\n
\n
\n \n \n Backpressure Heat: 0.0% (Green)\n
\n \n \n Total Managed State: 57.0 MB\n
\n
\n
\n \n\n
\n
\n \n
\n \n \n
\n
\n
\n \n \n
\n SOURCE\n
\n p=8\n
\n\n
\n
Kafka Ingestion Source
\n

42.5k rec/s · Backpressure: 0%

\n
\n\n
\n
\n Throughput:\n 8.4 MB/s\n
\n
\n State Size:\n 0 MB (Stateless)\n
\n
\n
\n\n
\n events.fraud.transactions\n \n
\n
\n\n \n \n
\n
\n
\n \n \n
\n WINDOW\n
\n p=16\n
\n\n
\n
Keyed Sliding Window
\n

5-min window, 10s slide · 12,400 keys

\n
\n\n
\n
\n Output Rate:\n 38.2k rec/s\n
\n
\n RocksDB State:\n 18.4 MB\n
\n
\n
\n\n
\n Cardholder Velocity Agg\n \n
\n \n\n \n \n
\n
\n
\n \n \n
\n CEP & ML\n
\n p=16\n
\n\n
\n
ML Fraud Scoring Matcher
\n

Inference: 1.2ms · RocksDB: 38.2 MB

\n
\n\n
\n
\n ONNX Inference:\n p99 < 1.2ms\n
\n
\n Managed State:\n 38.2 MB\n
\n
\n \n\n
\n xgboost_v4.onnx\n \n
\n \n\n \n \n
\n
\n
\n \n \n
\n SINK\n
\n p=8\n
\n\n
\n
Sink: Alert Dispatcher
\n

Redis Cache & Webhooks · 42.5k rec/s

\n
\n\n
\n
\n Semantics:\n 2PC Exactly-Once\n
\n
\n Fan-Out:\n 42.5k rec/s\n
\n
\n \n\n
\n redis:6379 + alerts.queue\n \n
\n \n \n \n \n \n\n \n \n \n `,\n})\nexport class UiStreamProcessingFlinkTopologyComponent {\n protected readonly AlertTriangle = AlertTriangle\n protected readonly ArrowRight = ArrowRight\n protected readonly Camera = Camera\n protected readonly Check = Check\n protected readonly CheckCircle2 = CheckCircle2\n protected readonly Clock = Clock\n protected readonly Copy = Copy\n protected readonly Cpu = Cpu\n protected readonly Database = Database\n protected readonly Loader2 = Loader2\n protected readonly Radio = Radio\n protected readonly Square = Square\n protected readonly Workflow = Workflow\n\n @Input() operators: FlinkOperatorNode[] = defaultFlinkOperators\n @Input('class') className?: string\n\n readonly selectedOperatorId = signal('op-ml-scoring')\n readonly isTriggeringSavepoint = signal(false)\n readonly savepointNotice = signal(null)\n readonly isCanceling = signal(false)\n readonly cancelConfirmed = signal(false)\n readonly copiedKey = signal(null)\n\n readonly selectedOperator = computed(() => {\n return this.operators.find((op) => op.id === this.selectedOperatorId()) ?? this.operators[0]!\n })\n\n get rootClass(): string {\n return cn('w-full space-y-6', this.className)\n }\n\n nodeClass(id: string): string {\n return cn(\n 'group focus-visible:ring-ring relative flex cursor-pointer flex-col justify-between rounded-xl border p-4 transition-colors duration-200 focus-visible:ring-2 focus-visible:outline-none',\n this.selectedOperatorId() === id\n ? 'border-primary bg-primary/[0.04] ring-primary/30 shadow-xs ring-2'\n : 'border-border bg-card hover:border-primary/50 hover:bg-muted/30',\n )\n }\n\n selectOperator(id: string): void {\n this.selectedOperatorId.set(id)\n }\n\n handleTriggerSavepoint(): void {\n if (this.isTriggeringSavepoint()) return\n this.isTriggeringSavepoint.set(true)\n this.savepointNotice.set(null)\n setTimeout(() => {\n this.isTriggeringSavepoint.set(false)\n this.savepointNotice.set('s3://flink-savepoints/prod/savepoint-fraud-90412-20260821-143245/')\n setTimeout(() => {\n if (this.savepointNotice()?.includes('savepoint-fraud-90412')) this.savepointNotice.set(null)\n }, 6500)\n }, 1800)\n }\n\n handleCancelJob(): void {\n if (this.isCanceling()) return\n this.isCanceling.set(true)\n setTimeout(() => {\n this.isCanceling.set(false)\n this.cancelConfirmed.set(true)\n setTimeout(() => {\n this.cancelConfirmed.set(false)\n }, 4500)\n }, 2000)\n }\n\n copyText(key: string, value: string): void {\n try {\n if (typeof navigator !== 'undefined' && navigator.clipboard) {\n void navigator.clipboard.writeText(value)\n this.copiedKey.set(key)\n setTimeout(() => {\n if (this.copiedKey() === key) this.copiedKey.set(null)\n }, 2000)\n }\n } catch {\n // Clipboard fallback\n }\n }\n}\n", "type": "registry:block", "target": "~/src/app/components/blocks/stream-processing-flink-topology/stream-processing-flink-topology.component.ts" }, { "path": "packages/registry-angular/blocks/stream-processing-flink-topology/stream-operator-detail.component.ts", "content": "// Operator detailed performance and state inspector panel: subtask distribution table,\n// RocksDB managed state, JVM and GC telemetry, and runtime configuration parameters.\n// Port of the Vue/React operator detail panel 1:1.\nimport { ChangeDetectionStrategy, Component, EventEmitter, Input, Output, signal } from '@angular/core'\nimport { Activity, Check, Copy, LucideAngularModule, Server, ShieldCheck } from 'lucide-angular'\nimport { cn } from '@/lib/utils'\nimport { UiBadgeComponent } from '@/ui/badge/badge.component'\nimport { UiButtonComponent } from '@/ui/button/button.component'\nimport {\n UiCardComponent,\n UiCardContentComponent,\n UiCardDescriptionComponent,\n UiCardHeaderComponent,\n UiCardTitleComponent,\n} from '@/ui/card/card.component'\nimport { UiProgressComponent } from '@/ui/progress/progress.component'\nimport { UiSeparatorComponent } from '@/ui/separator/separator.component'\nimport {\n UiTableBodyComponent,\n UiTableCellComponent,\n UiTableComponent,\n UiTableHeadComponent,\n UiTableHeaderComponent,\n UiTableRowComponent,\n} from '@/ui/table/table.component'\nimport type { FlinkOperatorNode } from './stream-topology-types'\n\nexport type InspectorTab = 'subtasks' | 'state' | 'resources' | 'config'\n\n@Component({\n changeDetection: ChangeDetectionStrategy.Eager,\n selector: 'ui-stream-operator-detail, [ui-stream-operator-detail]',\n standalone: true,\n host: { '[attr.class]': '\"contents\"' },\n imports: [\n LucideAngularModule,\n UiBadgeComponent,\n UiButtonComponent,\n UiCardComponent,\n UiCardContentComponent,\n UiCardDescriptionComponent,\n UiCardHeaderComponent,\n UiCardTitleComponent,\n UiProgressComponent,\n UiSeparatorComponent,\n UiTableBodyComponent,\n UiTableCellComponent,\n UiTableComponent,\n UiTableHeadComponent,\n UiTableHeaderComponent,\n UiTableRowComponent,\n ],\n template: `\n
\n
\n
\n
\n
\n

{{ operator.name }}

\n \n \n {{ operator.status }}\n \n \n Parallelism: {{ operator.parallelism }} subtasks\n \n
\n

{{ operator.description }}

\n
\n\n \n
\n \n \n \n \n
\n
\n
\n\n \n
\n
\n
Input Rate
\n
\n {{ operator.inputRecordsRate }}\n
\n
{{ operator.inputBytesRate }}
\n
\n
\n
Output Rate
\n
\n {{ operator.outputRecordsRate }}\n
\n
{{ operator.outputBytesRate }}
\n
\n
\n
Managed State
\n
\n {{ operator.managedStateSize }}\n
\n
{{ operator.stateBackend }}
\n
\n
\n
Watermark Lag
\n
\n {{ operator.watermarkLag }}\n
\n
Event Time OK
\n
\n
\n
CPU Core Load
\n
{{ operator.cpuPeak }}
\n
Across {{ operator.parallelism }} cores
\n
\n
\n
GC Pause Time
\n
{{ operator.gcTime }}
\n
G1 Garbage Collector
\n
\n
\n\n
\n \n @if (activeInspectorTab() === 'subtasks') {\n
\n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n @for (subtask of operator.subtasks; track subtask.id) {\n \n \n \n \n {{ subtask.inRate }}\n \n \n {{ subtask.outRate }}\n \n \n \n \n {{ subtask.watermarkLag }}\n \n \n \n \n }\n \n
Subtask IndexHost / PodInput RateOutput RateCPU %Heap UsageWatermark LagCheckpoint AckStatus
\n
\n \n Subtask #{{ subtask.id }}\n
\n 		{{ subtask.host }}\n {{ subtask.cpu }}\n \n {{ subtask.heapMemory }}\n \n {{ subtask.checkpointAckMs }}ms\n \n {{ subtask.status }}\n
\n
\n } @else if (activeInspectorTab() === 'state') {\n \n
\n
\n
\n
State Backend Engine
\n
{{ operator.stateBackend }}
\n

\n Off-heap SSD persistence with block caching and incremental checkpoints\n

\n
\n
\n
Total Live State Size
\n
{{ operator.managedStateSize }}
\n

Incremental checkpoint delta: ~2.4 MB / snapshot

\n
\n
\n
Key Eviction & TTL
\n
10-min Sliding TTL
\n

\n Automatic compaction filter evicts expired cardholder keys on disk\n

\n
\n
\n\n \n
\n

RocksDB Native Engine Statistics

\n
\n
\n Block Cache Hit Ratio:\n
99.42% (512 MB cache)
\n
\n
\n MemTable Flush Rate:\n
14.2 MB/min
\n
\n
\n SST Files Count:\n
128 active SSTs
\n
\n
\n Level-0 Compaction Stall:\n
0.0ms (No stalls)
\n
\n
\n
\n
\n } @else if (activeInspectorTab() === 'resources') {\n \n
\n
\n
\n
\n JVM Heap Memory Utilization\n {{ operator.heapMemory }} / 4,096 MB\n
\n \n
\n Survivor: 64 MB\n Tenured / Old: 348 MB\n
\n
\n\n
\n
\n Managed Off-Heap & Native Memory\n {{ operator.managedMemory }} Allocated\n
\n \n
\n RocksDB Cache: 512 MB\n Network Buffers: 256 MB\n
\n
\n
\n\n
\n
Garbage Collection Profile
\n

\n Collector: Garbage-First (G1) GC · Max Pause Target: 20ms · Current Observed Pause:\n {{ operator.gcTime }}\n

\n
\n
\n } @else {\n \n
\n
\n \n Runtime Operator Configuration\n {{ operator.operatorClass }}\n
\n
\n @for (entry of configEntries(); track entry.key) {\n \n {{ entry.key }}\n
\n {{ entry.value }}\n \n @if (copiedKey === entry.key) {\n \n } @else {\n \n }\n \n
\n
\n }\n
\n
\n
\n }\n \n\n \n \n
\n
\n \n Pipeline Ingestion:\n 42,500 records/sec (8.4 MB/s)\n
\n\n \n\n
\n \n TaskManagers:\n 8 Kubernetes Pods\n
\n\n \n\n
\n \n State Consistency:\n Exactly-Once (2PC)\n
\n
\n\n
\n \n Watermark Alignment: 42ms · Checkpoint #1,420 OK\n
\n \n \n `,\n})\nexport class UiStreamOperatorDetailComponent {\n protected readonly Activity = Activity\n protected readonly Check = Check\n protected readonly Copy = Copy\n protected readonly Server = Server\n protected readonly ShieldCheck = ShieldCheck\n\n @Input({ required: true }) operator!: FlinkOperatorNode\n @Input() copiedKey: string | null = null\n @Output() copy = new EventEmitter<{ key: string; value: string }>()\n\n readonly activeInspectorTab = signal('subtasks')\n\n tabClass(tab: InspectorTab): string {\n return cn(\n 'focus-visible:ring-ring rounded-md px-2.5 py-1 text-xs font-medium transition-colors focus-visible:ring-2 focus-visible:outline-none',\n this.activeInspectorTab() === tab\n ? 'bg-card text-foreground font-semibold shadow-xs'\n : 'text-muted-foreground hover:text-foreground',\n )\n }\n\n configEntries(): { key: string; value: string }[] {\n return Object.entries(this.operator.config ?? {}).map(([key, value]) => ({ key, value }))\n }\n}\n", "type": "registry:block", "target": "~/src/app/components/blocks/stream-processing-flink-topology/stream-operator-detail.component.ts" }, { "path": "packages/registry-angular/blocks/stream-processing-flink-topology/stream-topology-telemetry.component.ts", "content": "// Real-time stream telemetry KPI cards: ingestion throughput, checkpoint duration,\n// watermark alignment latency, and backpressure heat. Port of the Vue/React telemetry\n// card grid 1:1.\nimport { ChangeDetectionStrategy, Component, Input } from '@angular/core'\nimport { Activity, Clock, Flame, LucideAngularModule, Zap } from 'lucide-angular'\nimport { cn } from '@/lib/utils'\nimport { UiBadgeComponent } from '@/ui/badge/badge.component'\nimport {\n UiCardComponent,\n UiCardContentComponent,\n UiCardHeaderComponent,\n UiCardTitleComponent,\n} from '@/ui/card/card.component'\nimport { UiProgressComponent } from '@/ui/progress/progress.component'\n\n@Component({\n changeDetection: ChangeDetectionStrategy.Eager,\n selector: 'ui-stream-topology-telemetry, [ui-stream-topology-telemetry]',\n standalone: true,\n host: { '[attr.class]': '\"contents\"' },\n imports: [\n LucideAngularModule,\n UiBadgeComponent,\n UiCardComponent,\n UiCardContentComponent,\n UiCardHeaderComponent,\n UiCardTitleComponent,\n UiProgressComponent,\n ],\n template: `\n
\n \n
\n
\n
\n
\n \n \n
\n

Current Ingestion Throughput

\n
\n +4.2% 10m\n
\n
\n
\n
\n
\n 42,500 records/sec\n
\n

8.4 MB/s ingress bandwidth

\n
\n
\n
\n Ingress Capacity\n 68% allocated\n
\n \n
\n
\n
\n\n \n
\n
\n
\n
\n \n \n
\n

Checkpoint Duration

\n
\n 100% Succeeded\n
\n
\n
\n
\n
185ms duration
\n

42 MB state size · Checkpoint #1,420

\n
\n
\n
\n SLA Budget (1,000ms)\n 18.5% of interval\n
\n \n
\n
\n \n\n \n
\n
\n
\n
\n \n \n
\n

Watermark Alignment

\n
\n Event Time\n
\n
\n
\n
\n
Lag: 42ms
\n

Event Time Alignment · 0 Late Drops

\n
\n
\n
\n Skew Drift\n Max 12ms cross-partition\n
\n \n
\n
\n \n\n \n
\n
\n
\n
\n \n \n
\n

Max Backpressure Heat

\n
\n Low Risk\n
\n
\n
\n
\n
\n 0.0% Backpressure\n
\n

All 4 operators running at nominal load

\n
\n
\n
\n Choked Subtasks\n 0 / 48 active\n
\n \n
\n
\n \n \n `,\n})\nexport class UiStreamTopologyTelemetryComponent {\n protected readonly Activity = Activity\n protected readonly Clock = Clock\n protected readonly Flame = Flame\n protected readonly Zap = Zap\n\n @Input('class') className?: string\n\n get rootClass(): string {\n return cn('grid grid-cols-1 gap-4 sm:grid-cols-2 lg:grid-cols-4', this.className)\n }\n}\n", "type": "registry:block", "target": "~/src/app/components/blocks/stream-processing-flink-topology/stream-topology-telemetry.component.ts" }, { "path": "packages/registry-angular/blocks/stream-processing-flink-topology/stream-topology-types.ts", "content": "export interface FlinkSubtask {\n id: number\n host: string\n status: 'RUNNING' | 'DEPLOYING' | 'RECONCILING'\n inRate: string\n outRate: string\n cpu: string\n heapMemory: string\n backpressure: number\n watermarkLag: string\n checkpointAckMs: number\n}\n\nexport interface FlinkOperatorNode {\n id: string\n name: string\n shortTitle: string\n stageNumber: number\n category: 'source' | 'window' | 'inference' | 'sink'\n operatorClass: string\n parallelism: number\n status: 'RUNNING' | 'CANCELED' | 'FAILING'\n backpressure: number\n inputRecordsRate: string\n inputBytesRate: string\n outputRecordsRate: string\n outputBytesRate: string\n totalRecordsIn: number\n totalRecordsOut: number\n managedStateSize: string\n stateBackend: string\n heapMemory: string\n managedMemory: string\n gcTime: string\n cpuPeak: string\n watermarkLag: string\n currentWatermark: string\n description: string\n config: Record\n subtasks: FlinkSubtask[]\n}\n", "type": "registry:block", "target": "~/src/app/components/blocks/stream-processing-flink-topology/stream-topology-types.ts" }, { "path": "packages/registry-angular/blocks/stream-processing-flink-topology/stream-topology-data.ts", "content": "import type { FlinkOperatorNode } from './stream-topology-types'\n\nexport const defaultFlinkOperators: FlinkOperatorNode[] = [\n {\n id: 'op-kafka-source',\n name: 'Source: Kafka Ingestion (events.fraud.transactions)',\n shortTitle: 'Kafka Ingestion Source',\n stageNumber: 1,\n category: 'source',\n operatorClass: 'org.apache.flink.connector.kafka.source.KafkaSource',\n parallelism: 8,\n status: 'RUNNING',\n backpressure: 0.0,\n inputRecordsRate: '42,500 rec/s',\n inputBytesRate: '8.4 MB/s',\n outputRecordsRate: '42,500 rec/s',\n outputBytesRate: '8.4 MB/s',\n totalRecordsIn: 184290410,\n totalRecordsOut: 184290410,\n managedStateSize: '0 MB (Stateless)',\n stateBackend: 'None (Stateless Source)',\n heapMemory: '412 MB',\n managedMemory: '0 MB',\n gcTime: '0.8 ms/min',\n cpuPeak: '14%',\n watermarkLag: '28ms',\n currentWatermark: '2026-08-21 14:32:45.892 UTC',\n description:\n 'Consumes high-throughput payment transaction stream with snappy decompression and bounded out-of-orderness watermark generation.',\n config: {\n topic: 'events.fraud.transactions',\n 'consumer.group.id': 'flink-fraud-scoring-v2',\n 'scan.startup.mode': 'latest-offset',\n 'watermark.strategy': 'BoundedOutOfOrderness(Duration.ofMillis(200))',\n 'partition.discovery.interval.ms': '30000',\n 'deserializer.format': 'AvroConfluentSchemaRegistry',\n },\n subtasks: [\n {\n id: 0,\n host: 'taskmanager-pod-0.k8s',\n status: 'RUNNING',\n inRate: '5,320 rec/s',\n outRate: '5,320 rec/s',\n cpu: '14%',\n heapMemory: '52 MB',\n backpressure: 0.0,\n watermarkLag: '22ms',\n checkpointAckMs: 42,\n },\n {\n id: 1,\n host: 'taskmanager-pod-0.k8s',\n status: 'RUNNING',\n inRate: '5,310 rec/s',\n outRate: '5,310 rec/s',\n cpu: '13%',\n heapMemory: '51 MB',\n backpressure: 0.0,\n watermarkLag: '24ms',\n checkpointAckMs: 44,\n },\n {\n id: 2,\n host: 'taskmanager-pod-1.k8s',\n status: 'RUNNING',\n inRate: '5,315 rec/s',\n outRate: '5,315 rec/s',\n cpu: '15%',\n heapMemory: '53 MB',\n backpressure: 0.0,\n watermarkLag: '26ms',\n checkpointAckMs: 41,\n },\n {\n id: 3,\n host: 'taskmanager-pod-1.k8s',\n status: 'RUNNING',\n inRate: '5,305 rec/s',\n outRate: '5,305 rec/s',\n cpu: '14%',\n heapMemory: '50 MB',\n backpressure: 0.0,\n watermarkLag: '23ms',\n checkpointAckMs: 45,\n },\n {\n id: 4,\n host: 'taskmanager-pod-2.k8s',\n status: 'RUNNING',\n inRate: '5,325 rec/s',\n outRate: '5,325 rec/s',\n cpu: '14%',\n heapMemory: '52 MB',\n backpressure: 0.0,\n watermarkLag: '25ms',\n checkpointAckMs: 40,\n },\n {\n id: 5,\n host: 'taskmanager-pod-2.k8s',\n status: 'RUNNING',\n inRate: '5,310 rec/s',\n outRate: '5,310 rec/s',\n cpu: '13%',\n heapMemory: '51 MB',\n backpressure: 0.0,\n watermarkLag: '24ms',\n checkpointAckMs: 43,\n },\n {\n id: 6,\n host: 'taskmanager-pod-3.k8s',\n status: 'RUNNING',\n inRate: '5,308 rec/s',\n outRate: '5,308 rec/s',\n cpu: '15%',\n heapMemory: '52 MB',\n backpressure: 0.0,\n watermarkLag: '28ms',\n checkpointAckMs: 42,\n },\n {\n id: 7,\n host: 'taskmanager-pod-3.k8s',\n status: 'RUNNING',\n inRate: '5,307 rec/s',\n outRate: '5,307 rec/s',\n cpu: '14%',\n heapMemory: '51 MB',\n backpressure: 0.0,\n watermarkLag: '25ms',\n checkpointAckMs: 43,\n },\n ],\n },\n {\n id: 'op-keyed-window',\n name: 'Keyed Sliding Window (5-min window, 10s slide)',\n shortTitle: 'Keyed Sliding Window',\n stageNumber: 2,\n category: 'window',\n operatorClass: 'org.apache.flink.streaming.runtime.operators.windowing.WindowOperator',\n parallelism: 16,\n status: 'RUNNING',\n backpressure: 0.0,\n inputRecordsRate: '42,500 rec/s',\n inputBytesRate: '8.4 MB/s',\n outputRecordsRate: '38,200 rec/s',\n outputBytesRate: '6.9 MB/s',\n totalRecordsIn: 184290410,\n totalRecordsOut: 165861369,\n managedStateSize: '18.4 MB (RocksDB)',\n stateBackend: 'EmbeddedRocksDBStateBackend',\n heapMemory: '780 MB',\n managedMemory: '1,024 MB',\n gcTime: '1.2 ms/min',\n cpuPeak: '28%',\n watermarkLag: '34ms',\n currentWatermark: '2026-08-21 14:32:45.886 UTC',\n description:\n 'Aggregates velocity, cumulative transaction volumes, and rapid card-testing frequency per cardholder ID across 5m windows triggered every 10s.',\n config: {\n 'window.assigner': 'SlidingEventTimeWindows.of(Time.minutes(5), Time.seconds(10))',\n 'allowed.lateness': '0ms',\n 'state.backend.ttl': '600000ms (10m TTL)',\n 'state.active.cardholders': '12,400 keys in state',\n trigger: 'EventTimeTrigger.create()',\n evictor: 'TimeEvictor.of(Time.minutes(5))',\n },\n subtasks: [\n {\n id: 0,\n host: 'taskmanager-pod-0.k8s',\n status: 'RUNNING',\n inRate: '2,660 rec/s',\n outRate: '2,390 rec/s',\n cpu: '28%',\n heapMemory: '49 MB',\n backpressure: 0.0,\n watermarkLag: '32ms',\n checkpointAckMs: 65,\n },\n {\n id: 1,\n host: 'taskmanager-pod-0.k8s',\n status: 'RUNNING',\n inRate: '2,655 rec/s',\n outRate: '2,385 rec/s',\n cpu: '27%',\n heapMemory: '48 MB',\n backpressure: 0.0,\n watermarkLag: '34ms',\n checkpointAckMs: 68,\n },\n {\n id: 2,\n host: 'taskmanager-pod-1.k8s',\n status: 'RUNNING',\n inRate: '2,662 rec/s',\n outRate: '2,392 rec/s',\n cpu: '29%',\n heapMemory: '50 MB',\n backpressure: 0.0,\n watermarkLag: '33ms',\n checkpointAckMs: 64,\n },\n {\n id: 3,\n host: 'taskmanager-pod-1.k8s',\n status: 'RUNNING',\n inRate: '2,650 rec/s',\n outRate: '2,380 rec/s',\n cpu: '28%',\n heapMemory: '48 MB',\n backpressure: 0.0,\n watermarkLag: '35ms',\n checkpointAckMs: 66,\n },\n {\n id: 4,\n host: 'taskmanager-pod-2.k8s',\n status: 'RUNNING',\n inRate: '2,658 rec/s',\n outRate: '2,388 rec/s',\n cpu: '27%',\n heapMemory: '49 MB',\n backpressure: 0.0,\n watermarkLag: '34ms',\n checkpointAckMs: 65,\n },\n {\n id: 5,\n host: 'taskmanager-pod-2.k8s',\n status: 'RUNNING',\n inRate: '2,654 rec/s',\n outRate: '2,386 rec/s',\n cpu: '29%',\n heapMemory: '50 MB',\n backpressure: 0.0,\n watermarkLag: '33ms',\n checkpointAckMs: 67,\n },\n {\n id: 6,\n host: 'taskmanager-pod-3.k8s',\n status: 'RUNNING',\n inRate: '2,660 rec/s',\n outRate: '2,390 rec/s',\n cpu: '28%',\n heapMemory: '49 MB',\n backpressure: 0.0,\n watermarkLag: '35ms',\n checkpointAckMs: 66,\n },\n {\n id: 7,\n host: 'taskmanager-pod-3.k8s',\n status: 'RUNNING',\n inRate: '2,652 rec/s',\n outRate: '2,384 rec/s',\n cpu: '28%',\n heapMemory: '48 MB',\n backpressure: 0.0,\n watermarkLag: '34ms',\n checkpointAckMs: 64,\n },\n {\n id: 8,\n host: 'taskmanager-pod-4.k8s',\n status: 'RUNNING',\n inRate: '2,659 rec/s',\n outRate: '2,389 rec/s',\n cpu: '29%',\n heapMemory: '50 MB',\n backpressure: 0.0,\n watermarkLag: '33ms',\n checkpointAckMs: 65,\n },\n {\n id: 9,\n host: 'taskmanager-pod-4.k8s',\n status: 'RUNNING',\n inRate: '2,655 rec/s',\n outRate: '2,385 rec/s',\n cpu: '27%',\n heapMemory: '48 MB',\n backpressure: 0.0,\n watermarkLag: '36ms',\n checkpointAckMs: 68,\n },\n {\n id: 10,\n host: 'taskmanager-pod-5.k8s',\n status: 'RUNNING',\n inRate: '2,661 rec/s',\n outRate: '2,391 rec/s',\n cpu: '28%',\n heapMemory: '49 MB',\n backpressure: 0.0,\n watermarkLag: '34ms',\n checkpointAckMs: 63,\n },\n {\n id: 11,\n host: 'taskmanager-pod-5.k8s',\n status: 'RUNNING',\n inRate: '2,650 rec/s',\n outRate: '2,380 rec/s',\n cpu: '28%',\n heapMemory: '48 MB',\n backpressure: 0.0,\n watermarkLag: '35ms',\n checkpointAckMs: 66,\n },\n {\n id: 12,\n host: 'taskmanager-pod-6.k8s',\n status: 'RUNNING',\n inRate: '2,657 rec/s',\n outRate: '2,387 rec/s',\n cpu: '27%',\n heapMemory: '49 MB',\n backpressure: 0.0,\n watermarkLag: '33ms',\n checkpointAckMs: 67,\n },\n {\n id: 13,\n host: 'taskmanager-pod-6.k8s',\n status: 'RUNNING',\n inRate: '2,653 rec/s',\n outRate: '2,383 rec/s',\n cpu: '29%',\n heapMemory: '50 MB',\n backpressure: 0.0,\n watermarkLag: '34ms',\n checkpointAckMs: 65,\n },\n {\n id: 14,\n host: 'taskmanager-pod-7.k8s',\n status: 'RUNNING',\n inRate: '2,658 rec/s',\n outRate: '2,388 rec/s',\n cpu: '28%',\n heapMemory: '49 MB',\n backpressure: 0.0,\n watermarkLag: '35ms',\n checkpointAckMs: 66,\n },\n {\n id: 15,\n host: 'taskmanager-pod-7.k8s',\n status: 'RUNNING',\n inRate: '2,651 rec/s',\n outRate: '2,382 rec/s',\n cpu: '28%',\n heapMemory: '48 MB',\n backpressure: 0.0,\n watermarkLag: '34ms',\n checkpointAckMs: 64,\n },\n ],\n },\n {\n id: 'op-ml-scoring',\n name: 'ML Fraud Scoring Pattern Matcher (CEP + XGBoost ONNX)',\n shortTitle: 'ML Fraud Scoring Pattern Matcher',\n stageNumber: 3,\n category: 'inference',\n operatorClass: 'com.uipkge.fraud.engine.AsyncFraudScoringKeyedProcessFunction',\n parallelism: 16,\n status: 'RUNNING',\n backpressure: 0.0,\n inputRecordsRate: '38,200 rec/s',\n inputBytesRate: '6.9 MB/s',\n outputRecordsRate: '38,200 rec/s',\n outputBytesRate: '7.1 MB/s',\n totalRecordsIn: 165861369,\n totalRecordsOut: 165861369,\n managedStateSize: '38.2 MB (RocksDB)',\n stateBackend: 'EmbeddedRocksDBStateBackend',\n heapMemory: '1,420 MB',\n managedMemory: '2,048 MB',\n gcTime: '1.4 ms/min',\n cpuPeak: '38%',\n watermarkLag: '38ms',\n currentWatermark: '2026-08-21 14:32:45.882 UTC',\n description:\n 'Evaluates stateful complex event patterns (CEP) and executes low-latency XGBoost model scoring via embedded ONNX native runtime.',\n config: {\n 'model.runtime': 'ONNX Runtime 1.18 (AVX-512)',\n 'model.artifact': 's3://ml-models-registry/fraud/xgboost_v4_18.onnx',\n 'inference.latency.p99': '1.2ms',\n 'rocksdb.block.cache.size': '512 MB',\n 'rocksdb.compaction.style': 'LEVEL',\n 'alert.confidence.threshold': '0.85',\n },\n subtasks: [\n {\n id: 0,\n host: 'taskmanager-pod-0.k8s',\n status: 'RUNNING',\n inRate: '2,390 rec/s',\n outRate: '2,390 rec/s',\n cpu: '38%',\n heapMemory: '89 MB',\n backpressure: 0.0,\n watermarkLag: '37ms',\n checkpointAckMs: 110,\n },\n {\n id: 1,\n host: 'taskmanager-pod-0.k8s',\n status: 'RUNNING',\n inRate: '2,385 rec/s',\n outRate: '2,385 rec/s',\n cpu: '37%',\n heapMemory: '88 MB',\n backpressure: 0.0,\n watermarkLag: '38ms',\n checkpointAckMs: 114,\n },\n {\n id: 2,\n host: 'taskmanager-pod-1.k8s',\n status: 'RUNNING',\n inRate: '2,392 rec/s',\n outRate: '2,392 rec/s',\n cpu: '39%',\n heapMemory: '90 MB',\n backpressure: 0.0,\n watermarkLag: '36ms',\n checkpointAckMs: 108,\n },\n {\n id: 3,\n host: 'taskmanager-pod-1.k8s',\n status: 'RUNNING',\n inRate: '2,380 rec/s',\n outRate: '2,380 rec/s',\n cpu: '38%',\n heapMemory: '87 MB',\n backpressure: 0.0,\n watermarkLag: '39ms',\n checkpointAckMs: 112,\n },\n {\n id: 4,\n host: 'taskmanager-pod-2.k8s',\n status: 'RUNNING',\n inRate: '2,388 rec/s',\n outRate: '2,388 rec/s',\n cpu: '37%',\n heapMemory: '88 MB',\n backpressure: 0.0,\n watermarkLag: '38ms',\n checkpointAckMs: 111,\n },\n {\n id: 5,\n host: 'taskmanager-pod-2.k8s',\n status: 'RUNNING',\n inRate: '2,386 rec/s',\n outRate: '2,386 rec/s',\n cpu: '39%',\n heapMemory: '90 MB',\n backpressure: 0.0,\n watermarkLag: '37ms',\n checkpointAckMs: 115,\n },\n {\n id: 6,\n host: 'taskmanager-pod-3.k8s',\n status: 'RUNNING',\n inRate: '2,390 rec/s',\n outRate: '2,390 rec/s',\n cpu: '38%',\n heapMemory: '89 MB',\n backpressure: 0.0,\n watermarkLag: '39ms',\n checkpointAckMs: 110,\n },\n {\n id: 7,\n host: 'taskmanager-pod-3.k8s',\n status: 'RUNNING',\n inRate: '2,384 rec/s',\n outRate: '2,384 rec/s',\n cpu: '37%',\n heapMemory: '87 MB',\n backpressure: 0.0,\n watermarkLag: '38ms',\n checkpointAckMs: 112,\n },\n {\n id: 8,\n host: 'taskmanager-pod-4.k8s',\n status: 'RUNNING',\n inRate: '2,389 rec/s',\n outRate: '2,389 rec/s',\n cpu: '38%',\n heapMemory: '89 MB',\n backpressure: 0.0,\n watermarkLag: '37ms',\n checkpointAckMs: 109,\n },\n {\n id: 9,\n host: 'taskmanager-pod-4.k8s',\n status: 'RUNNING',\n inRate: '2,385 rec/s',\n outRate: '2,385 rec/s',\n cpu: '37%',\n heapMemory: '88 MB',\n backpressure: 0.0,\n watermarkLag: '39ms',\n checkpointAckMs: 113,\n },\n {\n id: 10,\n host: 'taskmanager-pod-5.k8s',\n status: 'RUNNING',\n inRate: '2,391 rec/s',\n outRate: '2,391 rec/s',\n cpu: '39%',\n heapMemory: '90 MB',\n backpressure: 0.0,\n watermarkLag: '37ms',\n checkpointAckMs: 108,\n },\n {\n id: 11,\n host: 'taskmanager-pod-5.k8s',\n status: 'RUNNING',\n inRate: '2,380 rec/s',\n outRate: '2,380 rec/s',\n cpu: '38%',\n heapMemory: '87 MB',\n backpressure: 0.0,\n watermarkLag: '38ms',\n checkpointAckMs: 112,\n },\n {\n id: 12,\n host: 'taskmanager-pod-6.k8s',\n status: 'RUNNING',\n inRate: '2,387 rec/s',\n outRate: '2,387 rec/s',\n cpu: '37%',\n heapMemory: '88 MB',\n backpressure: 0.0,\n watermarkLag: '36ms',\n checkpointAckMs: 111,\n },\n {\n id: 13,\n host: 'taskmanager-pod-6.k8s',\n status: 'RUNNING',\n inRate: '2,383 rec/s',\n outRate: '2,383 rec/s',\n cpu: '39%',\n heapMemory: '90 MB',\n backpressure: 0.0,\n watermarkLag: '38ms',\n checkpointAckMs: 114,\n },\n {\n id: 14,\n host: 'taskmanager-pod-7.k8s',\n status: 'RUNNING',\n inRate: '2,388 rec/s',\n outRate: '2,388 rec/s',\n cpu: '38%',\n heapMemory: '89 MB',\n backpressure: 0.0,\n watermarkLag: '39ms',\n checkpointAckMs: 110,\n },\n {\n id: 15,\n host: 'taskmanager-pod-7.k8s',\n status: 'RUNNING',\n inRate: '2,382 rec/s',\n outRate: '2,382 rec/s',\n cpu: '38%',\n heapMemory: '88 MB',\n backpressure: 0.0,\n watermarkLag: '37ms',\n checkpointAckMs: 112,\n },\n ],\n },\n {\n id: 'op-sink-dispatcher',\n name: 'Sink: Alert Dispatcher & Redis Cache',\n shortTitle: 'Sink: Alert Dispatcher & Redis Cache',\n stageNumber: 4,\n category: 'sink',\n operatorClass: 'com.uipkge.fraud.sink.TwoPhaseCommitRedisAlertSink',\n parallelism: 8,\n status: 'RUNNING',\n backpressure: 0.0,\n inputRecordsRate: '38,200 rec/s',\n inputBytesRate: '7.1 MB/s',\n outputRecordsRate: '42,500 rec/s',\n outputBytesRate: '9.2 MB/s',\n totalRecordsIn: 165861369,\n totalRecordsOut: 165861369,\n managedStateSize: '0.4 MB (2PC WAL)',\n stateBackend: 'Transactional Two-Phase Commit',\n heapMemory: '380 MB',\n managedMemory: '128 MB',\n gcTime: '0.9 ms/min',\n cpuPeak: '16%',\n watermarkLag: '42ms',\n currentWatermark: '2026-08-21 14:32:45.878 UTC',\n description:\n 'Commits risk scoring states to Redis Cluster for zero-latency checkout authorization gates and pushes flagged transactions to incident queues.',\n config: {\n 'sink.semantics': 'EXACTLY_ONCE (2PC Transactional)',\n 'redis.cluster.nodes': 'redis-cluster.internal:6379 (6 nodes)',\n 'redis.ttl': '86400s (24-hour key expiration)',\n 'webhook.alert.queue': 'https://alerts.security.internal/v1/fraud',\n 'batch.flush.interval.ms': '50',\n },\n subtasks: [\n {\n id: 0,\n host: 'taskmanager-pod-0.k8s',\n status: 'RUNNING',\n inRate: '4,775 rec/s',\n outRate: '5,312 rec/s',\n cpu: '16%',\n heapMemory: '48 MB',\n backpressure: 0.0,\n watermarkLag: '41ms',\n checkpointAckMs: 52,\n },\n {\n id: 1,\n host: 'taskmanager-pod-1.k8s',\n status: 'RUNNING',\n inRate: '4,770 rec/s',\n outRate: '5,308 rec/s',\n cpu: '15%',\n heapMemory: '47 MB',\n backpressure: 0.0,\n watermarkLag: '43ms',\n checkpointAckMs: 55,\n },\n {\n id: 2,\n host: 'taskmanager-pod-2.k8s',\n status: 'RUNNING',\n inRate: '4,780 rec/s',\n outRate: '5,315 rec/s',\n cpu: '17%',\n heapMemory: '49 MB',\n backpressure: 0.0,\n watermarkLag: '40ms',\n checkpointAckMs: 51,\n },\n {\n id: 3,\n host: 'taskmanager-pod-3.k8s',\n status: 'RUNNING',\n inRate: '4,765 rec/s',\n outRate: '5,305 rec/s',\n cpu: '16%',\n heapMemory: '46 MB',\n backpressure: 0.0,\n watermarkLag: '44ms',\n checkpointAckMs: 56,\n },\n {\n id: 4,\n host: 'taskmanager-pod-4.k8s',\n status: 'RUNNING',\n inRate: '4,778 rec/s',\n outRate: '5,314 rec/s',\n cpu: '16%',\n heapMemory: '48 MB',\n backpressure: 0.0,\n watermarkLag: '42ms',\n checkpointAckMs: 53,\n },\n {\n id: 5,\n host: 'taskmanager-pod-5.k8s',\n status: 'RUNNING',\n inRate: '4,772 rec/s',\n outRate: '5,310 rec/s',\n cpu: '15%',\n heapMemory: '47 MB',\n backpressure: 0.0,\n watermarkLag: '43ms',\n checkpointAckMs: 54,\n },\n {\n id: 6,\n host: 'taskmanager-pod-6.k8s',\n status: 'RUNNING',\n inRate: '4,782 rec/s',\n outRate: '5,318 rec/s',\n cpu: '17%',\n heapMemory: '49 MB',\n backpressure: 0.0,\n watermarkLag: '41ms',\n checkpointAckMs: 50,\n },\n {\n id: 7,\n host: 'taskmanager-pod-7.k8s',\n status: 'RUNNING',\n inRate: '4,768 rec/s',\n outRate: '5,308 rec/s',\n cpu: '16%',\n heapMemory: '47 MB',\n backpressure: 0.0,\n watermarkLag: '43ms',\n checkpointAckMs: 55,\n },\n ],\n },\n]\n", "type": "registry:block", "target": "~/src/app/components/blocks/stream-processing-flink-topology/stream-topology-data.ts" }, { "path": "packages/registry-angular/blocks/stream-processing-flink-topology/index.ts", "content": "export { UiStreamProcessingFlinkTopologyComponent } from './stream-processing-flink-topology.component'\nexport { UiStreamOperatorDetailComponent, type InspectorTab } from './stream-operator-detail.component'\nexport { UiStreamTopologyTelemetryComponent } from './stream-topology-telemetry.component'\nexport type { FlinkOperatorNode, FlinkSubtask } from './stream-topology-types'\nexport { defaultFlinkOperators } from './stream-topology-data'\n", "type": "registry:block", "target": "~/src/app/components/blocks/stream-processing-flink-topology/index.ts" } ], "dependencies": [ "lucide-angular" ], "devDependencies": [], "registryDependencies": [ "https://uipkge.dev/r/angular/badge.json", "https://uipkge.dev/r/angular/button.json", "https://uipkge.dev/r/angular/card.json", "https://uipkge.dev/r/angular/progress.json", "https://uipkge.dev/r/angular/separator.json", "https://uipkge.dev/r/angular/table.json" ], "description": "Apache Flink & RisingWave stateful streaming graph: real-time DAG topology, window throughput, checkpointing duration, RocksDB state inspector, and backpressure heat monitor.", "categories": [ "devops", "dashboard", "data", "app" ] }