Skip to content

feat(site): add AI task status to deployment banner #18919

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
wants to merge 5 commits into
base: main
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
16 changes: 16 additions & 0 deletions coderd/aitasks.go
Original file line number Diff line number Diff line change
Expand Up @@ -61,3 +61,19 @@ func (api *API) aiTasksPrompts(rw http.ResponseWriter, r *http.Request) {
Prompts: promptsByBuildID,
})
}

// This endpoint is experimental and not guaranteed to be stable, so we're not
// generating public-facing documentation for it.
func (api *API) aiTasksStats(rw http.ResponseWriter, r *http.Request) {
ctx := r.Context()
_ = api // Suppress unused receiver warning

stats := codersdk.AITasksStatsResponse{
ActiveTasks: 3,
CompletedTasks: 15,
FailedTasks: 2,
TotalWorkspacesWithTasks: 8,
}

httpapi.Write(ctx, rw, http.StatusOK, stats)
}
1 change: 1 addition & 0 deletions coderd/coderd.go
Original file line number Diff line number Diff line change
Expand Up @@ -979,6 +979,7 @@ func New(options *Options) *API {
r.Use(apiKeyMiddleware)
r.Route("/aitasks", func(r chi.Router) {
r.Get("/prompts", api.aiTasksPrompts)
r.Get("/stats", api.aiTasksStats)
})
r.Route("/mcp", func(r chi.Router) {
r.Use(
Expand Down
7 changes: 7 additions & 0 deletions codersdk/aitasks.go
Original file line number Diff line number Diff line change
Expand Up @@ -18,6 +18,13 @@ type AITasksPromptsResponse struct {
Prompts map[string]string `json:"prompts"`
}

type AITasksStatsResponse struct {
ActiveTasks int `json:"active_tasks"`
CompletedTasks int `json:"completed_tasks"`
FailedTasks int `json:"failed_tasks"`
TotalWorkspacesWithTasks int `json:"total_workspaces_with_tasks"`
}

// AITaskPrompts returns prompts for multiple workspace builds by their IDs.
func (c *ExperimentalClient) AITaskPrompts(ctx context.Context, buildIDs []uuid.UUID) (AITasksPromptsResponse, error) {
if len(buildIDs) == 0 {
Expand Down
10 changes: 10 additions & 0 deletions site/src/api/api.ts
Original file line number Diff line number Diff line change
Expand Up @@ -2596,6 +2596,13 @@ class ApiMethods {
markAllInboxNotificationsAsRead = async () => {
await this.axios.put<void>("/api/v2/notifications/inbox/mark-all-as-read");
};

getAITasksStats = async (): Promise<TypesGen.AITasksStatsResponse> => {
const response = await this.axios.get<TypesGen.AITasksStatsResponse>(
"/api/experimental/aitasks/stats",
);
return response.data;
};
}

// Experimental API methods call endpoints under the /api/experimental/ prefix.
Expand Down Expand Up @@ -2701,9 +2708,12 @@ interface ClientApi extends ApiMethods {
}

class Api extends ApiMethods implements ClientApi {
experimental: ExperimentalApiMethods;

constructor() {
const scopedAxiosInstance = getConfiguredAxiosInstance();
super(scopedAxiosInstance);
this.experimental = new ExperimentalApiMethods(scopedAxiosInstance);
}

// As with ApiMethods, all public methods should be defined with arrow
Expand Down
9 changes: 9 additions & 0 deletions site/src/api/queries/aitasks.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,9 @@
import type { UseQueryOptions } from "react-query";
import { API } from "../api";
import type * as TypesGen from "../typesGenerated";

export const aiTasksStats =
(): UseQueryOptions<TypesGen.AITasksStatsResponse> => ({
queryKey: ["aitasks", "stats"],
queryFn: API.getAITasksStats,
});
8 changes: 8 additions & 0 deletions site/src/api/typesGenerated.ts

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

14 changes: 13 additions & 1 deletion site/src/modules/dashboard/DeploymentBanner/DeploymentBanner.tsx
Original file line number Diff line number Diff line change
@@ -1,5 +1,6 @@
import { aiTasksStats } from "api/queries/aitasks";
import { health } from "api/queries/debug";
import { deploymentStats } from "api/queries/deployment";
import { deploymentConfig, deploymentStats } from "api/queries/deployment";
import { useAuthenticated } from "hooks";
import type { FC } from "react";
import { useQuery } from "react-query";
Expand All @@ -19,10 +20,20 @@ const HIDE_DEPLOYMENT_BANNER_PATHS = [
export const DeploymentBanner: FC = () => {
const { permissions } = useAuthenticated();
const deploymentStatsQuery = useQuery(deploymentStats());
const deploymentConfigQuery = useQuery({
...deploymentConfig(),
enabled: permissions.viewDeploymentConfig,
});
const healthQuery = useQuery({
...health(),
enabled: permissions.viewDeploymentConfig,
});
const aiTasksQuery = useQuery({
...aiTasksStats(),
enabled:
permissions.viewDeploymentConfig &&
!deploymentConfigQuery.data?.config.hide_ai_tasks,
});
const location = useLocation();
const isHidden = HIDE_DEPLOYMENT_BANNER_PATHS.some((regex) =>
regex.test(location.pathname),
Expand All @@ -40,6 +51,7 @@ export const DeploymentBanner: FC = () => {
<DeploymentBannerView
health={healthQuery.data}
stats={deploymentStatsQuery.data}
aiTasksStats={aiTasksQuery.data}
fetchStats={() => deploymentStatsQuery.refetch()}
/>
);
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,7 @@ import Button from "@mui/material/Button";
import Link from "@mui/material/Link";
import Tooltip from "@mui/material/Tooltip";
import type {
AITasksStatsResponse,
DeploymentStats,
HealthcheckReport,
WorkspaceStatus,
Expand Down Expand Up @@ -41,12 +42,14 @@ const bannerHeight = 36;
interface DeploymentBannerViewProps {
health?: HealthcheckReport;
stats?: DeploymentStats;
aiTasksStats?: AITasksStatsResponse;
fetchStats?: () => void;
}

export const DeploymentBannerView: FC<DeploymentBannerViewProps> = ({
health,
stats,
aiTasksStats,
fetchStats,
}) => {
const theme = useTheme();
Expand Down Expand Up @@ -278,6 +281,34 @@ export const DeploymentBannerView: FC<DeploymentBannerViewProps> = ({
</div>
</div>

{aiTasksStats && (
<div css={styles.group}>
<div css={styles.category}>AI Tasks</div>
<div css={styles.values}>
<Tooltip title="Active AI Tasks">
<div css={styles.value}>
<WrenchIcon className="size-icon-xs" />
{aiTasksStats.active_tasks}
</div>
</Tooltip>
<ValueSeparator />
<Tooltip title="Completed AI Tasks">
<div css={styles.value}>
<CircleAlertIcon className="size-icon-xs" />
{aiTasksStats.completed_tasks}
</div>
</Tooltip>
<ValueSeparator />
<Tooltip title="Failed AI Tasks">
<div css={styles.value}>
<CircleAlertIcon className="size-icon-xs" />
{aiTasksStats.failed_tasks}
</div>
</Tooltip>
</div>
</div>
)}

<div
css={{
color: theme.palette.text.primary,
Expand Down
Loading