UseSelect in deprecated Migrate function ?

  • Resolved antoniomartoni

    (@antoniomartoni)


    7 months, 3 weeks ago

    Hi Everyone,

    I’m currently working on a block deprecation for a custom Block and I’m looking for a way to get the post title in the migrate function.

    Previously, the block had a blockCustomTitle (optional) and a pageHeaderTitle attribute which have been deleted in the new version, and replaced by core/heading and core/paragraph blocks.

    When migrating the block from the old version to the new one, I would like to use the post title and pass it into a new core/heading.

    Obviously, useSelect does not working because it is asynchronous.

    But I am then wondering if there is a way to get dynamic data when migrating a deprecated block (getting post informations, meta, etc…) ?

    migrate(attributes, innerBlocks) {
  const { blockCustomTitle, pageHeaderTitle,...restAttributes } = attributes;

const pageTitle = useSelect((select) => {
  const { getEditedPostAttribute } = select("core/editor");
        return getEditedPostAttribute("title");
});

return [
  restAttributes,
  [
    createBlock("homegrade-content-blocks/section-titling",
      {
        content: attributes.sectionTitle,
        level: 3,
      },
      [ 
         createBlock("core/heading", {
           placeholder: "Titre de section",
           content: attributes.hasCustomTitle ? blockCustomTitle : pageTitle,
           level: 1,
           className: "section_titling__title",
         }),
         createBlock("core/paragraph", 
         { 
            content: attributes.pageHeaderTitle,
            placeholder: "Tapez votre sous-titre...",
            className: "section_titling__subtitle",
          }),
       ],
     ),
      ...innerBlocks,
     ],
  ];
},





Viewing 3 replies - 1 through 3 (of 3 total)

  • I did some testing on this and I don’t think this is possible. You cannot use any hooks in the migrate function as it’s not a React component. I was able to use the select directly but I believe that the data stores (at least in my testing) are not populated when this code is run.

    I tried to use getCurrentPostAttribute instead of getEditedPostAttribute to try and pull the title that would be in the database instead of the one stored in state. I believe they are both the same when the post is first loaded anyway but it was worth a try but the result was the same with both returning undefined

    I also tried to use async/await to see if that would allow the code to get access to the store, again with the same results.

    The migrate function is really supposed to be used to move existing attributes around and I could find no examples in Gutenberg source that would lead me to believe that we can access data with it.

    My recommendation would be to map the existing attribute to the page title and then handle any changes in your new version of the block with perhaps a useEffect

    Thread Starter antoniomartoni

    (@antoniomartoni)

    Many Thanks again @welcher for yet another excellent answer, and taking the time to make some test about this topic.

    I came to the same conclusion, as you did, and will proceed as you told.

    Thanks also @welcher for the nice explanation from this video about deprecation which completes the well made deprecation documentation page

    Thread Starter antoniomartoni

    (@antoniomartoni)

    Part of this problem was also due to the use of a dynamic block (to display some data — like post title, post date etc… — dynamically with php on the front end) but still saving <innerBlocks />, which might not be the best practice. This migration was then a logic issue caused by this mix.

    As I am not sure if using innerBlocks in dynamic block is good practice, I took the liberty to ask here.

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘UseSelect in deprecated Migrate function ?’ is closed to new replies.