feat: Support embed configuration (#3980)

* wip

* stash

* fix: make authenticationId nullable fk

* fix: apply generics to resolve compile time type errors

* fix: loosen integration settings

* chore: refactor into functional component

* feat: pass integrations all the way to embeds

* perf: avoid re-fetching integrations

* fix: change attr name to avoid type overlap

* feat: use hostname from embed settings in matcher

* Revert "feat: use hostname from embed settings in matcher"

This reverts commit e7485d9cda4dcf45104e460465ca104a56c67ddc.

* feat: refactor  into a class

* chore: refactor url regex formation as a util

* fix: escape regex special chars

* fix: remove in-house escapeRegExp in favor of lodash's

* fix: sanitize url

* perf: memoize embeds

* fix: rename hostname to url and allow spreading entire settings instead of just url

* fix: replace diagrams with drawio

* fix: rename

* fix: support self-hosted and saas both

* fix: assert on settings url

* fix: move embed integrations loading to hook

* fix: address review comments

* fix: use observer in favor of explicit state setters

* fix: refactor useEmbedIntegrations into useEmbeds

* fix: use translations for toasts

Co-authored-by: Tom Moor <tom.moor@gmail.com>

server/migrations/20220816070527-change-column-authentication-id-nullable.js

@@ -0,0 +1,17 @@
+"use strict";
+
+module.exports = {
+  async up(queryInterface, Sequelize) {
+    await queryInterface.changeColumn("integrations", "authenticationId", {
+      type: Sequelize.UUID,
+      allowNull: true,
+    });
+  },
+
+  async down(queryInterface, Sequelize) {
+    await queryInterface.changeColumn("integrations", "authenticationId", {
+      type: Sequelize.UUID,
+      allowNull: false,
+    });
+  },
+};

server/models/Integration.ts

@@ -5,7 +5,10 @@ import {
   Table,
   DataType,
   Scopes,
+  IsIn,
 } from "sequelize-typescript";
+import { IntegrationType } from "@shared/types";
+import type { IntegrationSettings } from "@shared/types";
 import Collection from "./Collection";
 import IntegrationAuthentication from "./IntegrationAuthentication";
 import Team from "./Team";
@@ -13,6 +16,15 @@ import User from "./User";
 import IdModel from "./base/IdModel";
 import Fix from "./decorators/Fix";
 
+export enum IntegrationService {
+  Diagrams = "diagrams",
+  Slack = "slack",
+}
+
+export enum UserCreatableIntegrationService {
+  Diagrams = "diagrams",
+}
+
 @Scopes(() => ({
   withAuthentication: {
     include: [
@@ -26,16 +38,19 @@ import Fix from "./decorators/Fix";
 }))
 @Table({ tableName: "integrations", modelName: "integration" })
 @Fix
-class Integration extends IdModel {
+class Integration<T = unknown> extends IdModel {
+  @IsIn([Object.values(IntegrationType)])
   @Column
   type: string;
 
+  @IsIn([Object.values(IntegrationService)])
   @Column
   service: string;
 
   @Column(DataType.JSONB)
-  settings: Record<string, any>;
+  settings: IntegrationSettings<T>;
 
+  @IsIn([["documents.update", "documents.publish"]])
   @Column(DataType.ARRAY(DataType.STRING))
   events: string[];
 

server/queues/processors/SlackProcessor.ts

@@ -1,5 +1,6 @@
 import fetch from "fetch-with-proxy";
 import { Op } from "sequelize";
+import { IntegrationType } from "@shared/types";
 import env from "@server/env";
 import { Document, Integration, Collection, Team } from "@server/models";
 import { presentSlackAttachment } from "@server/presenters";
@@ -32,7 +33,7 @@ export default class SlackProcessor extends BaseProcessor {
   }
 
   async integrationCreated(event: IntegrationEvent) {
-    const integration = await Integration.findOne({
+    const integration = (await Integration.findOne({
       where: {
         id: event.modelId,
         service: "slack",
@@ -45,7 +46,7 @@ export default class SlackProcessor extends BaseProcessor {
           as: "collection",
         },
       ],
-    });
+    })) as Integration<IntegrationType.Post>;
     if (!integration) {
       return;
     }
@@ -93,7 +94,7 @@ export default class SlackProcessor extends BaseProcessor {
       return;
     }
 
-    const integration = await Integration.findOne({
+    const integration = (await Integration.findOne({
       where: {
         teamId: document.teamId,
         collectionId: document.collectionId,
@@ -105,7 +106,7 @@ export default class SlackProcessor extends BaseProcessor {
           ],
         },
       },
-    });
+    })) as Integration<IntegrationType.Post>;
     if (!integration) {
       return;
     }

server/routes/api/integrations.ts

@@ -1,10 +1,20 @@
 import Router from "koa-router";
+import { has } from "lodash";
+import { IntegrationType } from "@shared/types";
 import auth from "@server/middlewares/authentication";
 import { Event } from "@server/models";
-import Integration from "@server/models/Integration";
+import Integration, {
+  UserCreatableIntegrationService,
+} from "@server/models/Integration";
 import { authorize } from "@server/policies";
 import { presentIntegration } from "@server/presenters";
-import { assertSort, assertUuid, assertArray } from "@server/validation";
+import {
+  assertSort,
+  assertUuid,
+  assertArray,
+  assertIn,
+  assertUrl,
+} from "@server/validation";
 import pagination from "./middlewares/pagination";
 
 const router = new Router();
@@ -33,8 +43,35 @@ router.post("integrations.list", auth(), pagination(), async (ctx) => {
   };
 });
 
-router.post("integrations.update", auth(), async (ctx) => {
-  const { id, events } = ctx.body;
+router.post("integrations.create", auth({ admin: true }), async (ctx) => {
+  const { type, service, settings } = ctx.body;
+
+  assertIn(type, Object.values(IntegrationType));
+
+  const { user } = ctx.state;
+  authorize(user, "createIntegration", user.team);
+
+  assertIn(service, Object.values(UserCreatableIntegrationService));
+
+  if (has(settings, "url")) {
+    assertUrl(settings.url);
+  }
+
+  const integration = await Integration.create({
+    userId: user.id,
+    teamId: user.teamId,
+    service,
+    settings,
+    type,
+  });
+
+  ctx.body = {
+    data: presentIntegration(integration),
+  };
+});
+
+router.post("integrations.update", auth({ admin: true }), async (ctx) => {
+  const { id, events = [], settings } = ctx.body;
   assertUuid(id, "id is required");
 
   const { user } = ctx.state;
@@ -43,12 +80,18 @@ router.post("integrations.update", auth(), async (ctx) => {
 
   assertArray(events, "events must be an array");
 
-  if (integration.type === "post") {
+  if (has(settings, "url")) {
+    assertUrl(settings.url);
+  }
+
+  if (integration.type === IntegrationType.Post) {
     integration.events = events.filter((event: string) =>
       ["documents.update", "documents.publish"].includes(event)
     );
   }
 
+  integration.settings = settings;
+
   await integration.save();
 
   ctx.body = {
@@ -56,7 +99,7 @@ router.post("integrations.update", auth(), async (ctx) => {
   };
 });
 
-router.post("integrations.delete", auth(), async (ctx) => {
+router.post("integrations.delete", auth({ admin: true }), async (ctx) => {
   const { id } = ctx.body;
   assertUuid(id, "id is required");
 

server/validation.ts

@@ -50,6 +50,17 @@ export const assertEmail = (value = "", message?: string) => {
   }
 };
 
+export const assertUrl = (value = "", message?: string) => {
+  if (
+    !validator.isURL(value, {
+      protocols: ["http", "https"],
+      require_valid_protocol: true,
+    })
+  ) {
+    throw ValidationError(message ?? `${value} is an invalid url!`);
+  }
+};
+
 export const assertUuid = (value: unknown, message?: string) => {
   if (typeof value !== "string") {
     throw ValidationError(message);