Nicer Slack flow. Improvement to evaluation scheduling

matt-aitken · matt-aitken · commit 497f3018e2d8 · 2026-03-20T15:04:56.000Z
diff --git a/apps/webapp/app/components/errors/ConfigureErrorAlerts.tsx b/apps/webapp/app/components/errors/ConfigureErrorAlerts.tsx
@@ -42,14 +42,17 @@ export const ErrorAlertsFormSchema = z.object({
   }, z.string().url().array()),
 });
 
-type ConfigureErrorAlertsProps = ErrorAlertChannelData;
+type ConfigureErrorAlertsProps = ErrorAlertChannelData & {
+  connectToSlackHref?: string;
+};
 
 export function ConfigureErrorAlerts({
   emails: existingEmails,
   webhooks: existingWebhooks,
   slackChannel: existingSlackChannel,
   slack,
   emailAlertsEnabled,
+  connectToSlackHref,
 }: ConfigureErrorAlertsProps) {
   const fetcher = useFetcher();
   const location = useOptimisticLocation();
@@ -216,17 +219,43 @@ export function ConfigureErrorAlerts({
                     />
                   </>
                 ) : slack.status === "NOT_CONFIGURED" ? (
-                  <Callout variant="info">
-                    Slack is not connected. Connect Slack from the{" "}
-                    <span className="font-medium text-text-bright">Alerts</span> page to enable
-                    Slack notifications.
-                  </Callout>
+                  connectToSlackHref ? (
+                    <LinkButton variant="tertiary/large" to={connectToSlackHref} fullWidth>
+                      <span className="flex items-center gap-2 text-text-bright">
+                        <SlackIcon className="size-5" /> Connect to Slack
+                      </span>
+                    </LinkButton>
+                  ) : (
+                    <Callout variant="info">
+                      Slack is not connected. Connect Slack from the{" "}
+                      <span className="font-medium text-text-bright">Alerts</span> page to enable
+                      Slack notifications.
+                    </Callout>
+                  )
                 ) : slack.status === "TOKEN_REVOKED" || slack.status === "TOKEN_EXPIRED" ? (
-                  <Callout variant="info">
-                    The Slack integration in your workspace has been revoked or expired. Please
-                    re-connect from the <span className="font-medium text-text-bright">Alerts</span>{" "}
-                    page.
-                  </Callout>
+                  connectToSlackHref ? (
+                    <div className="flex flex-col gap-4">
+                      <Callout variant="info">
+                        The Slack integration in your workspace has been revoked or has expired.
+                        Please re-connect your Slack workspace.
+                      </Callout>
+                      <LinkButton
+                        variant="tertiary/large"
+                        to={`${connectToSlackHref}?reinstall=true`}
+                        fullWidth
+                      >
+                        <span className="flex items-center gap-2 text-text-bright">
+                          <SlackIcon className="size-5" /> Connect to Slack
+                        </span>
+                      </LinkButton>
+                    </div>
+                  ) : (
+                    <Callout variant="info">
+                      The Slack integration in your workspace has been revoked or expired. Please
+                      re-connect from the{" "}
+                      <span className="font-medium text-text-bright">Alerts</span> page.
+                    </Callout>
+                  )
                 ) : slack.status === "FAILED_FETCHING_CHANNELS" ? (
                   <Callout variant="warning">
                     Failed loading channels from Slack. Please try again later.
diff --git a/apps/webapp/app/routes/_app.orgs.$organizationSlug.projects.$projectParam.env.$envParam.errors.$fingerprint/route.tsx b/apps/webapp/app/routes/_app.orgs.$organizationSlug.projects.$projectParam.env.$envParam.errors.$fingerprint/route.tsx
@@ -141,11 +141,32 @@ export const action = async ({ request, params }: ActionFunctionArgs) => {
       return json({ ok: true });
     }
     case "ignore": {
+      let occurrenceCountAtIgnoreTime: number | undefined;
+
+      if (submission.value.totalOccurrences) {
+        const qb = clickhouseClient.errors.listQueryBuilder();
+        qb.where("project_id = {projectId: String}", { projectId: project.id });
+        qb.where("environment_id = {environmentId: String}", {
+          environmentId: environment.id,
+        });
+        qb.where("error_fingerprint = {fingerprint: String}", { fingerprint });
+        qb.where("task_identifier = {taskIdentifier: String}", {
+          taskIdentifier: submission.value.taskIdentifier,
+        });
+        qb.groupBy("error_fingerprint, task_identifier");
+
+        const [err, results] = await qb.execute();
+        if (!err && results && results.length > 0) {
+          occurrenceCountAtIgnoreTime = results[0].occurrence_count;
+        }
+      }
+
       await actions.ignoreError(identifier, {
         userId,
         duration: submission.value.duration,
         occurrenceRateThreshold: submission.value.occurrenceRate,
         totalOccurrencesThreshold: submission.value.totalOccurrences,
+        occurrenceCountAtIgnoreTime,
         reason: submission.value.reason,
       });
       return json({ ok: true });
diff --git a/apps/webapp/app/routes/_app.orgs.$organizationSlug.projects.$projectParam.env.$envParam.errors.connect-to-slack.ts b/apps/webapp/app/routes/_app.orgs.$organizationSlug.projects.$projectParam.env.$envParam.errors.connect-to-slack.ts
@@ -0,0 +1,47 @@
+import { type LoaderFunctionArgs } from "@remix-run/server-runtime";
+import { prisma } from "~/db.server";
+import { redirectWithSuccessMessage } from "~/models/message.server";
+import { OrgIntegrationRepository } from "~/models/orgIntegration.server";
+import { findProjectBySlug } from "~/models/project.server";
+import { requireUserId } from "~/services/session.server";
+import {
+  EnvironmentParamSchema,
+  v3ErrorsPath,
+  v3ErrorsConnectToSlackPath,
+} from "~/utils/pathBuilder";
+
+export async function loader({ request, params }: LoaderFunctionArgs) {
+  const userId = await requireUserId(request);
+  const { organizationSlug, projectParam, envParam } = EnvironmentParamSchema.parse(params);
+
+  const url = new URL(request.url);
+  const shouldReinstall = url.searchParams.get("reinstall") === "true";
+
+  const project = await findProjectBySlug(organizationSlug, projectParam, userId);
+
+  if (!project) {
+    throw new Response("Project not found", { status: 404 });
+  }
+
+  const integration = await prisma.organizationIntegration.findFirst({
+    where: {
+      service: "SLACK",
+      organizationId: project.organizationId,
+    },
+  });
+
+  if (integration && !shouldReinstall) {
+    return redirectWithSuccessMessage(
+      `${v3ErrorsPath({ slug: organizationSlug }, project, { slug: envParam })}?alerts`,
+      request,
+      "Successfully connected your Slack workspace"
+    );
+  }
+
+  return await OrgIntegrationRepository.redirectToAuthService(
+    "SLACK",
+    project.organizationId,
+    request,
+    v3ErrorsConnectToSlackPath({ slug: organizationSlug }, project, { slug: envParam })
+  );
+}
diff --git a/apps/webapp/app/routes/_app.orgs.$organizationSlug.projects.$projectParam.env.$envParam.errors/route.tsx b/apps/webapp/app/routes/_app.orgs.$organizationSlug.projects.$projectParam.env.$envParam.errors/route.tsx
@@ -17,7 +17,7 @@ import { ErrorAlertChannelPresenter } from "~/presenters/v3/ErrorAlertChannelPre
 import { findProjectBySlug } from "~/models/project.server";
 import { findEnvironmentBySlug } from "~/models/runtimeEnvironment.server";
 import { requireUserId } from "~/services/session.server";
-import { EnvironmentParamSchema } from "~/utils/pathBuilder";
+import { EnvironmentParamSchema, v3ErrorsConnectToSlackPath } from "~/utils/pathBuilder";
 import {
   type CreateAlertChannelOptions,
   CreateAlertChannelService,
@@ -40,11 +40,16 @@ export const loader = async ({ request, params }: LoaderFunctionArgs) => {
   const presenter = new ErrorAlertChannelPresenter();
   const alertData = await presenter.call(project.id, environment.type);
 
+  const connectToSlackHref = v3ErrorsConnectToSlackPath({ slug: organizationSlug }, project, {
+    slug: envParam,
+  });
+
   return typedjson({
     alertData,
     projectRef: project.externalRef,
     projectId: project.id,
     environmentType: environment.type,
+    connectToSlackHref,
   });
 };
 
@@ -146,7 +151,7 @@ export const action = async ({ request, params }: ActionFunctionArgs) => {
 };
 
 export default function Page() {
-  const { alertData } = useTypedLoaderData<typeof loader>();
+  const { alertData, connectToSlackHref } = useTypedLoaderData<typeof loader>();
   const [searchParams] = useSearchParams();
   const showAlerts = searchParams.has("alerts");
 
@@ -160,7 +165,7 @@ export default function Page() {
           <>
             <ResizableHandle id="errors-alerts-handle" />
             <ResizablePanel id="errors-alerts" min="320px" default="420px" max="560px">
-              <ConfigureErrorAlerts {...alertData} />
+              <ConfigureErrorAlerts {...alertData} connectToSlackHref={connectToSlackHref} />
             </ResizablePanel>
           </>
         )}
diff --git a/apps/webapp/app/utils/pathBuilder.ts b/apps/webapp/app/utils/pathBuilder.ts
@@ -540,6 +540,14 @@ export function v3ErrorsPath(
   return `${v3EnvironmentPath(organization, project, environment)}/errors`;
 }
 
+export function v3ErrorsConnectToSlackPath(
+  organization: OrgForPath,
+  project: ProjectForPath,
+  environment: EnvironmentForPath
+) {
+  return `${v3ErrorsPath(organization, project, environment)}/connect-to-slack`;
+}
+
 export function v3ErrorPath(
   organization: OrgForPath,
   project: ProjectForPath,
diff --git a/apps/webapp/app/v3/services/alerts/errorAlertEvaluator.server.ts b/apps/webapp/app/v3/services/alerts/errorAlertEvaluator.server.ts
@@ -44,8 +44,8 @@ const DEFAULT_INTERVAL_MS = 300_000;
  */
 export class ErrorAlertEvaluator {
   constructor(
-    protected readonly _prisma: PrismaClientOrTransaction = $replica,
-    protected readonly _replica: PrismaClientOrTransaction = prisma,
+    protected readonly _prisma: PrismaClientOrTransaction = prisma,
+    protected readonly _replica: PrismaClientOrTransaction = $replica,
     protected readonly _clickhouse: ClickHouse = clickhouseClient
   ) {}
 
@@ -61,6 +61,18 @@ export class ErrorAlertEvaluator {
     }
 
     const minIntervalMs = this.computeMinInterval(channels);
+    const windowMs = nextScheduledAt - scheduledAt;
+
+    if (windowMs > minIntervalMs * 2) {
+      logger.info("[ErrorAlertEvaluator] Large evaluation window (gap detected)", {
+        projectId,
+        scheduledAt,
+        nextScheduledAt,
+        windowMs,
+        minIntervalMs,
+      });
+    }
+
     const allEnvTypes = this.collectEnvironmentTypes(channels);
     const environments = await this.resolveEnvironments(projectId, allEnvTypes);
 
@@ -97,7 +109,8 @@ export class ErrorAlertEvaluator {
 
       const classification = this.classifyError(error, state, firstSeenMs, scheduledAt, {
         occurrencesSince: occurrenceMap.get(key) ?? 0,
-        windowMs: nextScheduledAt - scheduledAt,
+        windowMs,
+        totalOccurrenceCount: error.occurrence_count,
       });
 
       if (classification) {
@@ -160,7 +173,7 @@ export class ErrorAlertEvaluator {
     state: ErrorGroupState | undefined,
     firstSeenMs: number,
     scheduledAt: number,
-    thresholdContext: { occurrencesSince: number; windowMs: number }
+    thresholdContext: { occurrencesSince: number; windowMs: number; totalOccurrenceCount: number }
   ): ErrorClassification | null {
     if (!state) {
       return firstSeenMs > scheduledAt ? "new_issue" : null;
@@ -186,7 +199,7 @@ export class ErrorAlertEvaluator {
 
   private isIgnoreBreached(
     state: ErrorGroupState,
-    context: { occurrencesSince: number; windowMs: number }
+    context: { occurrencesSince: number; windowMs: number; totalOccurrenceCount: number }
   ): boolean {
     if (state.ignoredUntil && state.ignoredUntil.getTime() <= Date.now()) {
       return true;
@@ -204,11 +217,12 @@ export class ErrorAlertEvaluator {
     }
 
     if (
-      state.ignoredUntilTotalOccurrences !== null &&
-      state.ignoredUntilTotalOccurrences !== undefined &&
-      state.ignoredAt
+      state.ignoredUntilTotalOccurrences != null &&
+      state.ignoredAtOccurrenceCount != null
     ) {
-      if (context.occurrencesSince >= state.ignoredUntilTotalOccurrences) {
+      const occurrencesSinceIgnored =
+        context.totalOccurrenceCount - Number(state.ignoredAtOccurrenceCount);
+      if (occurrencesSinceIgnored >= state.ignoredUntilTotalOccurrences) {
         return true;
       }
     }
@@ -387,14 +401,14 @@ export class ErrorAlertEvaluator {
       const state = stateMap.get(key);
       if (!state) continue;
 
-      await this,
-        this._prisma.errorGroupState.update({
+      await this._prisma.errorGroupState.update({
           where: { id: state.id },
           data: {
             status: "UNRESOLVED",
             ignoredUntil: null,
             ignoredUntilOccurrenceRate: null,
             ignoredUntilTotalOccurrences: null,
+            ignoredAtOccurrenceCount: null,
             ignoredAt: null,
             ignoredReason: null,
             ignoredByUserId: null,
diff --git a/apps/webapp/app/v3/services/errorGroupActions.server.ts b/apps/webapp/app/v3/services/errorGroupActions.server.ts
@@ -38,6 +38,7 @@ export class ErrorGroupActions {
         ignoredUntil: null,
         ignoredUntilOccurrenceRate: null,
         ignoredUntilTotalOccurrences: null,
+        ignoredAtOccurrenceCount: null,
         ignoredAt: null,
         ignoredReason: null,
         ignoredByUserId: null,
@@ -63,6 +64,7 @@ export class ErrorGroupActions {
       duration?: number;
       occurrenceRateThreshold?: number;
       totalOccurrencesThreshold?: number;
+      occurrenceCountAtIgnoreTime?: number;
       reason?: string;
     }
   ) {
@@ -83,6 +85,7 @@ export class ErrorGroupActions {
       ignoredUntil,
       ignoredUntilOccurrenceRate: params.occurrenceRateThreshold ?? null,
       ignoredUntilTotalOccurrences: params.totalOccurrencesThreshold ?? null,
+      ignoredAtOccurrenceCount: params.occurrenceCountAtIgnoreTime ?? null,
       ignoredReason: params.reason ?? null,
       ignoredByUserId: params.userId,
       resolvedAt: null,
@@ -123,6 +126,7 @@ export class ErrorGroupActions {
         ignoredUntil: null,
         ignoredUntilOccurrenceRate: null,
         ignoredUntilTotalOccurrences: null,
+        ignoredAtOccurrenceCount: null,
         ignoredAt: null,
         ignoredReason: null,
         ignoredByUserId: null,
diff --git a/internal-packages/database/prisma/migrations/20260320115950_add_ignored_at_occurrence_count_to_error_group_state/migration.sql b/internal-packages/database/prisma/migrations/20260320115950_add_ignored_at_occurrence_count_to_error_group_state/migration.sql
@@ -0,0 +1,2 @@
+-- AlterTable
+ALTER TABLE "public"."ErrorGroupState" ADD COLUMN     "ignoredAtOccurrenceCount" BIGINT;
diff --git a/internal-packages/database/prisma/schema.prisma b/internal-packages/database/prisma/schema.prisma
@@ -2687,6 +2687,10 @@ model ErrorGroupState {
    */
   ignoredUntilTotalOccurrences Int?
 
+  /// Total occurrence count at the time the error was ignored (from ClickHouse).
+  /// Used with ignoredUntilTotalOccurrences to compute occurrences since ignoring.
+  ignoredAtOccurrenceCount     BigInt?
+
   /**
    * Error was ignored at this date
    */

Original file line number	Diff line number	Diff line change
`@@ -0,0 +1,2 @@`
	`1`	`+-- AlterTable`
	`2`	`+ALTER TABLE "public"."ErrorGroupState" ADD COLUMN "ignoredAtOccurrenceCount" BIGINT;`