0.0.30 • Published 4 years ago
editor-plugin v0.0.30
Builder.io Editor Plugins for Mira
Setting up local environment
- Clone this repo to your local
- Run
npm i && npm run start
- Go to beta.builder.io and create a new org called something like
Mira Local Chris
using your first name. - Navigate to Account > Organization > Plugins and set it to
http://localhost:1268/plugin.system.js
Development tips
Updating models
In builder.io when you create or update the fields of a data model, you need to copy that configuration to code.
1. In the browser, on the model edit page, run JSON.stringify(builder.editingModel.fields, null, 2)
(or JSON.stringify(builder.editingModel.toJSON(), null, 2)
to see the full model)
1. Copy the fields array to the models.json file, under a key that is the name of the model.
1. Visit https://beta.builder.io/apps/mira/update-models
to update your db from the JSON.
Context Examples
- Permissions check:
context.user.can('editCode')
- Current content being edited:
context.designerState.editingContentModel
- Edit content (pass in either json or a content object):
context.content.update(theContent)
orcontext.createContent('my-model', theContent)
- soft delete:
context.content.update({...content, published: 'archived'})
- permanent delete(NOTE: PLEASE DO NOT USE THIS):
context.content.remove({id: 'content-id'})
- Update preview URL:
context.designerState.editingContentModel.previewUrl = '…'
Creating/Updating models with reference model fields manually in different env
- copy the fields of the model by going to the dev org(where the model originally is created) and copy to clipboard all the fields using this in console
builder.copyToClipboard(JSON.stringify(builder.editingModel.fields))
- Create the model/reference model with the correct model name from the UI in the environment you want.
- update all reference model fields with the corresponding model id of that environment(created above)
- replace the fields using this in concole
builder.editingModel.fields.replace(paste fields from step 1)
Note: we will be automating dependent field updates.
UI React Component Guide
https://wiki-berlin.global.umusic.net/wiki/display/OCP/UI+React+Component+Guide