(core) Adds a UI panel for managing webhooks

Summary:
This adds a UI panel for managing webhooks. Work started by Cyprien Pindat. You can find the UI on a document's settings page. Main changes relative to Cyprien's demo:

  * Changed behavior of virtual table to be more consistent with the rest of Grist, by factoring out part of the implementation of on-demand tables.
  * Cell values that would create an error can now be denied and reverted (as for the rest of Grist).
  * Changes made by other users are integrated in a sane way.
  * Basic undo/redo support is added using the regular undo/redo stack.
  * The table list in the drop-down is now updated if schema changes.
  * Added a notification from back-end when webhook status is updated so constant polling isn't needed to support multi-user operation.
  *  Factored out webhook specific logic from general virtual table support.
  * Made a bunch of fixes to various broken behavior.
  * Added tests.

The code remains somewhat unpolished, and behavior in the presence of errors is imperfect in general but may be adequate for this case.

I assume that we'll soon be lifting the restriction on the set of domains that are supported for webhooks - otherwise we'd want to provide some friendly way to discover that list of supported domains rather than just throwing an error.

I don't actually know a lot about how the front-end works - it looks like tables/columns/fields/sections can be safely added if they have string ids that won't collide with bone fide numeric ids from the back end. Sneaky.

Contains a migration, so needs an extra reviewer for that.

Test Plan: added tests

Reviewers: jarek, dsagal

Reviewed By: jarek, dsagal

Differential Revision: https://phab.getgrist.com/D3856

app/client/components/GristDoc.ts

@@ -46,6 +46,7 @@ import {DocTutorial} from 'app/client/ui/DocTutorial';
 import {isTourActive} from "app/client/ui/OnBoardingPopups";
 import {IPageWidget, toPageWidget} from 'app/client/ui/PageWidgetPicker';
 import {linkFromId, selectBy} from 'app/client/ui/selectBy';
+import {WebhookPage} from 'app/client/ui/WebhookPage';
 import {startWelcomeTour} from 'app/client/ui/WelcomeTour';
 import {IWidgetType} from 'app/client/ui/widgetTypes';
 import {PlayerState, YouTubePlayer} from 'app/client/ui/YouTubePlayer';
@@ -57,7 +58,7 @@ import {FieldEditor} from "app/client/widgets/FieldEditor";
 import {DiscussionPanel} from 'app/client/widgets/DiscussionEditor';
 import {MinimalActionGroup} from 'app/common/ActionGroup';
 import {ClientQuery} from "app/common/ActiveDocAPI";
-import {CommDocUsage, CommDocUserAction} from 'app/common/CommTypes';
+import {CommDocChatter, CommDocUsage, CommDocUserAction} from 'app/common/CommTypes';
 import {delay} from 'app/common/delay';
 import {DisposableWithEvents} from 'app/common/DisposableWithEvents';
 import {isSchemaAction, UserAction} from 'app/common/DocActions';
@@ -452,6 +453,8 @@ export class GristDoc extends DisposableWithEvents {
 
     this.listenTo(app.comm, 'docUsage', this.onDocUsageMessage);
 
+    this.listenTo(app.comm, 'docChatter', this.onDocChatter);
+
     this.autoDispose(DocConfigTab.create({gristDoc: this}));
 
     this.rightPanelTool = Computed.create(this, (use) => this._getToolContent(use(this._rightPanelTool)));
@@ -565,6 +568,7 @@ export class GristDoc extends DisposableWithEvents {
           content === 'acl' ? dom.create(AccessRules, this) :
           content === 'data' ? dom.create(RawDataPage, this) :
           content === 'settings' ? dom.create(DocSettingsPage, this) :
+          content === 'webhook' ? dom.create(WebhookPage, this) :
           content === 'GristDocTour' ? null :
           (typeof content === 'object') ? dom.create(owner => {
             // In case user changes a page, close the popup.
@@ -706,6 +710,10 @@ export class GristDoc extends DisposableWithEvents {
     }
   }
 
+  public getUndoStack() {
+    return this._undoStack;
+  }
+
   /**
    * Process usage and product received from the server by updating their respective
    * observables.
@@ -719,6 +727,13 @@ export class GristDoc extends DisposableWithEvents {
     });
   }
 
+  public onDocChatter(message: CommDocChatter) {
+    if (!this.docComm.isActionFromThisDoc(message)) { return; }
+    if (message.data.webhooks) {
+      this.trigger('webhooks', message.data.webhooks);
+    }
+  }
+
   public getTableModel(tableId: string): DataTableModel {
     return this.docModel.dataTables[tableId];
   }
@@ -1440,6 +1455,11 @@ export class GristDoc extends DisposableWithEvents {
       // This is raw data view
       await urlState().pushUrl({docPage: 'data'});
       this.viewModel.activeSectionId(sectionId);
+    } else if (section.isVirtual.peek()) {
+      // this is a virtual table, and therefore a webhook page (that is the only
+      // place virtual tables are used so far)
+      await urlState().pushUrl({docPage: 'webhook'});
+      this.viewModel.activeSectionId(sectionId);
     } else {
       const view: ViewRec = section.view.peek();
       await this.openDocPage(view.getRowId());