How to update nested components based on data from their relational field?

System Information
  • Strapi Version: 4.1.5
  • Operating System: Windows 11
  • Database: PostgreSQL
  • Node Version: 16.13.1
  • NPM Version: 8.1.2
  • Yarn Version:

I have a Pages collection type and a Main Menu single type, in the Main Menu I have a repeatable component field called Items and on that component I have a relational field called Page and a nested repeatable component called Submenu, which also has a nested repeatable component with the same fields.
When you select a Page in the Items component it should fill it’s Title and Href fields based on the Page selected.
In v3 I had it working like this:

const updateFields = async items => items.forEach(async item => {
  if (item.submenu && item.submenu.length) await updateFields(item.submenu);

  if (item.page) {
    const page = await strapi.query('pages').findOne({id: item.page}).then(page => page)
      .catch(err => console.error(err));
    item.href = page.path;
    item.title = page.title;
  }
});

module.exports = {
  lifecycles: {
    async beforeCreate({ items }) {
      await updateFields(items);
    },
    async beforeUpdate(params, { items }) {
      await updateFields(items);
    }
  }
};

How would I go about this in v4?

1 Like

I would like to know this too!

Did you find a solution for it ?
I have a collection-type, in which there is a dynamic zone where some components contain a relational field.
Using the plugin - ‘strapi-plugin-populate-deep’, I’m able to populate the nested components of the dynamic zone but the issue is with the nested components used in the relational fields.