Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

getResource() in a nested for loop and props not updated with fetched data

See original GitHub issue


Please I have this issue when fetching Layout Builder, I have the following code.

export default function LB(props){

    const LB: Array<any> = props.LBPage.layout_builder__layout;

    /*const pageStructure = {
        sectionsNum: LB.length,
        sectionsSetting: [],
        contentTypes: [],

    // Add each section setting to the pageStructure

    LB.forEach(section => {
        const sectionSetting = {
            columns: null,
            column_widths: section.section.layout_settings.column_widths,
            context_mapping: section.section.layout_settings.context_mapping,
            label: section.section.layout_settings.label,

        sectionSetting.columns = sectionSetting.column_widths ? sectionSetting.column_widths.split('-').length : null;


    console.log(LB, props.resource, props.resource[1], props);

    return (
       => {
                    return <section className={
                                section.section.layout_settings.column_widths.split('-').length + '-col' + ' ' + 'col-' +section.section.layout_settings.column_widths
export async function getStaticProps(){

    let resource = [];
    let resources = [];

    const  LBPage = await getResource('node--page', '6acb560b-f999-4011-9bab-160856d21f9f')

    LBPage.layout_builder__layout.forEach((section, i) => {

        resource.push({section: []});

        //console.log('sections: ', section.section.components)

        // console.log('section.section.components: ', section.section.components, section.section);

        section.section.components.forEach(async (comp, j) => {
            //console.log('resource[i]: ', i, j);
            //console.log('component: ', comp.provider);
            //console.log('params: ', comp.configuration.provider + "--basic",, + ':', ''));

            if(comp.configuration.provider === 'block_content'){
                const nodeType = comp.configuration.provider + "--basic";
                const nodeUid = + ':', '');

                const blocks = await getResource(nodeType, nodeUid);
                console.log(i, 'Response: ', resource[i].section, blocks);
                setTimeout(() => {
                }, 15000);


    return {
        props: {

LBPage fetched normally but resource has empty arrays here is it hen logged on the devtool

resource: [
        "section": []
        "section": []
        "section": []
        "section": []

every section there should has it’s own blocks inside the array, by the way, the blocks fetched has been logged on the server nodejs but not passed to props

resources is just to know whether the block inside the if condition work or not

Thanks in advance.

Issue Analytics

  • State:open
  • Created a year ago
  • Comments:7

github_iconTop GitHub Comments

ansdbcommented, Jun 22, 2022


@shadcn Yes I use that layout builder patch

Okay thanks a lot, I will test what you say and come back to you with the result

Thanks a lot for both of you.

shadcncommented, Jun 22, 2022

You’re probably using the layout builder patch.

@soft4net is right. You should wrap the top forEach in a Promise.all.

await Promise.all(LBPage.layout_builder__layout.forEach())

You could also use a for ... of ...

const  page = await getResource('node--page', '6acb560b-f999-4011-9bab-160856d21f9f')

for (const section of page.layout_builder__layout) {
  for (const component of section.components) {
    // .....
    // Do your getResource call here.
    const blocks = await getResource(nodeType, nodeUid);
   // ....
Read more comments on GitHub >

github_iconTop Results From Across the Web

Displayed data does not update in nested loop on state
When I press one of these buttons (that should add a row to rows array) the formData state does update, but the displayed...
Read more >
How to Implement a Component Loop in React | Pluralsight
This guide demonstrates how to implement loops in common use cases, such as rendering a list of static data and outputting data from...
Read more >
Fix list for IBM WebSphere Application Server V8.5
IBM WebSphere Application Server provides periodic fixes for the base and Network Deployment editions of release V8.5. The following is a complete listing ......
Read more >
Documentation - SolidJS · Reactive Javascript Library
data works like a normal signal getter: use data() to read the last returned ... When nested the state you are updating may...
Read more >
Reference Documentation - Spring
Shutting down the Spring IoC container gracefully in non-web applications. 3.6.2. ... getObject(); } @Bean public DataSource dataSource() { return new ...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Post

No results found

github_iconTop Related Hashnode Post

No results found