Eric Allam
c06005b353
## Summary Adds an in-dashboard AI agent: a chat panel, reachable from any environment page, that answers questions about your runs, errors, tasks, and analytics, diagnoses why a run failed, charts your data, reads your connected repo's source, and answers product and how-to questions. It is gated behind the `hasDashboardAgentAccess` feature flag (global or per-org, default off), so this PR ships disabled: the launcher is hidden unless the flag is enabled. ## Design The agent runs as a standalone `chat.agent` Trigger task in its own internal package, with no access to the webapp database, Prisma, or ClickHouse. It reads the user's data over the public API, acting as the user via a short-lived delegated user-actor token minted server-side each turn (never in the browser), building on [#3997](https://github.com/triggerdotdev/trigger.dev/pull/3997). The error and analytics tools use [#4005](https://github.com/triggerdotdev/trigger.dev/pull/4005) and the TRQL query API. The first turn of a new chat streams from a warm webapp route (Head Start) while the durable agent boots in parallel. Structured answers (a run-failure diagnosis card, a live chart) render through a small typed view catalog rather than arbitrary markup. A knowledge lane forwards product and how-to questions to the support assistant. Conversation history lives in a separate Drizzle-backed store on its own Postgres schema, kept as a display read-model so it can never corrupt the agent's model context. The SDK changes add an `apiClient` option to `chat.createStartSessionAction` and `chat.headStart`, and keep the Head Start tool-approval tail intact across a custom `prepareMessages` hook so prompt caching and Head Start compose.
144 lines
4.4 KiB
TypeScript
144 lines
4.4 KiB
TypeScript
import type { LinksFunction, LoaderFunctionArgs, MetaFunction } from "@remix-run/node";
|
|
import type { ShouldRevalidateFunction } from "@remix-run/react";
|
|
import { Links, LiveReload, Meta, Outlet, Scripts, ScrollRestoration } from "@remix-run/react";
|
|
import { type UseDataFunctionReturn, typedjson, useTypedLoaderData } from "remix-typedjson";
|
|
import { ExternalScripts } from "remix-utils/external-scripts";
|
|
import type { ToastMessage } from "~/models/message.server";
|
|
import { commitSession, getSession } from "~/models/message.server";
|
|
import tailwindStylesheetUrl from "~/tailwind.css";
|
|
import { RouteErrorDisplay } from "./components/ErrorDisplay";
|
|
import { AppContainer, MainCenteredContainer } from "./components/layout/AppLayout";
|
|
import { ShortcutsProvider } from "./components/primitives/ShortcutsProvider";
|
|
import { Toast } from "./components/primitives/Toast";
|
|
import { TimezoneSetter } from "./components/TimezoneSetter";
|
|
import { env } from "./env.server";
|
|
import { featuresForRequest } from "./features.server";
|
|
import { usePostHog } from "./hooks/usePostHog";
|
|
import { getUser } from "./services/session.server";
|
|
import { getTimezonePreference } from "./services/preferences/uiPreferences.server";
|
|
import { appEnvTitleTag } from "./utils";
|
|
|
|
export const links: LinksFunction = () => {
|
|
return [{ rel: "stylesheet", href: tailwindStylesheetUrl }];
|
|
};
|
|
|
|
export const headers = () => ({
|
|
"Referrer-Policy": "strict-origin-when-cross-origin",
|
|
"X-Content-Type-Options": "nosniff",
|
|
"Permissions-Policy":
|
|
"geolocation=(), microphone=(), camera=(), accelerometer=(), gyroscope=(), magnetometer=(), payment=(), usb=()",
|
|
});
|
|
|
|
export const meta: MetaFunction = ({ data }) => {
|
|
const typedData = data as UseDataFunctionReturn<typeof loader>;
|
|
return [
|
|
{ title: typedData?.appEnv ? `Trigger.dev${appEnvTitleTag(typedData.appEnv)}` : "Trigger.dev" },
|
|
{
|
|
name: "viewport",
|
|
content: "width=1024, initial-scale=1",
|
|
},
|
|
{
|
|
name: "robots",
|
|
content:
|
|
typeof window === "undefined" || window.location.hostname !== "cloud.trigger.dev"
|
|
? "noindex, nofollow"
|
|
: "index, follow",
|
|
},
|
|
];
|
|
};
|
|
|
|
export const loader = async ({ request }: LoaderFunctionArgs) => {
|
|
const session = await getSession(request.headers.get("cookie"));
|
|
const toastMessage = session.get("toastMessage") as ToastMessage;
|
|
const posthogProjectKey = env.POSTHOG_PROJECT_KEY;
|
|
const features = featuresForRequest(request);
|
|
const timezone = await getTimezonePreference(request);
|
|
|
|
const kapa = {
|
|
websiteId: env.KAPA_AI_WEBSITE_ID,
|
|
};
|
|
|
|
const user = await getUser(request);
|
|
|
|
const headers = new Headers();
|
|
headers.append("Set-Cookie", await commitSession(session));
|
|
|
|
return typedjson(
|
|
{
|
|
user,
|
|
toastMessage,
|
|
posthogProjectKey,
|
|
features,
|
|
appEnv: env.APP_ENV,
|
|
appOrigin: env.APP_ORIGIN,
|
|
apiOrigin: env.API_ORIGIN ?? env.APP_ORIGIN,
|
|
triggerCliTag: env.TRIGGER_CLI_TAG,
|
|
kapa,
|
|
timezone,
|
|
},
|
|
{ headers }
|
|
);
|
|
};
|
|
|
|
export type LoaderType = typeof loader;
|
|
|
|
export const shouldRevalidate: ShouldRevalidateFunction = (options) => {
|
|
if (options.formAction === "/resources/environment") {
|
|
return false;
|
|
}
|
|
|
|
return options.defaultShouldRevalidate;
|
|
};
|
|
|
|
export function ErrorBoundary() {
|
|
return (
|
|
<>
|
|
<html lang="en" className="h-full">
|
|
<head>
|
|
<meta charSet="utf-8" />
|
|
|
|
<Meta />
|
|
<Links />
|
|
</head>
|
|
<body className="h-full overflow-hidden bg-background-dimmed antialiased">
|
|
<ShortcutsProvider>
|
|
<AppContainer>
|
|
<MainCenteredContainer>
|
|
<RouteErrorDisplay />
|
|
</MainCenteredContainer>
|
|
</AppContainer>
|
|
</ShortcutsProvider>
|
|
<Scripts />
|
|
</body>
|
|
</html>
|
|
</>
|
|
);
|
|
}
|
|
|
|
export default function App() {
|
|
const { posthogProjectKey, kapa } = useTypedLoaderData<typeof loader>();
|
|
usePostHog(posthogProjectKey);
|
|
|
|
return (
|
|
<>
|
|
<html lang="en" className="h-full">
|
|
<head>
|
|
<Meta />
|
|
<Links />
|
|
</head>
|
|
<body className="h-full overflow-hidden bg-background-dimmed antialiased">
|
|
<ShortcutsProvider>
|
|
<TimezoneSetter />
|
|
<Outlet />
|
|
<Toast />
|
|
</ShortcutsProvider>
|
|
<ScrollRestoration />
|
|
<ExternalScripts />
|
|
<Scripts />
|
|
<LiveReload />
|
|
</body>
|
|
</html>
|
|
</>
|
|
);
|
|
}
|