Skip to content

Instantly share code, notes, and snippets.

@tjanczuk
Created October 18, 2019 16:28
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save tjanczuk/0d664c2b809ad70fff5a023e8d606ff8 to your computer and use it in GitHub Desktop.
Save tjanczuk/0d664c2b809ad70fff5a023e8d606ff8 to your computer and use it in GitHub Desktop.
Fusebit Editor React
import React from "react";
export default class FusebitEditor extends React.Component {
constructor(props) {
super(props);
}
render() {
return (
<div style={{width: '100%', height: '100%'}} ref={el => this.el = el} />
);
}
componentDidMount() {
let initializeEditor = () => {
window.fusebit
.createEditor(
this.el,
this.props.boundaryId,
this.props.functionId,
this.props.account,
this.props.options
)
.then(editorContext => {
this.editorContext = editorContext;
if (this.props.onLoaded) {
this.props.onLoaded(editorContext);
}
})
.catch(e => {
if (this.props.onError) {
this.props.onError(e);
}
else {
throw e;
}
});
}
let fusebitLibUrl = `https://cdn.fusebit.io/fusebit/js/fusebit-editor/${(this.props.version || 'latest').replace(/\./g,'/')}/fusebit-editor.min.js`
let hasFusebitLib;
for (let i = 0; i < document.scripts.length; i++) {
if (document.scripts[i].src === fusebitLibUrl) {
hasFusebitLib = true;
break;
}
}
if (hasFusebitLib) {
return initializeEditor();
}
let script = document.createElement('script');
script.src = fusebitLibUrl;
script.async = true;
script.onload = () => initializeEditor();
document.head.appendChild(script);
}
componentWillUnmount() {
if (this.editorContext) {
this.editorContext.dispose();
this.editorContext = undefined;
}
}
}
<FusebitEditor
version="1.2.0"
boundaryId={params.boundaryId}
functionId={params.functionId}
account={{
accountId: params.accountId,
subscriptionId: params.subscriptionId,
baseUrl: profile.fusebitUrl,
accessToken: profile.auth.access_token,
}}
options={{
template: {},
editor: {
ensureFunctionExists: true,
theme: 'light',
},
}}
onLoaded={editorContext => {}}
onError={e => { throw e; }}
/>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment