@team_seki/extension-sdk NPM

Models and utilities for extensions

How to implement an extension

Install the SDK

npm install @team_seki/extension-sdk

The extension is just a web project. When an extension is loaded, it should call ExtensionSDK.notifyLoaded to notify Seki that it is ready.

import { IExtensionContextData, ExtensionSDK } from '@team_seki/extension-sdk'

export default class App extends React.Component<IProps, PageState> {

  extensionId = 'awesome'

  override componentDidMount() {
    // notify seki that the extension is ready
    new ExtensionSDK(this.extensionId).notifyLoaded()
  }
  ...
}

Then Seki will send an instance of IExtensionContextData to the extension iframe using window.postMessage(). The extension must register an event listener to handle the event.

window.addEventListener('message', (e: MessageEvent<IExtensionContextData>) => {
  if (this.extensionId == e.data.extensionId) { // the message is addressed to this extension
    if (!e.data.productName || !e.data.authToken) {
      this.setState({ view: 'INVALID_PARAMS' });
      return;
    }

    this.setState({ view: 'READY', context: e.data})
  }
})

The IExtensionContextData object contains the workspace. You can used it to access the product name, the projects, cloud components, etc.

const extensionContextData = e.data

const productName = extensionContextData.productName

const theWorkspace = extensionContextData.workspace
const theProjects = theWorkspace.projects
const theCloudComponents = theWorkspace.cloud.components

Use the Seki SDK to access other functionality

import { SekiSDK } from '@team_seki/extension-sdk'

...

const seki = new SekiSDK(secrets.SEKI_API_URL, extensionContextData.authToken)

const repositoryInfo = seki.getProductRepository(extensionContextData.productName)
const cloudComponentSettings = seki.getCloudComponentSettings(extensionContextData.productName, 'staging', 'mongodb', 'default')

Examples