Skip to content

Commit 5abd6bb

Browse files
jog1tjog1t
committed
fix: actor runners by name query (#3100)
### TL;DR Added Sentry tunnel configuration and improved actor list UI layout. ### What changed? - Added a `tunnel` property to the Sentry configuration in both the HTML template and TypeScript interfaces - Initialized Sentry with the tunnel configuration from the app config - Simplified the `runnerByNameQueryOptions` function by removing the redundant namespace parameter - Enhanced the actors list UI by: - Adding flex layout with centered items to the actor information container - Adding proper spacing between datacenter information and other elements - Ensuring consistent margin for the datacenter display regardless of content ### How to test? 1. Verify that Sentry initialization works with the new tunnel configuration by setting the `VITE_APP_SENTRY_TUNNEL` environment variable 2. Check that the actors list displays correctly with proper spacing between elements 3. Confirm that runner queries still work correctly with the simplified namespace handling ### Why make this change? The Sentry tunnel configuration allows for proxy routing of error reports, which can be useful in environments with strict CSP policies or when direct access to Sentry servers is restricted. The UI improvements to the actors list enhance readability by providing better spacing and alignment of actor information elements.
1 parent 09c6260 commit 5abd6bb

File tree

10 files changed

+147
-82
lines changed

10 files changed

+147
-82
lines changed

‎frontend/index.html‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -36,7 +36,8 @@
3636
"sentryDsn": "%VITE_APP_SENTRY_DSN%",
3737
"sentry": {
3838
"dsn": "%VITE_APP_SENTRY_DSN%",
39-
"projectId": "%VITE_APP_SENTRY_PROJECT_ID%"
39+
"projectId": "%VITE_APP_SENTRY_PROJECT_ID%",
40+
"tunnel": "%VITE_APP_SENTRY_TUNNEL%"
4041
},
4142
"posthog": {
4243
"apiKey": "%VITE_APP_POSTHOG_API_KEY%",

‎frontend/packages/components/src/lib/config.ts‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -11,6 +11,7 @@ interface Config {
1111
sentry?: {
1212
dsn: string;
1313
projectId: string;
14+
tunnel?: string;
1415
};
1516
outerbaseProviderToken: string;
1617
}

‎frontend/packages/components/src/third-party-providers.tsx‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -35,6 +35,7 @@ export function initThirdPartyProviders(router: unknown, debug: boolean) {
3535
Sentry.init({
3636
dsn: config.sentry.dsn,
3737
integrations,
38+
tunnel: getConfig().sentry?.tunnel,
3839
});
3940
}
4041
}

‎frontend/src/app/data-providers/cloud-data-provider.tsx‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -357,6 +357,9 @@ export const createNamespaceContext = ({
357357
namespaceQueryOptions() {
358358
return parent.currentProjectNamespaceQueryOptions({ namespace });
359359
},
360+
currentNamespaceAccessTokenQueryOptions() {
361+
return parent.accessTokenQueryOptions({ namespace });
362+
},
360363
engineAdminTokenQueryOptions() {
361364
return queryOptions({
362365
staleTime: 5 * 60 * 1000, // 5 minutes

‎frontend/src/app/data-providers/engine-data-provider.tsx‎

Lines changed: 3 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -469,16 +469,13 @@ export const createNamespaceContext = ({
469469
},
470470
});
471471
},
472-
runnerByNameQueryOptions(opts: {
473-
namespace: string;
474-
runnerName: string;
475-
}) {
472+
runnerByNameQueryOptions(opts: { runnerName: string }) {
476473
return queryOptions({
477-
queryKey: [opts.namespace, "runner", opts.runnerName],
474+
queryKey: [{ namespace }, "runner", opts.runnerName],
478475
enabled: !!opts.runnerName,
479476
queryFn: async ({ signal: abortSignal }) => {
480477
const data = await client.runners.list(
481-
{ namespace: opts.namespace, name: opts.runnerName },
478+
{ namespace, name: opts.runnerName },
482479
{
483480
abortSignal,
484481
},

‎frontend/src/components/actors/actor-queries-context.tsx‎

Lines changed: 13 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@ import type { ActorId } from "./queries";
55

66
type RequestOptions = Parameters<typeof createActorInspectorClient>[1];
77

8-
export const defaultActorContext = {
8+
export const createDefaultActorContext = ({ hash }: { hash: string } = {}) => ({
99
createActorInspectorFetchConfiguration: (
1010
actorId: ActorId | string,
1111
): RequestOptions => ({
@@ -32,7 +32,7 @@ export const defaultActorContext = {
3232
enabled: false,
3333
refetchInterval: 1000,
3434
...opts,
35-
queryKey: ["actor", actorId, "ping"],
35+
queryKey: [hash, "actor", actorId, "ping"],
3636
queryFn: async ({ queryKey: [, actorId] }) => {
3737
const client = this.createActorInspector(actorId);
3838
const response = await client.ping.$get();
@@ -51,7 +51,7 @@ export const defaultActorContext = {
5151
return queryOptions({
5252
enabled,
5353
refetchInterval: 1000,
54-
queryKey: ["actor", actorId, "state"],
54+
queryKey: [hash, "actor", actorId, "state"],
5555
queryFn: async ({ queryKey: [, actorId] }) => {
5656
const client = this.createActorInspector(actorId);
5757
const response = await client.state.$get();
@@ -74,7 +74,7 @@ export const defaultActorContext = {
7474
return queryOptions({
7575
enabled,
7676
refetchInterval: 1000,
77-
queryKey: ["actor", actorId, "connections"],
77+
queryKey: [hash, "actor", actorId, "connections"],
7878
queryFn: async ({ queryKey: [, actorId] }) => {
7979
const client = this.createActorInspector(actorId);
8080
const response = await client.connections.$get();
@@ -93,7 +93,7 @@ export const defaultActorContext = {
9393
) {
9494
return queryOptions({
9595
enabled,
96-
queryKey: ["actor", actorId, "database"],
96+
queryKey: [hash, "actor", actorId, "database"],
9797
queryFn: async ({ queryKey: [, actorId] }) => {
9898
const client = this.createActorInspector(actorId);
9999
const response = await client.db.$get();
@@ -142,7 +142,7 @@ export const defaultActorContext = {
142142
enabled,
143143
staleTime: 0,
144144
gcTime: 5000,
145-
queryKey: ["actor", actorId, "database", table],
145+
queryKey: [hash, "actor", actorId, "database", table],
146146
queryFn: async ({ queryKey: [, actorId, , table] }) => {
147147
const client = this.createActorInspector(actorId);
148148
const response = await client.db.$post({
@@ -163,7 +163,7 @@ export const defaultActorContext = {
163163
return queryOptions({
164164
enabled,
165165
refetchInterval: 1000,
166-
queryKey: ["actor", actorId, "events"],
166+
queryKey: [hash, "actor", actorId, "events"],
167167
queryFn: async ({ queryKey: [, actorId] }) => {
168168
const client = this.createActorInspector(actorId);
169169
const response = await client.events.$get();
@@ -182,7 +182,7 @@ export const defaultActorContext = {
182182
) {
183183
return queryOptions({
184184
enabled,
185-
queryKey: ["actor", actorId, "rpcs"],
185+
queryKey: [hash, "actor", actorId, "rpcs"],
186186
queryFn: async ({ queryKey: [, actorId] }) => {
187187
const client = this.createActorInspector(actorId);
188188
const response = await client.rpcs.$get();
@@ -197,7 +197,7 @@ export const defaultActorContext = {
197197

198198
actorClearEventsMutationOptions(actorId: ActorId) {
199199
return {
200-
mutationKey: ["actor", actorId, "clear-events"],
200+
mutationKey: [hash, "actor", actorId, "clear-events"],
201201
mutationFn: async () => {
202202
const client = this.createActorInspector(actorId);
203203
const response = await client.events.clear.$post();
@@ -211,7 +211,7 @@ export const defaultActorContext = {
211211

212212
actorWakeUpMutationOptions(actorId: ActorId) {
213213
return {
214-
mutationKey: ["actor", actorId, "wake-up"],
214+
mutationKey: [hash, "actor", actorId, "wake-up"],
215215
mutationFn: async () => {
216216
const client = this.createActorInspector(actorId);
217217
try {
@@ -233,7 +233,7 @@ export const defaultActorContext = {
233233
refetchInterval: 1000,
234234
staleTime: 0,
235235
gcTime: 0,
236-
queryKey: ["actor", actorId, "auto-wake-up"],
236+
queryKey: [hash, "actor", actorId, "auto-wake-up"],
237237
queryFn: async ({ queryKey: [, actorId] }) => {
238238
const client = this.createActorInspector(actorId);
239239
try {
@@ -246,13 +246,9 @@ export const defaultActorContext = {
246246
retry: false,
247247
});
248248
},
249-
};
249+
});
250250

251-
export type ActorContext = typeof defaultActorContext;
252-
253-
export function createDefaultActorContext(): ActorContext {
254-
return defaultActorContext;
255-
}
251+
export type ActorContext = ReturnType<typeof createDefaultActorContext>;
256252

257253
const ActorContext = createContext({} as ActorContext);
258254

‎frontend/src/components/actors/actors-list-row.tsx‎

Lines changed: 5 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -64,7 +64,7 @@ export const ActorsListRow = memo(
6464
/>
6565
}
6666
/>
67-
<div className="min-w-0">
67+
<div className="min-w-0 flex items-center">
6868
<Id actorId={actorId} />
6969
<Datacenter actorId={actorId} />
7070
<Tags actorId={actorId} />
@@ -128,11 +128,13 @@ function Datacenter({ actorId }: { actorId: ActorId }) {
128128
}
129129

130130
if (!datacenter) {
131-
return <SmallText className="text-foreground">-</SmallText>;
131+
return <SmallText className="text-foreground mr-2">-</SmallText>;
132132
}
133133

134134
return (
135-
<SmallText className="text-muted-foreground">{datacenter}</SmallText>
135+
<SmallText className="text-muted-foreground mr-2">
136+
{datacenter}
137+
</SmallText>
136138
);
137139
}
138140

0 commit comments

Comments
 (0)