Skip to content

Commit f1d6f4b

Browse files
alenkaczclaude
andcommitted
fix: add production support for AI Gateway via config.aiGatewayUrl
In production embedded mode, the frontend now uses config.aiGatewayUrl (set by cloud-ui from REACT_APP_AI_GATEWAY_URL_TEMPLATE env var) to construct AI Gateway transport URLs. Changes: - Add aiGatewayUrl?: string to SetConfigArguments and Config types in config.ts - Update useAIGatewayTransport to use config.aiGatewayUrl when isEmbedded() - In production embedded: use config.aiGatewayUrl + /.redpanda/api - In development: use relative /.redpanda/api with dev server proxy - Fallback to relative path for standalone mode Cloud-ui passes aiGatewayUrl by: aiGatewayUrl: process.env.REACT_APP_AI_GATEWAY_URL_TEMPLATE?.replace('{clusterId}', clusterId) This enables environment-specific AI Gateway domains: - Integration: https://ai-gateway.{clusterId}.clusters.ign.rdpa.co - Staging: https://ai-gateway.{clusterId}.clusters.staging.rdpa.co - Production: https://ai-gateway.{clusterId}.clusters.prod.rdpa.co Fixes issue where production requests went to: https://main--redpanda-cloud.netlify.app/.redpanda/api/... Instead of: https://ai-gateway.{clusterId}.clusters.ign.rdpa.co/.redpanda/api/... Related: cloudv2 PR #24457 (adds REACT_APP_AI_GATEWAY_URL_TEMPLATE env var) Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
1 parent 47c71ad commit f1d6f4b

2 files changed

Lines changed: 40 additions & 10 deletions

File tree

frontend/src/config.ts

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -119,6 +119,7 @@ export type SetConfigArguments = {
119119
fetch?: WindowOrWorkerGlobalScope['fetch'];
120120
jwt?: string;
121121
clusterId?: string;
122+
aiGatewayUrl?: string;
122123
urlOverride?: {
123124
rest?: string;
124125
ws?: string;
@@ -147,6 +148,7 @@ export type Breadcrumb = {
147148

148149
type Config = {
149150
controlplaneUrl: string;
151+
aiGatewayUrl?: string;
150152
dataplaneTransport?: Transport;
151153
restBasePath: string;
152154
grpcBasePath: string;

frontend/src/hooks/use-ai-gateway-transport.ts

Lines changed: 38 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -1,29 +1,57 @@
11
import type { Transport } from '@connectrpc/connect';
22
import { createConnectTransport } from '@connectrpc/connect-web';
3-
import { addBearerTokenInterceptor } from 'config';
3+
import { addBearerTokenInterceptor, config, isEmbedded } from 'config';
44
import { protobufRegistry } from 'protobuf-registry';
55
import { useMemo } from 'react';
66

77
/**
88
* Custom hook to create and memoize a Connect transport for AI Gateway API calls
99
*
10-
* Uses base path: /.redpanda/api/
11-
* Connect Query will append the service path: redpanda.api.aigateway.v1.GatewayService/ListGateways
12-
* Full path becomes: /.redpanda/api/redpanda.api.aigateway.v1.GatewayService/ListGateways
10+
* In Development:
11+
* - Uses base path: /.redpanda/api/
12+
* - Dev server proxies to: https://ai-gateway.{clusterId}.clusters.ign.rdpa.co
1313
*
14-
* Dev server proxies /.redpanda/api/redpanda.api.aigateway.v1 to:
15-
* https://ai-gateway.${CLUSTER_ID}.clusters.ign.rdpa.co
14+
* In Production (Embedded):
15+
* - Uses config.aiGatewayUrl set by cloud-ui parent app (from REACT_APP_AI_GATEWAY_URL env var)
16+
* - Appends /.redpanda/api to the base URL
17+
*
18+
* In Production (Standalone):
19+
* - Uses relative path /.redpanda/api (backend handles routing)
1620
*
1721
* @returns Transport instance configured for AI Gateway communication
1822
*/
1923
export const useAIGatewayTransport = (): Transport => {
2024
const aiGatewayTransport = useMemo(() => {
21-
// Use /.redpanda/api/ base path (AI Gateway's Connect RPC endpoint prefix)
22-
// Dev server will proxy to the correct AI Gateway based on cluster ID
23-
const baseUrl = '/.redpanda/api';
25+
// In development, use relative path and rely on dev server proxy
26+
if (process.env.NODE_ENV === 'development') {
27+
return createConnectTransport({
28+
baseUrl: '/.redpanda/api',
29+
interceptors: [addBearerTokenInterceptor],
30+
jsonOptions: {
31+
registry: protobufRegistry,
32+
},
33+
});
34+
}
35+
36+
// In production embedded mode (cloud-ui), use AI Gateway URL from config
37+
if (isEmbedded() && config.aiGatewayUrl) {
38+
// Ensure URL ends with /.redpanda/api
39+
const baseUrl = config.aiGatewayUrl.endsWith('/.redpanda/api')
40+
? config.aiGatewayUrl
41+
: `${config.aiGatewayUrl}/.redpanda/api`;
42+
43+
return createConnectTransport({
44+
baseUrl,
45+
interceptors: [addBearerTokenInterceptor],
46+
jsonOptions: {
47+
registry: protobufRegistry,
48+
},
49+
});
50+
}
2451

52+
// Fallback to relative path for standalone mode
2553
return createConnectTransport({
26-
baseUrl,
54+
baseUrl: '/.redpanda/api',
2755
interceptors: [addBearerTokenInterceptor],
2856
jsonOptions: {
2957
registry: protobufRegistry,

0 commit comments

Comments
 (0)