{ "$schema": "https://ui.shadcn.com/schema/registry-item.json", "name": "feature-store-registry", "title": "Feature Store Registry", "type": "registry:block", "files": [ { "path": "packages/registry-react/blocks/feature-store-registry/FeatureStoreRegistry.tsx", "content": "'use client'\n\nimport * as React from 'react'\nimport {\n Activity,\n Check,\n CheckCircle2,\n Clock,\n Code2,\n Copy,\n Cpu,\n Database,\n Download,\n Fingerprint,\n Key,\n Layers,\n Loader2,\n Search,\n ShieldCheck,\n Table2,\n Workflow,\n Zap,\n} from 'lucide-react'\nimport { cn } from '@/lib/utils'\nimport { Badge } from '@/components/ui/badge'\nimport { Button } from '@/components/ui/button'\nimport { Card, CardContent } from '@/components/ui/card'\nimport { Input } from '@/components/ui/input'\nimport { Table, TableBody, TableCell, TableHead, TableHeader, TableRow } from '@/components/ui/table'\nimport { Tabs, TabsContent, TabsList, TabsTrigger } from '@/components/ui/tabs'\n\nexport interface FeatureDefinition {\n name: string\n dtype: 'Float64' | 'Int32' | 'String'\n description: string\n aggregationWindow: string\n onlineCacheKey: string\n freshness: string\n status: 'Online & Batch Ready'\n sourceSql: string\n sampleValue: string\n}\n\nexport interface MetricCard {\n title: string\n value: string\n subtitle: string\n badge: string\n icon: React.ComponentType<{ className?: string }>\n}\n\nexport interface FeatureStoreRegistryProps {\n className?: string\n}\n\nconst metrics: MetricCard[] = [\n {\n title: 'Total Features Registered',\n value: '18 Active Features',\n subtitle: '5 in this view · 4 views active',\n badge: '18 in Registry',\n icon: Layers,\n },\n {\n title: 'Online Cache Hit Rate',\n value: '99.8%',\n subtitle: '1.4ms p95 latency · Redis Cluster',\n badge: '< 2ms SLA',\n icon: Zap,\n },\n {\n title: 'Daily Ingestion Throughput',\n value: '14.8M Updates / Day',\n subtitle: '171.2 req/s avg · Stream + Batch',\n badge: 'Real-time CDC',\n icon: Activity,\n },\n {\n title: 'Max Point-in-Time TTL',\n value: '30 Days',\n subtitle: 'Lookback window · Anti-leakage safe',\n badge: 'AS-OF Safe',\n icon: Clock,\n },\n]\n\nconst features: FeatureDefinition[] = [\n {\n name: 'avg_transaction_value_30d',\n dtype: 'Float64',\n description: '30-day sliding average transaction amount in base USD currency',\n aggregationWindow: '30-day sliding mean',\n onlineCacheKey: 'user:ft:avg_tx_val_30d',\n freshness: 'Synced 4m ago',\n status: 'Online & Batch Ready',\n sourceSql: 'AVG(amount_usd) OVER (PARTITION BY user_id ROWS BETWEEN 30 PRECEDING AND CURRENT ROW)',\n sampleValue: '$342.80',\n },\n {\n name: 'failed_logins_24h',\n dtype: 'Int32',\n description: 'Failed authentication attempts in rolling 24-hour security window',\n aggregationWindow: '24-hour count',\n onlineCacheKey: 'user:ft:fail_login_24h',\n freshness: 'Synced 2m ago',\n status: 'Online & Batch Ready',\n sourceSql: 'SUM(CASE WHEN auth_success = FALSE THEN 1 ELSE 0 END)',\n sampleValue: '0',\n },\n {\n name: 'lifetime_chargeback_count',\n dtype: 'Int32',\n description: 'Total historical dispute and payment chargeback occurrences',\n aggregationWindow: 'Cumulative lifetime',\n onlineCacheKey: 'user:ft:cb_cnt_lt',\n freshness: 'Synced 12m ago',\n status: 'Online & Batch Ready',\n sourceSql: 'COUNT(chargeback_id) OVER (PARTITION BY user_id)',\n sampleValue: '0',\n },\n {\n name: 'preferred_payment_method',\n dtype: 'String',\n description: 'Most frequently utilized payment method category across checkout sessions',\n aggregationWindow: 'Mode category',\n onlineCacheKey: 'user:ft:pref_pay_method',\n freshness: 'Synced 18m ago',\n status: 'Online & Batch Ready',\n sourceSql: 'MODE(payment_method_code) OVER (PARTITION BY user_id)',\n sampleValue: '\"apple_pay\"',\n },\n {\n name: 'risk_score_ml_v3',\n dtype: 'Float64',\n description: 'Real-time XGBoost inference fraud risk score probability [0.0 - 1.0]',\n aggregationWindow: 'Real-time inference',\n onlineCacheKey: 'user:ft:risk_score_v3',\n freshness: 'Synced 1m ago',\n status: 'Online & Batch Ready',\n sourceSql: 'MODEL_PREDICT_FRAUD_V3(features)',\n sampleValue: '0.042',\n },\n]\n\nconst pythonFeastSource = `from datetime import timedelta\nfrom feast import (\n BatchSource,\n Entity,\n FeatureView,\n Field,\n SnowflakeSource,\n ValueType,\n)\nfrom feast.types import Float64, Int32, String\n\n# 1. Define Primary Entity\nuser_entity = Entity(\n name=\"user_id\",\n value_type=ValueType.STRING,\n join_keys=[\"user_id\"],\n description=\"Global UUID representing verified consumer and business accounts\",\n)\n\n# 2. Snowflake Gold DW Batch Offline Source\ntransactions_batch_source = SnowflakeSource(\n database=\"ANALYTICS_PROD\",\n schema=\"GOLD_MARTS\",\n table=\"fct_user_transactions_daily\",\n timestamp_field=\"event_timestamp\",\n created_timestamp_column=\"created_at\",\n)\n\n# 3. Dual-Store Feature View Definition (Redis Online + Snowflake Batch)\nuser_30d_transaction_aggregates = FeatureView(\n name=\"user_30d_transaction_aggregates\",\n entities=[user_entity],\n ttl=timedelta(days=30),\n schema=[\n Field(\n name=\"avg_transaction_value_30d\",\n dtype=Float64,\n description=\"30-day sliding average transaction amount in base USD currency\",\n ),\n Field(\n name=\"failed_logins_24h\",\n dtype=Int32,\n description=\"Failed authentication attempts in rolling 24-hour security window\",\n ),\n Field(\n name=\"lifetime_chargeback_count\",\n dtype=Int32,\n description=\"Total historical dispute and payment chargeback occurrences\",\n ),\n Field(\n name=\"preferred_payment_method\",\n dtype=String,\n description=\"Most frequently utilized payment method category across checkout sessions\",\n ),\n Field(\n name=\"risk_score_ml_v3\",\n dtype=Float64,\n description=\"Real-time XGBoost inference fraud risk score probability [0.0 - 1.0]\",\n ),\n ],\n online=True,\n source=transactions_batch_source,\n tags={\n \"team\": \"fraud-ml\",\n \"tier\": \"tier-1-prod\",\n \"online_store\": \"redis_cluster\",\n \"batch_store\": \"snowflake_gold\",\n \"sla\": \"sub-2ms\",\n },\n)`\n\nfunction escapeHtml(str: string): string {\n return str.replace(/&/g, '&').replace(//g, '>')\n}\n\nfunction highlightPythonLine(line: string): string {\n if (!line.trim()) return ' '\n const escaped = escapeHtml(line)\n\n // Comments\n if (/^\\s*#/.test(escaped)) {\n return `${escaped}`\n }\n\n // Each emitted is parked behind a letter-only placeholder so a later\n // pass cannot match inside markup an earlier pass produced.\n const parked: string[] = []\n const park = (html: string) => {\n const key = String(parked.length)\n .split('')\n .map((d) => String.fromCharCode(97 + Number(d)))\n .join('')\n parked.push(html)\n return `\\u0000${key}\\u0000`\n }\n\n let res = escaped\n\n // Strings\n res = res.replace(/([\"'])(?:(?=(\\\\?))\\2.)*?\\1/g, (match) =>\n park(`${match}`),\n )\n\n // Keywords\n res = res.replace(\n /\\b(from|import|def|class|return|as|True|False|None|with|for|in|and|or|not|is|if|else|elif)\\b/g,\n (m) => park(`${m}`),\n )\n\n // Types / Feast Classes\n res = res.replace(\n /\\b(Entity|FeatureView|Field|SnowflakeSource|BatchSource|ValueType|Float64|Int32|String|timedelta)\\b/g,\n (m) => park(`${m}`),\n )\n\n // Arguments\n res = res.replace(\n /\\b(name|value_type|join_keys|description|database|schema|table|timestamp_field|created_timestamp_column|entities|ttl|dtype|online|source|tags|days)\\b(?=\\s*=)/g,\n (m) => park(`${m}`),\n )\n\n // Numbers\n res = res.replace(/\\b(\\d+)\\b/g, (m) => park(`${m}`))\n\n // Restore every parked span\n return res.replace(/\\u0000([a-j]+)\\u0000/g, (_, key: string) => {\n const idx = Number(\n key\n .split('')\n .map((c: string) => String(c.charCodeAt(0) - 97))\n .join(''),\n )\n return parked[idx] ?? ''\n })\n}\n\nexport function FeatureStoreRegistry({ className }: FeatureStoreRegistryProps) {\n const [activeTab, setActiveTab] = React.useState<'features' | 'python-feast' | 'lineage'>('features')\n const [searchQuery, setSearchQuery] = React.useState('')\n const [selectedType, setSelectedType] = React.useState<'all' | 'Float64' | 'Int32' | 'String'>('all')\n const [isMaterializing, setIsMaterializing] = React.useState(false)\n const [materializeSuccess, setMaterializeSuccess] = React.useState(false)\n const [isGeneratingDataset, setIsGeneratingDataset] = React.useState(false)\n const [datasetSuccess, setDatasetSuccess] = React.useState(false)\n const [copiedFeast, setCopiedFeast] = React.useState(false)\n const [copiedKey, setCopiedKey] = React.useState(null)\n const selectedEntityId = 'usr_9a4f201d-7e2b-4d68'\n\n const pythonLines = React.useMemo(() => pythonFeastSource.split('\\n'), [])\n\n const filteredFeatures = React.useMemo(() => {\n const query = searchQuery.trim().toLowerCase()\n return features.filter((f) => {\n const matchesSearch =\n !query ||\n f.name.toLowerCase().includes(query) ||\n f.description.toLowerCase().includes(query) ||\n f.onlineCacheKey.toLowerCase().includes(query) ||\n f.dtype.toLowerCase().includes(query)\n const matchesType = selectedType === 'all' || f.dtype === selectedType\n return matchesSearch && matchesType\n })\n }, [searchQuery, selectedType])\n\n const copyToClipboard = React.useCallback((text: string, type: 'code' | 'key', keyName?: string) => {\n if (typeof navigator !== 'undefined' && navigator.clipboard) {\n navigator.clipboard.writeText(text)\n if (type === 'code') {\n setCopiedFeast(true)\n setTimeout(() => {\n setCopiedFeast(false)\n }, 2000)\n } else if (type === 'key' && keyName) {\n setCopiedKey(keyName)\n setTimeout(() => {\n setCopiedKey(null)\n }, 2000)\n }\n }\n }, [])\n\n const handleMaterialize = React.useCallback(() => {\n if (isMaterializing) return\n setIsMaterializing(true)\n setMaterializeSuccess(false)\n\n setTimeout(() => {\n setIsMaterializing(false)\n setMaterializeSuccess(true)\n setTimeout(() => {\n setMaterializeSuccess(false)\n }, 3000)\n }, 1200)\n }, [isMaterializing])\n\n const handleGenerateDataset = React.useCallback(() => {\n if (isGeneratingDataset) return\n setIsGeneratingDataset(true)\n setDatasetSuccess(false)\n\n setTimeout(() => {\n setIsGeneratingDataset(false)\n setDatasetSuccess(true)\n setTimeout(() => {\n setDatasetSuccess(false)\n }, 3000)\n }, 1000)\n }, [isGeneratingDataset])\n\n return (\n \n {/* TOP FEATURE VIEW HEADER */}\n
\n
\n {/* Left: Title, Entity, Stores */}\n
\n
\n \n
\n\n
\n
\n feature_view /\n

\n user_30d_transaction_aggregates\n

\n \n v2.4.0\n \n
\n\n {/* Metadata Badges Strip */}\n
\n {/* Entity Pill */}\n
\n \n Entity:\n user_id\n [UUID]\n
\n\n {/* Online Store Pill */}\n
\n \n Redis Cluster · < 2ms latency\n
\n\n {/* Batch Store Pill */}\n
\n \n Snowflake Gold DW\n
\n
\n
\n
\n\n {/* Right: Action Buttons */}\n
\n {/* Generate Training Dataset Button */}\n \n {isGeneratingDataset ? (\n \n ) : datasetSuccess ? (\n \n ) : (\n \n )}\n \n {isGeneratingDataset\n ? 'Building Parquet...'\n : datasetSuccess\n ? 'Dataset Exported (14.2 MB)'\n : 'Generate Training Dataset'}\n \n \n\n {/* Materialize Online Features Button */}\n \n {isMaterializing ? (\n \n ) : materializeSuccess ? (\n \n ) : (\n \n )}\n \n {isMaterializing\n ? 'Syncing to Redis...'\n : materializeSuccess\n ? 'Materialized 18.4k Keys!'\n : 'Materialize Online Features'}\n \n \n
\n
\n
\n\n {/* 4 FEATURE STORE METRIC CARDS */}\n
\n
\n {metrics.map((metric) => {\n const IconComp = metric.icon\n return (\n \n \n
\n {metric.title}\n
\n \n
\n
\n\n
\n
{metric.value}
\n
\n {metric.subtitle}\n \n {metric.badge}\n \n
\n
\n \n \n )\n })}\n
\n
\n\n {/* MAIN TABS STUDIO */}\n
\n setActiveTab(val as 'features' | 'python-feast' | 'lineage')}\n defaultValue=\"features\"\n className=\"flex flex-1 flex-col\"\n >\n {/* Tabs Bar */}\n
\n \n \n \n Feature Definitions\n \n {features.length}\n \n \n \n \n Feast Definition\n \n \n \n Lineage & Architecture\n \n \n\n
\n \n \n Redis Online Serving: ACTIVE\n \n
\n
\n\n {/* TAB 1: FEATURE DEFINITIONS TABLE */}\n \n {/* Filter / Search Controls */}\n
\n
\n
\n \n setSearchQuery(e.target.value)}\n placeholder=\"Filter by feature name, type, or cache key...\"\n className=\"h-8 pl-8 font-mono text-xs\"\n />\n
\n\n {/* Type filter pills */}\n
\n {(['all', 'Float64', 'Int32', 'String'] as const).map((t) => (\n setSelectedType(t)}\n >\n {t === 'all' ? 'All Types' : t}\n \n ))}\n
\n
\n\n
\n \n Showing {filteredFeatures.length} of {features.length} features\n \n
\n
\n\n {/* Feature Definitions Table */}\n \n
\n \n \n \n Feature Name & Type\n Description & Aggregation Window\n Online Cache Key (Redis)\n Freshness\n Status\n \n \n \n {filteredFeatures.map((feature) => (\n \n {/* Feature Name & Type */}\n \n
\n
{feature.name}
\n \n {feature.dtype}\n \n
\n \n\n {/* Description & Aggregation Window */}\n \n
\n

{feature.description}

\n \n \n {feature.aggregationWindow}\n \n
\n \n\n {/* Online Cache Key */}\n \n copyToClipboard(feature.onlineCacheKey, 'key', feature.name)}\n >\n GET\n {feature.onlineCacheKey}\n {copiedKey === feature.name ? (\n \n ) : (\n \n )}\n \n \n\n {/* Freshness / Last Synced */}\n \n
\n \n {feature.freshness}\n
\n \n\n {/* Feature Status */}\n \n \n \n {feature.status}\n \n \n \n ))}\n \n
\n
\n \n\n {/* Interactive Entity Live Feature Vector Inspector */}\n \n
\n
\n \n \n Live Online Feature Vector Lookup Simulator\n \n \n feast.get_online_features()\n \n
\n
\n Target Entity:\n {selectedEntityId}\n
\n
\n\n
\n {features.map((feature) => (\n \n
\n \n {feature.name}\n \n {feature.aggregationWindow}\n
\n
\n {feature.sampleValue}\n < 1.2ms\n
\n
\n ))}\n
\n \n \n\n {/* TAB 2: PYTHON FEAST DEFINITION CODE BOX */}\n \n
\n {/* Code Box Toolbar Header */}\n
\n
\n
\n \n
\n \n feature_definitions/user_aggregates.py\n \n \n Python 3.11 · Feast 0.42+\n \n
\n\n copyToClipboard(pythonFeastSource, 'code')}\n >\n {copiedFeast ? : }\n {copiedFeast ? 'Copied Feast Code!' : 'Copy Python Code'}\n \n
\n\n {/* Code Gutter and Syntax Highlighter */}\n
\n {/* Line Numbers Gutter */}\n
\n {pythonLines.map((_, idx) => (\n
{idx + 1}
\n ))}\n
\n\n {/* Python Code Content */}\n
\n {pythonLines.map((line, idx) => (\n \n ))}\n
\n
\n\n {/* Code Footer Meta */}\n
\n
\n {pythonLines.length} lines\n ·\n UTF-8\n ·\n Feast Entity & FeatureView DSL\n
\n
\n \n Valid Feast Schema Contract\n
\n
\n
\n \n\n {/* TAB 3: STORAGE & LINEAGE ARCHITECTURE */}\n \n
\n {/* Offline Batch Lineage Card */}\n \n
\n
\n \n Offline Batch Store Architecture\n
\n \n Snowflake Gold\n \n
\n\n

\n Immutable historical logs for time-travel queries, training set generation, and AS-OF joins without\n point-in-time data leakage.\n

\n\n
\n
\n Database & Schema:\n ANALYTICS_PROD.GOLD_MARTS\n
\n
\n Source Table:\n fct_user_transactions_daily\n
\n
\n Timestamp Partition:\n event_timestamp (UTC)\n
\n
\n Historical Depth:\n 3 Years (Lookback TTL 30 Days)\n
\n
\n \n\n {/* Online Low-Latency Cache Card */}\n \n
\n
\n \n Online Key-Value Cache Architecture\n
\n \n Redis 7.2 Cluster\n \n
\n\n

\n Ultra-low latency memory tier providing sub-2 millisecond retrieval for online model inference\n microservices and fraud scoring.\n

\n\n
\n
\n Cluster Topology:\n 3 Master Shards + 3 Replicas\n
\n
\n Key Prefix Pattern:\n user:ft:{feature_name}\n
\n
\n Read SLA (p95):\n < 1.4ms Latency\n
\n
\n Materialization Schedule:\n Every 15 mins via Feast Job\n
\n
\n \n
\n \n \n \n \n )\n}\n", "type": "registry:block", "target": "~/components/blocks/FeatureStoreRegistry.tsx" } ], "dependencies": [ "lucide-react" ], "devDependencies": [], "registryDependencies": [ "https://uipkge.dev/r/react/badge.json", "https://uipkge.dev/r/react/button.json", "https://uipkge.dev/r/react/card.json", "https://uipkge.dev/r/react/input.json", "https://uipkge.dev/r/react/table.json", "https://uipkge.dev/r/react/tabs.json" ], "description": "Feast and Tecton style machine learning feature store registry with entity definitions, low-latency Redis online cache status, Snowflake batch source lineage, feature schema inspection table, throughput metrics, and Python Feast feature view code generator.", "categories": [ "ai", "app", "devops" ] }