From 0f5c58d6a4be77935c1e7dcd07225d3bc375e4ff Mon Sep 17 00:00:00 2001 From: Vitalii Nobis Date: Wed, 22 Jun 2022 16:46:11 +0300 Subject: [PATCH] feat: add Page Blocks docs, fix typos in Block Category docs --- .../references/lifecycle-events.mdx | 172 ++++++++++++++++-- 1 file changed, 157 insertions(+), 15 deletions(-) diff --git a/src/pages/docs/page-builder/references/lifecycle-events.mdx b/src/pages/docs/page-builder/references/lifecycle-events.mdx index 54c2329cc..40e426f98 100644 --- a/src/pages/docs/page-builder/references/lifecycle-events.mdx +++ b/src/pages/docs/page-builder/references/lifecycle-events.mdx @@ -952,15 +952,9 @@ new ContextPlugin(async (context) => { }) ``` - - -Please, be aware that you can change what ever you want on the object before it is stored into the database, so be careful with changing the data. - - - ## Block Categories -### OnBeforeBlockCategoryCreateTopicParams +### OnBeforeBlockCategoryCreate This event is triggered before new block category is stored into the database. @@ -987,7 +981,7 @@ new ContextPlugin(async (context) => { }) ``` -### OnAfterBlockCategoryCreateTopicParams +### OnAfterBlockCategoryCreate This event is triggered after new block category is stored into the database. @@ -1007,7 +1001,7 @@ new ContextPlugin(async (context) => { }) ``` -### OnBeforeBlockCategoryUpdateTopicParams +### OnBeforeBlockCategoryUpdate This event is triggered before existing block category is updated and stored. @@ -1034,7 +1028,7 @@ new ContextPlugin(async (context) => { }) ``` -### OnAfterBlockCategoryUpdateTopicParams +### OnAfterBlockCategoryUpdate This event is triggered after existing block category is updated and stored. @@ -1055,7 +1049,7 @@ new ContextPlugin(async (context) => { }) ``` -### OnBeforeBlockCategoryDeleteTopicParams +### OnBeforeBlockCategoryDelete This event is triggered before block category is deleted from the database. @@ -1069,7 +1063,7 @@ This event is triggered before block category is deleted from the database. ```typescript new ContextPlugin(async (context) => { - context.pageBuilder.onBeforeBlockCategoryDelete.subscribe(async ({ original, blockCategory }) => { + context.pageBuilder.onBeforeBlockCategoryDelete.subscribe(async ({ blockCategory }) => { /** * For example, we do not want to allow certain category with a name "All Advertisement Blocks" to be deleted. */ @@ -1081,7 +1075,7 @@ new ContextPlugin(async (context) => { }) ``` -### OnAfterBlockCategoryDeleteTopicParams +### OnAfterBlockCategoryDelete This event is triggered after block category is deleted from the database. @@ -1095,14 +1089,162 @@ This event is triggered after block category is deleted from the database. ```typescript new ContextPlugin(async (context) => { - context.pageBuilder.onAfterBlockCategoryDelete.subscribe(async ({ original, blockCategory }) => { - await deleteBlockCategoryFromAnotherSystem({ original, blockCategory }) + context.pageBuilder.onAfterBlockCategoryDelete.subscribe(async ({ blockCategory }) => { + await deleteBlockCategoryFromAnotherSystem({ blockCategory }) + }) +}) +``` + +## Page Blocks + +### onBeforePageBlockCreate + +This event is triggered before new page block is stored into the database. + +#### Event arguments + +| Property | Description | +| --------- | ---------------------------------------------- | +| pageBlock | Page Block object which is going to be stored | + +#### How to subscribe to this event? + +```typescript +new ContextPlugin(async (context) => { + context.pageBuilder.onBeforePageBlockCreate.subscribe(async ({ pageBlock }) => { + /** + * For example, all page block names have to be in UPPERCASE. + * You can check name and convert it if needed. + */ + if (pageBlock.name !== pageBlock.name.toUpperCase()) { + pageBlock.name = pageBlock.name.toUpperCase() + } + }) +}) +``` + +### onAfterPageBlockCreate + +This event is triggered after new page block is stored into the database. + +#### Event arguments + +| Property | Description | +| --------- | ------------------------------------------- | +| pageBlock | Page Block object which was stored | + +#### How to subscribe to this event? + +```typescript +new ContextPlugin(async (context) => { + context.pageBuilder.onAfterPageBlockCreate.subscribe(async ({ pageBlock }) => { + await storePageBlockToAnotherSystem({ pageBlock }) + }) +}) +``` + +### onBeforePageBlockUpdate + +This event is triggered before existing page block is updated and stored. + +#### Event arguments + +| Property | Description | +| --------- | ------------------------------------------------------ | +| original | Page Block object which was received from the database | +| pageBlock | Page Block object which is going to be stored | + +#### How to subscribe to this event? + +```typescript +new ContextPlugin(async (context) => { + context.pageBuilder.onBeforePageBlockUpdate.subscribe(async ({ original, pageBlock }) => { + /** + * For example, you do not want to allow block category changes. + */ + if (original.blockCategory === pageBlock.blockCategory) { + return + } + throw new Error(`You are not allowed to change the page block category.`) + }) +}) +``` + +### onAfterPageBlockUpdate + +This event is triggered after existing page block is updated and stored. + +#### Event arguments + +| Property | Description | +| --------- | ------------------------------------------------------ | +| original | Page Block object which was received from the database | +| pageBlock | Page Block object which is going to be stored | + +#### How to subscribe to this event? + +```typescript +new ContextPlugin(async (context) => { + context.pageBuilder.onAfterPageBlockUpdate.subscribe(async ({ original, pageBlock }) => { + await storePageBlockToAnotherSystem({ original, pageBlock }) + }) +}) +``` + +### onBeforePageBlockDelete + +This event is triggered before page block is deleted from the database. + +#### Event arguments + +| Property | Description | +| --------- | ---------------------------------------------- | +| pageBlock | Page Block object which is going to be deleted | + +#### How to subscribe to this event? + +```typescript +new ContextPlugin(async (context) => { + context.pageBuilder.onBeforePageBlockDelete.subscribe(async ({ pageBlock }) => { + /** + * For example, we do not want to allow certain block with a name "Heading" to be deleted. + */ + if (pageBlock.name !== "Heading") { + return + } + throw new Error(`You are not allowed to delete a page block with name "Heading".`) + }) +}) +``` + +### onAfterPageBlockDelete + +This event is triggered after page block is deleted from the database. + +#### Event arguments + +| Property | Description | +| --------- | ----------------------------------- | +| pageBlock | Page Block object which was deleted | + +#### How to subscribe to this event? + +```typescript +new ContextPlugin(async (context) => { + context.pageBuilder.onAfterPageBlockDelete.subscribe(async ({ pageBlock }) => { + await deletePageBlockFromAnotherSystem({ pageBlock }) }) }) ``` ## Registering Lifecycle Event Subscriptions + + +Please, be aware that you can change what ever you want on the object before it is stored into the database, so be careful with changing the data. + + + For the subscriptions (your code) to be run, you must register it in the `createHandler` in the `api/code/graphql/src/index.ts` file. ```typescript api/code/graphql/src/index.ts