Support App/Integration subscriptions on status pages (like Slack/Discord/Microsoft Teams,...)

[mxkaske]

Description

Right now, we can subscribe to a status page via RSS/Atom and Email.

We'd like to include Apps/Integrations like Slack/Discord/Microsoft Teams where all are heavily work on webhook notifications.

Schema: Reminds a bit like the Notifications tab in the Dashboard.

const pageNotificationProvider = ["slack", ... ] as const;

export const pageNotification = sqliteTable("page_notification", {
  id: integer("id").primaryKey(),
  name: text("name").notNull(),
  provider: text("provider", { enum: pageNotificationProvider }).notNull(),
  data: text("data").default("{}"),
  pageId: integer("page_id").references(() => page.id),
  workspaceId: integer("workspace_id").references(() => workspace.id),
  createdAt: integer("created_at", { mode: "timestamp" }).default(
    sql`(strftime('%s', 'now'))`,
  ),
  updatedAt: integer("updated_at", { mode: "timestamp" }).default(
    sql`(strftime('%s', 'now'))`,
  ),
});

The data (or maybe config is a better wording) will be a validated zod schema based on the provider.

UI: Extend the SubscribeButton to include new DropdownMenuItems. Open a Dialog with a form and the input field to enter the data values based on the provider selected.

Plan: It will be available for paid users in general and requires to update the limits object.

To keep in mind: Right now, users can only subscribe to an entire page - not component specific. We'd like to allow users to subscribe to specific monitors in the future. That should not be a problem. We can either create a monitorIds: text("monitor_ids") column where monitorIds.split(",") and monitorIds.join(",") and saved in the db within a single entry - or, create a relational table schema like page_notification_to_monitor. That should work for page_subscriber as well.