@integration-app/react 0.1.1

package/node_modules/@integration-app/sdk/src/flows/nodes/delete-data-record.ts

@@ -0,0 +1,6 @@
+import { FlowNodeSpec } from '.'
+
+export default new FlowNodeSpec({
+  name: 'Delete Data Record',
+  description: 'Delete a new data record from a collection using its id',
+})

package/node_modules/@integration-app/sdk/src/flows/nodes/filter.ts

@@ -0,0 +1,6 @@
+import { FlowNodeSpec } from '.'
+
+export default new FlowNodeSpec({
+  name: 'Filter',
+  description: 'Filter records that go forward through the flow',
+})

package/node_modules/@integration-app/sdk/src/flows/nodes/find-data-link.ts

@@ -0,0 +1,6 @@
+import { FlowNodeSpec } from '.'
+
+export default new FlowNodeSpec({
+  name: 'Find Data Link',
+  description: 'Find a link between records in your app and external app',
+})

package/node_modules/@integration-app/sdk/src/flows/nodes/find-data-record-by-id.ts

@@ -0,0 +1,6 @@
+import { FlowNodeSpec } from '.'
+
+export default new FlowNodeSpec({
+  name: 'Find Data Record By Id',
+  description: 'Find a single data record by id',
+})

package/node_modules/@integration-app/sdk/src/flows/nodes/find-data-records.ts

@@ -0,0 +1,6 @@
+import { FlowNodeSpec } from '.'
+
+export default new FlowNodeSpec({
+  name: 'Find Data Records',
+  description: 'Find records in a data collection by their field values',
+})

package/node_modules/@integration-app/sdk/src/flows/nodes/http-request.ts

@@ -0,0 +1,6 @@
+import { FlowNodeSpec } from '.'
+
+export default new FlowNodeSpec({
+  name: 'Http Request',
+  description: 'Send an arbitrary HTTP/S request',
+})

package/node_modules/@integration-app/sdk/src/flows/nodes/index.ts

@@ -0,0 +1,60 @@
+export enum FlowNodeType {
+  ApiTrigger = 'api-trigger',
+  ScheduleTrigger = 'schedule-trigger',
+  AppEventTrigger = 'app-event-trigger',
+  DataRecordCreatedTrigger = 'data-record-created-trigger',
+  DataRecordUpdatedTrigger = 'data-record-updated-trigger',
+  DataRecordDeletedTrigger = 'data-record-deleted-trigger',
+
+  TransformData = 'transform-data',
+  ListDataRecords = 'list-data-records',
+  FindDataRecords = 'find-data-records',
+  FindDataRecordById = 'find-data-record-by-id',
+  CreateDataRecord = 'create-data-record',
+  UpdateDataRecord = 'update-data-record',
+  DeleteDataRecord = 'delete-data-record',
+  HttpRequest = 'http-request',
+  Filter = 'filter',
+  CreateDataLink = 'create-data-link',
+  FindDataLink = 'find-data-link',
+}
+
+export interface FlowNodeSpec {
+  name: string
+  description: string
+  isTrigger?: boolean
+}
+
+export class FlowNodeSpec implements FlowNodeSpec {
+  constructor(args: FlowNodeSpec) {
+    Object.assign(this, args)
+  }
+}
+
+export const FLOW_NODE_SPECS: Record<FlowNodeType, FlowNodeSpec> = {
+  [FlowNodeType.ApiTrigger]: require('./api-trigger').default,
+  [FlowNodeType.ScheduleTrigger]: require('./schedule-trigger').default,
+  [FlowNodeType.AppEventTrigger]: require('./app-event-trigger').default,
+  [FlowNodeType.DataRecordCreatedTrigger]:
+    require('./data-record-created-trigger').default,
+  [FlowNodeType.DataRecordUpdatedTrigger]:
+    require('./data-record-updated-trigger').default,
+  [FlowNodeType.DataRecordDeletedTrigger]:
+    require('./data-record-deleted-trigger').default,
+
+  [FlowNodeType.ListDataRecords]: require('./list-data-records').default,
+  [FlowNodeType.FindDataRecords]: require('./find-data-records').default,
+  [FlowNodeType.FindDataRecordById]: require('./find-data-record-by-id')
+    .default,
+  [FlowNodeType.CreateDataRecord]: require('./create-data-record').default,
+  [FlowNodeType.UpdateDataRecord]: require('./update-data-record').default,
+  [FlowNodeType.DeleteDataRecord]: require('./delete-data-record').default,
+
+  [FlowNodeType.TransformData]: require('./transform-data').default,
+  [FlowNodeType.Filter]: require('./filter').default,
+
+  [FlowNodeType.HttpRequest]: require('./http-request').default,
+
+  [FlowNodeType.CreateDataLink]: require('./create-data-link').default,
+  [FlowNodeType.FindDataLink]: require('./find-data-link').default,
+}

package/node_modules/@integration-app/sdk/src/flows/nodes/list-data-records.ts

@@ -0,0 +1,7 @@
+import { FlowNodeSpec } from '.'
+
+export default new FlowNodeSpec({
+  name: 'List Data Records',
+  description:
+    'List all records from a data collection with an optional filter',
+})

package/node_modules/@integration-app/sdk/src/flows/nodes/schedule-trigger.ts

@@ -0,0 +1,7 @@
+import { FlowNodeSpec } from '.'
+
+export default new FlowNodeSpec({
+  name: 'Schedule Trigger',
+  description: 'Run flow on schedule',
+  isTrigger: true,
+})

package/node_modules/@integration-app/sdk/src/flows/nodes/transform-data.ts

@@ -0,0 +1,7 @@
+import { FlowNodeSpec } from '.'
+
+export default new FlowNodeSpec({
+  name: 'Transform Data',
+  description:
+    'Create a data structure of any shape by combining and transforming inputs',
+})

package/node_modules/@integration-app/sdk/src/flows/nodes/update-data-record.ts

@@ -0,0 +1,6 @@
+import { FlowNodeSpec } from '.'
+
+export default new FlowNodeSpec({
+  name: 'Update Data Record',
+  description: 'Update a new data record in a collection using its id',
+})

package/node_modules/@integration-app/sdk/src/flows/utils.test.ts

@@ -0,0 +1,63 @@
+import { Flow } from '.'
+import { getOrderedNodeKeys } from './utils'
+
+describe('flows/utils', () => {
+  it('should return nodes in order layer by layer', () => {
+    const flow = {
+      nodes: {
+        'root-1': {
+          links: [
+            {
+              key: 'child-level-1-1',
+            },
+            {
+              key: 'child-level-1-2',
+            },
+          ],
+        },
+        'root-2': {
+          links: [
+            {
+              key: 'child-level-1-2',
+            },
+            {
+              key: 'child-level-1-3',
+            },
+          ],
+        },
+        'child-level-1-1': {
+          links: [
+            {
+              key: 'child-level-2-1',
+            },
+          ],
+        },
+        'child-level-1-2': {},
+        'child-level-1-3': {
+          links: [
+            {
+              key: 'child-level-2-1',
+            },
+            {
+              key: 'child-level-2-2',
+            },
+          ],
+        },
+        'child-level-2-1': {},
+        'child-level-2-2': {},
+      },
+    }
+
+    const keysInOrder = [
+      'root-1',
+      'root-2',
+      'child-level-1-1',
+      'child-level-1-2',
+      'child-level-1-3',
+      'child-level-2-1',
+      'child-level-2-2',
+    ]
+
+    expect(getOrderedNodeKeys(flow as any as Flow)).toEqual(keysInOrder)
+  })
+})

package/node_modules/@integration-app/sdk/src/flows/utils.ts

@@ -0,0 +1,110 @@
+import { Flow, FlowInstance, FlowNode } from '.'
+import { FlowNodeSpec, FLOW_NODE_SPECS } from './nodes'
+
+export function getFlowNode(
+  flow: Flow | FlowInstance,
+  nodeKey: string,
+): FlowNode {
+  return flow.nodes?.[nodeKey]
+}
+
+export function getFlowNodeSpec(node: FlowNode): FlowNodeSpec {
+  if (!node) {
+    throw new Error(`getFlowNodeSpec called without a node`)
+  }
+  const spec = FLOW_NODE_SPECS[node.type]
+  if (!spec) {
+    throw new Error(`Unknow flow node type: ${node.type}`)
+  }
+  return spec
+}
+
+/**
+ * Returns keys of nodes that don't have any parents.
+ */
+export function getRootNodeKeys(flow: Flow | FlowInstance): string[] {
+  const allNodeKeys = Object.keys(flow.nodes ?? {})
+  const allLinkKeys = Object.values(flow.nodes ?? {})
+    .flatMap((n) => n.links?.map((l) => l.key) ?? [])
+    .filter(Boolean)
+  return allNodeKeys.filter((k) => !allLinkKeys.includes(k))
+}
+
+/**
+ * Returns nodes of a given flow linked from the given node via `node.links`
+ */
+export function getChildNodeKeys(
+  flow: Flow | FlowInstance,
+  nodeKey: string,
+): string[] {
+  const node = getFlowNode(flow, nodeKey)
+  const nodeLinks = node?.links || []
+  return nodeLinks.map((nodeLink) => nodeLink.key).filter(Boolean)
+}
+
+/**
+ * Return nodes that follow a given node - all the way until the end of the flow.
+ */
+export function getDownstreamNodeKeys(
+  flow: Flow | FlowInstance,
+  nodeKey: string,
+): string[] {
+  const linkedKeys = getChildNodeKeys(flow, nodeKey)
+  // Recursively find linked nodes for each linked node
+  return linkedKeys.concat(
+    linkedKeys.map((k) => getChildNodeKeys(flow, k)).flat(),
+  )
+}
+
+/**
+ * Returns list of node keys that have a link to the given node.
+ */
+export function getParentNodeKeys(
+  flow: Flow | FlowInstance,
+  nodeKey: string,
+): string[] {
+  return Object.keys(flow.nodes || {}).filter((key) => {
+    const node = getFlowNode(flow, key)
+    return node?.links?.some((link) => link.key === nodeKey)
+  })
+}
+
+/**
+ * Return nodes that precede a given node - all the way to the beginning(s) of the flow.
+ */
+export function getUpstreamNodeKeys(flow: Flow, nodeKey: string): string[] {
+  const parentKeys = getParentNodeKeys(flow, nodeKey)
+  // Recursively find previous nodes for each directly previous node
+  return parentKeys.concat(
+    parentKeys.map((n) => getUpstreamNodeKeys(flow, n)).flat(),
+  )
+}
+
+/**
+ * Returns keys of flow nodes in order of execution.
+ * If order of execution is not possible to determine (i.e. two triggers) - the returned order is arbitrary.
+ *
+ * This function allows executing operations on nodes that require upstream nodes to be processed first,
+ * such as node setup.
+ */
+export function getOrderedNodeKeys(flow: Flow | FlowInstance): string[] {
+  const rootNodeKeys = getRootNodeKeys(flow)
+  const orderedNodeKeys = rootNodeKeys
+  let hasMore = true
+
+  // Going layer after layer
+  while (hasMore) {
+    hasMore = false
+
+    for (const nodeKey of orderedNodeKeys) {
+      for (const childNodeKey of getChildNodeKeys(flow, nodeKey)) {
+        if (!orderedNodeKeys.includes(childNodeKey)) {
+          orderedNodeKeys.push(childNodeKey)
+          hasMore = true
+        }
+      }
+    }
+  }
+
+  return orderedNodeKeys
+}

package/node_modules/@integration-app/sdk/src/http-requests.ts

@@ -0,0 +1,41 @@
+export enum HttpRequestMethod {
+  GET = 'GET',
+  POST = 'POST',
+  PATCH = 'PATCH',
+  PUT = 'PUT',
+  DELETE = 'DELETE',
+}
+
+export interface HttpRequestSpec {
+  method?: HttpRequestMethod
+
+  uri: string
+
+  headers?: Record<string, string>
+
+  query?: Record<string, string>
+
+  body?: any
+}
+
+export const HTTP_REQUEST_SCHEMA = {
+  type: 'object',
+  properties: {
+    uri: { type: 'string' },
+    method: {
+      type: 'string',
+      enum: ['GET', 'POST', 'PUT', 'PATCH', 'DELETE'],
+    },
+    body: {},
+    query: {
+      type: 'object',
+      section: true,
+      additionalProperties: true,
+    },
+    headers: {
+      type: 'object',
+      section: true,
+      additionalProperties: true,
+    },
+  },
+}

package/node_modules/@integration-app/sdk/src/iframe.ts

@@ -0,0 +1,142 @@
+import { connectToChild } from 'penpal'
+import { insertCss } from 'insert-css'
+
+export const POPUP_ELEMENT_ID = '__integration-app-popup'
+const CONTAINER_ELEMENT_ID = '__integration-app-container'
+const BODY_CLASS = '__integration-app-open'
+let initialized = false
+let handshakeTimeout: any = null
+
+export interface OpenConfigurationOptions {
+  onClose?: () => void
+}
+
+export interface OpenIframeOptions extends OpenConfigurationOptions {
+  [key: string]: (...args: any[]) => void
+}
+
+/*
+Open a full-page iframe with a given URI and
+expose a list of callbacks to the page inside.
+
+Callbacks will be called be from inside the iframe using the `penpal` library.
+https://www.npmjs.com/package/penpal
+*/
+
+const HANDSHAKE_TIMEOUT_MS = 10000
+
+export async function openIframe(
+  uri: string,
+  callbacks: OpenIframeOptions = {},
+): Promise<void> {
+  if (!initialized) {
+    initialized = true
+    await init()
+  }
+
+  //  In case we had another iframe open - close it
+  close()
+
+  return new Promise((resolve) => {
+    function complete(callback) {
+      close(callback)
+      resolve()
+    }
+
+    handshakeTimeout = setTimeout(() => {
+      console.error(
+        'It takes too long for Integration UI to load. Something must be wrong.',
+      )
+      complete(callbacks.onClose)
+    }, HANDSHAKE_TIMEOUT_MS)
+
+    function handshake() {
+      clearHandshakeTimeout()
+    }
+
+    function doOpen() {
+      const iframe = document.createElement('iframe')
+      iframe.src = uri
+      iframe.id = POPUP_ELEMENT_ID
+      const container = document.getElementById(CONTAINER_ELEMENT_ID)
+      if (container) {
+        document.body.classList.add(BODY_CLASS)
+        container.appendChild(iframe)
+        container.style.display = 'block'
+        connectToChild({
+          iframe,
+          methods: {
+            ...callbacks,
+            close: () => complete(callbacks.onClose),
+            handshake,
+          },
+        })
+      } else {
+        throw Error(
+          'Integration.app container element not found. Was it manually removed?',
+        )
+      }
+    }
+
+    if (
+      document.readyState === 'complete' ||
+      document.readyState === 'interactive'
+    ) {
+      doOpen()
+    } else {
+      document.addEventListener('DOMContentLoaded', () => {
+        doOpen()
+      })
+    }
+  })
+}
+
+function close(callback?: (...args: any) => void) {
+  document.body.classList.remove(BODY_CLASS)
+  const container = document.getElementById(CONTAINER_ELEMENT_ID)
+  if (container) {
+    container.style.display = 'none'
+    if (container.firstChild) {
+      container.removeChild(container.firstChild)
+    }
+    if (callback) {
+      callback()
+    }
+  }
+  clearHandshakeTimeout()
+}
+
+export function init() {
+  const CONTAINER_ELEMENT_CLASS = '__integration-app-container'
+  insertCss(`
+    .${CONTAINER_ELEMENT_CLASS} {
+      position: fixed;
+      top: 0;
+      bottom: 0;
+      right: 0;
+      left: 0;
+      z-index: 2147483647;
+      display: none;
+    }
+    .${CONTAINER_ELEMENT_CLASS} iframe {
+      position: absolute;
+      width: 100%;
+      height: 100%;
+      border-width: 0;
+    }
+    body.${BODY_CLASS} {
+      overflow: hidden;
+    }
+  `)
+  const container = document.createElement('div')
+  container.id = CONTAINER_ELEMENT_ID
+  container.setAttribute('class', CONTAINER_ELEMENT_CLASS)
+  document.body.appendChild(container)
+}
+
+function clearHandshakeTimeout() {
+  if (handshakeTimeout) {
+    clearTimeout(handshakeTimeout)
+    handshakeTimeout = null
+  }
+}

package/node_modules/@integration-app/sdk/src/index.ts

@@ -0,0 +1,5 @@
+import { IntegrationAppClient } from './client'
+export { IntegrationAppClient } from './client'
+
+// For loading via <script> tag and for people who just want to `import iApp from '@integration-app/sdk'`
+export default new IntegrationAppClient({})

package/node_modules/@integration-app/sdk/src/integration-elements/index.ts

@@ -0,0 +1,24 @@
+export enum IntegrationElementType {
+  APP_DATA_SCHEMA = 'app-data-schema',
+  APP_EVENT_TYPE = 'app-event-type',
+  APP_DATA_COLLECTION = 'app-data-collection',
+  DATA_SOURCE = 'data-source',
+  SCHEMA = 'schema',
+  FIELD_MAPPING = 'field-mapping',
+  FLOW = 'flow',
+  INTEGRATION = 'integration',
+}
+
+export interface IntegrationElement {
+  type: IntegrationElementType
+  key?: string
+  id?: string
+  config?: any
+}
+
+export interface IntegrationElementInstance {
+  type: IntegrationElementType
+  id?: string
+  instanceId?: string
+  config?: any
+}

package/node_modules/@integration-app/sdk/src/integrations/accessors.ts

@@ -0,0 +1,162 @@
+import { Connection } from '../connections'
+import {
+  ConnectionMode,
+  FindIntegrationsQuery,
+  FindIntegrationsResponse,
+  Integration,
+} from '.'
+import { IntegrationAppClient } from '..'
+import { openIframe } from '../iframe'
+import { ElementAccessor } from '../accessors'
+import { CreateIntegrationRequest, UpdateIntegrationRequest } from './api'
+import { ConnectorSpec } from '../connector-api'
+import urljoin from 'url-join'
+
+export class IntegrationsAccessor {
+  constructor(private client: IntegrationAppClient) {}
+
+  async find(query: FindIntegrationsQuery): Promise<FindIntegrationsResponse> {
+    return this.client.get('/integrations', query)
+  }
+}
+
+export class IntegrationAccessor extends ElementAccessor<
+  Integration,
+  CreateIntegrationRequest,
+  UpdateIntegrationRequest
+> {
+  public baseUri: string
+
+  constructor(private client: IntegrationAppClient, private idOrKey: string) {
+    super({
+      client,
+      path: 'integrations',
+      idOrKey,
+    })
+  }
+
+  async getConnectorSpec(): Promise<ConnectorSpec> {
+    return this.client.get(`/integrations/${this.idOrKey}/connector-spec`)
+  }
+
+  async createConnection({ parameters }): Promise<Connection> {
+    const spec = await this.getConnectorSpec()
+
+    let iframeElement
+    if (spec.connectionMode === ConnectionMode.IFRAME) {
+      iframeElement = createIframeElement()
+    }
+
+    return new Promise((resolve, reject) => {
+      const connectionUrl = urljoin(
+        this.client.apiUri,
+        `oauth/new/${this.idOrKey}`,
+        `?token=${this.client.token}&connectionParameters=${JSON.stringify(
+          parameters,
+        )}`,
+      )
+
+      const urlObj = new URL(connectionUrl)
+
+      const requestId = (Math.random() + 1).toString(36).substring(0, 12)
+
+      const listenerFunc = async (event: any) => {
+        const message = event.data || {}
+        if (
+          message.source == 'integration.app' &&
+          message.requestId == requestId
+        ) {
+          cleanup()
+          if (message.type == 'newConnectionCreated') {
+            resolve(message.connection)
+          } else if (message.type == 'newConnectionCancel') {
+            resolve(null)
+          } else if (message.type == 'newConnectionFailure') {
+            reject(new Error(message.error))
+          }
+        }
+      }
+
+      let cancelCheckInterval: any
+
+      function cleanup() {
+        clearInterval(cancelCheckInterval)
+        window.removeEventListener('message', listenerFunc)
+      }
+
+      try {
+        window.addEventListener('message', listenerFunc)
+
+        urlObj.searchParams.append('requestId', requestId)
+
+        if (iframeElement) {
+          urlObj.searchParams.append('iframe', '1')
+          iframeElement.src = urlObj.toString()
+        } else {
+          const height = Math.round(screen.height * 0.6)
+          const width = Math.round(screen.width * 0.7)
+          const top = Math.round(screen.height * 0.2)
+          const left = Math.round(screen.height * 0.15)
+          const popup = window.open(
+            urlObj.toString(),
+            null,
+            `popup,width=${width},height=${height},left=${left},top=${top}`,
+          )
+          setTimeout(() => {
+            if (!popup) {
+              cleanup()
+              reject({
+                message: 'Popup has been blocked',
+              })
+            }
+          }, 1000)
+          cancelCheckInterval = setInterval(() => {
+            if (popup?.closed) {
+              cleanup()
+              resolve(null)
+            }
+          }, 1000)
+        }
+      } catch (e) {
+        reject(e)
+      }
+    })
+  }
+
+  /**
+   * Show connection UI to your user.
+   * Returns a promise that resolves to a new Connection object or
+   * null if the user cancels the connection flow.
+   */
+  async openNewConnection(): Promise<Connection> {
+    const uri = this.client.getEmbedUri(
+      `/integrations/${this.idOrKey}/connection/connect`,
+    )
+    return new Promise<Connection>((resolve) => {
+      openIframe(uri, {
+        onClose: () => resolve(null),
+        onSuccess: (connection) => resolve(connection),
+      })
+    })
+  }
+
+  /**
+   * @deprecated - use openNewConnection instead
+   */
+  async connect(): Promise<Connection> {
+    return this.openNewConnection()
+  }
+}
+
+function createIframeElement(): HTMLIFrameElement {
+  const iframeElement = document.createElement('iframe')
+  iframeElement.style.position = 'absolute'
+  iframeElement.style.top = '-100'
+  iframeElement.style.left = '-100'
+  iframeElement.style.width = '1'
+  iframeElement.style.height = '1'
+  iframeElement.style.border = 'none'
+  iframeElement.style.backgroundColor = 'transparent'
+  document.body.appendChild(iframeElement)
+  return iframeElement
+}