remove and add custom blocks

[Hateeb]

Hello Have any way to remove and add custom blocks by select option? https://i.imgur.com/JRy0zvd.png

[m-Ryan]

https://github.com/arco-design/easy-email/blob/master/packages/easy-email-extensions/readme.md#extensions Please see here.

More detail see https://github.com/arco-design/easy-email/blob/c3484e467437fb62ce8731dcaf3620630a2de1cd/packages/easy-email-extensions/src/ShortcutToolbar/utils/BlockMarketManager.ts

[Hateeb]

I have use remove category function for remove block then show this error HtmlStringToReactNodes.tsx:35 Warning: Cannot update a component (BlocksPanel) while rendering a different component (Editor). To locate the bad setState() call inside Editor, follow the stack trace as described in https://reactjs.org/link/setstate-in-render at Editor (http://localhost:3000/src/page/Editor/index.tsx?t=1658904334873:60:20) at Route2 (http://localhost:3000/node_modules/.vite/deps/react-router-dom.js?v=d1ba9c78:728:29) at Switch2 (http://localhost:3000/node_modules/.vite/deps/react-router-dom.js?v=d1ba9c78:872:29) at Router2 (http://localhost:3000/node_modules/.vite/deps/react-router-dom.js?v=d1ba9c78:454:30) at Suspense at Page (http://localhost:3000/src/components/Page/index.tsx:5:32) at Provider (http://localhost:3000/node_modules/.vite/deps/react-redux.js?v=d1ba9c78:156:20) at App

[xfinitysoft]

Hi Ryan

We are also looking for the same feature, Can you please provide an Full example of the code ? Looking forward to your cooperation on this.

The code you have provided is not helping us. Is it possible to provide an complete example ?

Thank You

[m-Ryan]

Maybe you can try the new feature of StandardLayout

const categories: ExtensionProps['categories'] = [
  {
    label: 'Content',
    active: true,
    blocks: [
      {
        type: AdvancedType.TEXT,
      },
      {
        type: AdvancedType.IMAGE,
        payload: { attributes: { padding: '0px 0px 0px 0px' } },
      },
      {
        type: AdvancedType.BUTTON,
      },
      {
        type: AdvancedType.SOCIAL,
      },
      {
        type: AdvancedType.DIVIDER,
      },
      {
        type: AdvancedType.SPACER,
      },
      {
        type: AdvancedType.HERO,
      },
      {
        type: AdvancedType.WRAPPER,
      },
    ],
  },
  {
    label: 'Layout',
    active: true,
    displayType: 'column',
    blocks: [
      {
        title: '2 columns',
        payload: [
          ['50%', '50%'],
          ['33%', '67%'],
          ['67%', '33%'],
          ['25%', '75%'],
          ['75%', '25%'],
        ],
      },
      {
        title: '3 columns',
        payload: [
          ['33.33%', '33.33%', '33.33%'],
          ['25%', '25%', '50%'],
          ['50%', '25%', '25%'],
        ],
      },
      {
        title: '4 columns',
        payload: [[['25%', '25%', '25%', '25%']]],
      },
    ],
  },
];

 <EmailEditorProvider
      data={initialValues}
      height={'calc(100vh - 72px)'}
      autoComplete
      dashed={false}
    >
      {({ values }) => {
        return (
          <StandardLayout
            compact={!smallScene}
            categories={categories}
            showSourceCode={true}
          >
            <EmailEditor />
          </StandardLayout>
        );
      }}
    </EmailEditorProvider>

[xfinitysoft]

Hi @m-Ryan

Thank You for your quick response.

We will be very thankful if you can provide example code specifically for this version : Screenshot

As you know code from inside and out. It will be very kind to provide just an example code to add and remove the blocks base on the selected option.

Looking forward to your quick response. Thank You

[KalanaPerera]

XfinitySoft dude this is not StackOverflow,

[turkdemir]

Hi @m-Ryan, Very appreciate for this editor. İ was trying to add custom block but didnt worked regularly. When i checked your example; i realized that yours is also not working regularly. https://email.maocanhua.cn/editor?id=1192&userId=107 i tried to fix this issue but couldnt. something missing when creating custom blocks. I would be glad if you could take a look at this case. Sincere...

[m-Ryan]

https://github.com/zalify/easy-email/blob/master/demo/src/pages/Editor/components/CustomBlocks/ProductRecommendation/index.tsx#L90-L92 I have updated the demo, please check again. @turkdemir

Relaived: https://github.com/zalify/easy-email/pull/148/files#diff-761a7cf58ca8094c34cc845043f7fe01f5a50d820db6e174bd89f0964128bd37

[turkdemir]

Hi @m-Ryan , It is working, i can select custom block body now, changing custom block general properties. Next item is manupilating items inside custom block, i think i can handle it; i will try.
Thank you very much.