Skip to content

Commit f1f1d02

Browse files
ericallamericallam
authored
feat(dashboard): a few tweaks to the AI models page (#3315)
1 parent ed64042 commit f1f1d02

8 files changed

Lines changed: 37 additions & 138 deletions

File tree

‎apps/webapp/app/components/navigation/SideMenu.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -477,7 +477,7 @@ export function SideMenu({
477477
data-action="prompts"
478478
isCollapsed={isCollapsed}
479479
/>
480-
{(user.admin || user.isImpersonating || featureFlags.hasAiModelsAccess) && (
480+
{(user.admin || user.isImpersonating || featureFlags.hasAiAccess) && (
481481
<SideMenuItem
482482
name="Models"
483483
icon={CubeIcon}

‎apps/webapp/app/env.server.ts‎

Lines changed: 0 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1237,9 +1237,6 @@ const EnvironmentSchema = z
12371237
// AI features (Prompts, Models, AI Metrics sidebar section)
12381238
AI_FEATURES_ENABLED: z.string().default("0"),
12391239

1240-
// AI Models feature (Models sidebar item within AI section)
1241-
AI_MODELS_ENABLED: z.string().default("0"),
1242-
12431240
// Logs page ClickHouse URL (for logs queries)
12441241
LOGS_CLICKHOUSE_URL: z
12451242
.string()

‎apps/webapp/app/presenters/OrganizationsPresenter.server.ts‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -159,6 +159,7 @@ export class OrganizationsPresenter {
159159
// Get global feature flags with env-var-based defaults
160160
const globalFlags = await flags({
161161
defaultValues: {
162+
hasAiAccess: env.AI_FEATURES_ENABLED === "1",
162163
hasPrivateConnections: env.PRIVATE_CONNECTIONS_ENABLED === "1",
163164
},
164165
});

‎apps/webapp/app/routes/_app.orgs.$organizationSlug.projects.$projectParam.env.$envParam.models.$modelId/route.tsx‎

Lines changed: 13 additions & 33 deletions
Original file line numberDiff line numberDiff line change
@@ -112,8 +112,8 @@ type Tab = "overview" | "global" | "usage";
112112

113113
const TAB_CONFIG: { id: Tab; label: string }[] = [
114114
{ id: "overview", label: "Overview" },
115-
{ id: "global", label: "Global Metrics" },
116-
{ id: "usage", label: "Your Usage" },
115+
{ id: "usage", label: "Metrics" },
116+
{ id: "global", label: "Global metrics" },
117117
];
118118

119119
export default function ModelDetailPage() {
@@ -425,16 +425,7 @@ function GlobalMetricsTab({
425425
return (
426426
<div className="space-y-4">
427427
{/* Big numbers */}
428-
<div className="grid grid-cols-2 gap-3 sm:grid-cols-4">
429-
<div className="h-24">
430-
<MetricWidget
431-
widgetKey={`${modelName}-calls`}
432-
title="Total Calls"
433-
query={`SELECT sum(call_count) AS total_calls FROM llm_models WHERE response_model = '${escapeTSQL(modelName)}'`}
434-
config={bignumberConfig("total_calls", { abbreviate: true })}
435-
{...widgetProps}
436-
/>
437-
</div>
428+
<div className="grid grid-cols-2 gap-3 sm:grid-cols-3">
438429
<div className="h-24">
439430
<MetricWidget
440431
widgetKey={`${modelName}-ttfc-p50`}
@@ -465,25 +456,14 @@ function GlobalMetricsTab({
465456
</div>
466457

467458
{/* Charts */}
468-
<div className="grid grid-cols-1 gap-3 lg:grid-cols-2">
469-
<div className="h-[300px]">
470-
<MetricWidget
471-
widgetKey={`${modelName}-calls-time`}
472-
title="Calls over time"
473-
query={`SELECT timeBucket(), sum(call_count) AS calls FROM llm_models WHERE response_model = '${escapeTSQL(modelName)}' GROUP BY timeBucket ORDER BY timeBucket`}
474-
config={chartConfig({ chartType: "bar", xAxisColumn: "timebucket", yAxisColumns: ["calls"] })}
475-
{...widgetProps}
476-
/>
477-
</div>
478-
<div className="h-[300px]">
479-
<MetricWidget
480-
widgetKey={`${modelName}-ttfc-time`}
481-
title="TTFC over time"
482-
query={`SELECT timeBucket(), round(quantilesMerge(0.5)(ttfc_quantiles)[1], 0) AS ttfc_p50, round(quantilesMerge(0.9)(ttfc_quantiles)[1], 0) AS ttfc_p90 FROM llm_models WHERE response_model = '${escapeTSQL(modelName)}' GROUP BY timeBucket ORDER BY timeBucket`}
483-
config={chartConfig({ chartType: "line", xAxisColumn: "timebucket", yAxisColumns: ["ttfc_p50", "ttfc_p90"], aggregation: "avg" })}
484-
{...widgetProps}
485-
/>
486-
</div>
459+
<div className="h-[300px]">
460+
<MetricWidget
461+
widgetKey={`${modelName}-ttfc-time`}
462+
title="TTFC over time"
463+
query={`SELECT timeBucket(), round(quantilesMerge(0.5)(ttfc_quantiles)[1], 0) AS ttfc_p50, round(quantilesMerge(0.9)(ttfc_quantiles)[1], 0) AS ttfc_p90 FROM llm_models WHERE response_model = '${escapeTSQL(modelName)}' GROUP BY timeBucket ORDER BY timeBucket`}
464+
config={chartConfig({ chartType: "line", xAxisColumn: "timebucket", yAxisColumns: ["ttfc_p50", "ttfc_p90"], aggregation: "avg" })}
465+
{...widgetProps}
466+
/>
487467
</div>
488468

489469
<Callout variant="info">
@@ -523,7 +503,7 @@ function YourUsageTab({
523503
<div className="h-24">
524504
<MetricWidget
525505
widgetKey={`${modelName}-user-calls`}
526-
title="Your Calls"
506+
title="Total calls (7d)"
527507
query={`SELECT count() AS total_calls FROM llm_metrics WHERE response_model = '${escapeTSQL(modelName)}'`}
528508
config={bignumberConfig("total_calls", { abbreviate: true })}
529509
{...widgetProps}
@@ -532,7 +512,7 @@ function YourUsageTab({
532512
<div className="h-24">
533513
<MetricWidget
534514
widgetKey={`${modelName}-user-cost`}
535-
title="Your Cost"
515+
title="Total cost (7d)"
536516
query={`SELECT sum(total_cost) AS total_cost FROM llm_metrics WHERE response_model = '${escapeTSQL(modelName)}'`}
537517
config={bignumberConfig("total_cost", { aggregation: "sum" })}
538518
{...widgetProps}

‎apps/webapp/app/routes/_app.orgs.$organizationSlug.projects.$projectParam.env.$envParam.models._index/route.tsx‎

Lines changed: 21 additions & 51 deletions
Original file line numberDiff line numberDiff line change
@@ -343,7 +343,6 @@ function ModelsList({
343343
</>
344344
)}
345345
<TableHeaderCell alignment="right">p50 TTFC</TableHeaderCell>
346-
<TableHeaderCell alignment="right">Calls (7d)</TableHeaderCell>
347346
</TableRow>
348347
</TableHeader>
349348
<TableBody>
@@ -397,9 +396,6 @@ function ModelsList({
397396
<TableCell onClick={select} alignment="right" className="tabular-nums">
398397
{popular && popular.ttfcP50 > 0 ? `${popular.ttfcP50.toFixed(0)}ms` : "—"}
399398
</TableCell>
400-
<TableCell onClick={select} alignment="right" className="tabular-nums">
401-
{popular && popular.callCount > 0 ? formatNumberCompact(popular.callCount) : "—"}
402-
</TableCell>
403399
</TableRow>
404400
);
405401
})}
@@ -718,20 +714,20 @@ function ModelDetailPanel({
718714
Overview
719715
</TabButton>
720716
<TabButton
721-
isActive={tab === "global"}
717+
isActive={tab === "usage"}
722718
layoutId="model-detail"
723-
onClick={() => setTab("global")}
724-
shortcut={{ key: "g" }}
719+
onClick={() => setTab("usage")}
720+
shortcut={{ key: "u" }}
725721
>
726-
Global metrics
722+
Metrics
727723
</TabButton>
728724
<TabButton
729-
isActive={tab === "usage"}
725+
isActive={tab === "global"}
730726
layoutId="model-detail"
731-
onClick={() => setTab("usage")}
732-
shortcut={{ key: "u" }}
727+
onClick={() => setTab("global")}
728+
shortcut={{ key: "g" }}
733729
>
734-
Your usage
730+
Global metrics
735731
</TabButton>
736732
</TabContainer>
737733
</div>
@@ -876,18 +872,7 @@ function DetailGlobalMetricsTab({
876872

877873
return (
878874
<div className="flex flex-col gap-3 py-3">
879-
<div className="h-[250px]">
880-
<MetricWidget
881-
widgetKey={`${modelName}-calls`}
882-
title="Total calls"
883-
query={`SELECT sum(call_count) AS total_calls FROM llm_models WHERE response_model = '${escapeTSQL(
884-
modelName
885-
)}'`}
886-
config={bignumberConfig("total_calls", { abbreviate: true })}
887-
{...widgetProps}
888-
/>
889-
</div>
890-
<div className="h-[250px]">
875+
<div className="h-[120px]">
891876
<MetricWidget
892877
widgetKey={`${modelName}-ttfc-p50`}
893878
title="p50 TTFC"
@@ -898,7 +883,7 @@ function DetailGlobalMetricsTab({
898883
{...widgetProps}
899884
/>
900885
</div>
901-
<div className="h-[250px]">
886+
<div className="h-[120px]">
902887
<MetricWidget
903888
widgetKey={`${modelName}-ttfc-p90`}
904889
title="p90 TTFC"
@@ -909,7 +894,7 @@ function DetailGlobalMetricsTab({
909894
{...widgetProps}
910895
/>
911896
</div>
912-
<div className="h-[250px]">
897+
<div className="h-[120px]">
913898
<MetricWidget
914899
widgetKey={`${modelName}-tps`}
915900
title="Tokens/sec (p50)"
@@ -921,22 +906,7 @@ function DetailGlobalMetricsTab({
921906
/>
922907
</div>
923908

924-
<div className="h-[250px]">
925-
<MetricWidget
926-
widgetKey={`${modelName}-calls-time`}
927-
title="Calls over time"
928-
query={`SELECT timeBucket(), sum(call_count) AS calls FROM llm_models WHERE response_model = '${escapeTSQL(
929-
modelName
930-
)}' GROUP BY timeBucket ORDER BY timeBucket`}
931-
config={chartConfig({
932-
chartType: "bar",
933-
xAxisColumn: "timebucket",
934-
yAxisColumns: ["calls"],
935-
})}
936-
{...widgetProps}
937-
/>
938-
</div>
939-
<div className="h-[250px]">
909+
<div className="h-[400px]">
940910
<MetricWidget
941911
widgetKey={`${modelName}-ttfc-time`}
942912
title="TTFC over time"
@@ -983,29 +953,29 @@ function DetailYourUsageTab({
983953

984954
return (
985955
<div className="flex flex-col gap-3 py-3">
986-
<div className="h-[250px]">
956+
<div className="h-[120px]">
987957
<MetricWidget
988958
widgetKey={`${modelName}-user-calls`}
989-
title="Your calls"
959+
title="Total calls (7d)"
990960
query={`SELECT count() AS total_calls FROM llm_metrics WHERE response_model = '${escapeTSQL(
991961
modelName
992962
)}'`}
993963
config={bignumberConfig("total_calls", { abbreviate: true })}
994964
{...widgetProps}
995965
/>
996966
</div>
997-
<div className="h-[250px]">
967+
<div className="h-[120px]">
998968
<MetricWidget
999969
widgetKey={`${modelName}-user-cost`}
1000-
title="Your cost"
970+
title="Total cost (7d)"
1001971
query={`SELECT sum(total_cost) AS total_cost FROM llm_metrics WHERE response_model = '${escapeTSQL(
1002972
modelName
1003973
)}'`}
1004974
config={bignumberConfig("total_cost", { aggregation: "sum" })}
1005975
{...widgetProps}
1006976
/>
1007977
</div>
1008-
<div className="h-[250px]">
978+
<div className="h-[120px]">
1009979
<MetricWidget
1010980
widgetKey={`${modelName}-user-ttfc`}
1011981
title="Avg TTFC"
@@ -1016,7 +986,7 @@ function DetailYourUsageTab({
1016986
{...widgetProps}
1017987
/>
1018988
</div>
1019-
<div className="h-[250px]">
989+
<div className="h-[120px]">
1020990
<MetricWidget
1021991
widgetKey={`${modelName}-user-tps`}
1022992
title="Avg tokens/sec"
@@ -1028,7 +998,7 @@ function DetailYourUsageTab({
1028998
/>
1029999
</div>
10301000

1031-
<div className="h-[250px]">
1001+
<div className="h-[400px]">
10321002
<MetricWidget
10331003
widgetKey={`${modelName}-user-cost-time`}
10341004
title="Cost over time"
@@ -1043,7 +1013,7 @@ function DetailYourUsageTab({
10431013
{...widgetProps}
10441014
/>
10451015
</div>
1046-
<div className="h-[250px]">
1016+
<div className="h-[400px]">
10471017
<MetricWidget
10481018
widgetKey={`${modelName}-user-tokens-time`}
10491019
title="Tokens over time"
@@ -1058,7 +1028,7 @@ function DetailYourUsageTab({
10581028
{...widgetProps}
10591029
/>
10601030
</div>
1061-
<div className="h-[250px]">
1031+
<div className="h-[400px]">
10621032
<MetricWidget
10631033
widgetKey={`${modelName}-user-tasks`}
10641034
title="Cost by task"

‎apps/webapp/app/v3/canAccessAiModels.server.ts‎

Lines changed: 0 additions & 47 deletions
This file was deleted.

‎apps/webapp/app/v3/featureFlags.ts‎

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,6 @@ export const FEATURE_FLAG = {
66
hasQueryAccess: "hasQueryAccess",
77
hasLogsPageAccess: "hasLogsPageAccess",
88
hasAiAccess: "hasAiAccess",
9-
hasAiModelsAccess: "hasAiModelsAccess",
109
hasComputeAccess: "hasComputeAccess",
1110
hasPrivateConnections: "hasPrivateConnections",
1211
} as const;
@@ -17,7 +16,6 @@ export const FeatureFlagCatalog = {
1716
[FEATURE_FLAG.hasQueryAccess]: z.coerce.boolean(),
1817
[FEATURE_FLAG.hasLogsPageAccess]: z.coerce.boolean(),
1918
[FEATURE_FLAG.hasAiAccess]: z.coerce.boolean(),
20-
[FEATURE_FLAG.hasAiModelsAccess]: z.coerce.boolean(),
2119
[FEATURE_FLAG.hasComputeAccess]: z.coerce.boolean(),
2220
[FEATURE_FLAG.hasPrivateConnections]: z.coerce.boolean(),
2321
};

‎packages/redis-worker/src/fair-queue/tests/fairQueue.test.ts‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -215,7 +215,7 @@ describe("FairQueue", () => {
215215
describe("basic enqueue and process", () => {
216216
redisTest(
217217
"should enqueue and process a single message",
218-
{ timeout: 15000 },
218+
{ timeout: 30000 },
219219
async ({ redisOptions }) => {
220220
const processed: string[] = [];
221221
keys = new DefaultFairQueueKeyProducer({ prefix: "test" });

0 commit comments

Comments
 (0)