Adding shoe icon and shoe tab panel crashes the site

I had report this here:

https://www.drupal.org/project/experience_builder/issues/3470550#comment... 🐛 Component config entities are incomplete: missing entries for optional props, causing errors in ComponentPropsForm Fixed

which Wim said here:

https://www.drupal.org/project/experience_builder/issues/3470550#comment... 🐛 Component config entities are incomplete: missing entries for optional props, causing errors in ComponentPropsForm Fixed

was being worked on in 🐛 Emptying a required value through the UI crashes the app Active but I'm not sure that's the issue or not.

Reproduced!

@kristen pol No, that's a different bug. This doesn't even require any interaction with the component props form!

The server response is

object(stdClass)#2861 (0) { } string(2132) "{"layout":{"uuid":"root","nodeType":"root","name":"root","children":[{"uuid":"two-column-uuid","nodeType":"component","type":"experience_builder:two_column","children":[{"uuid":"two-column-uuid-slot-column_one","name":"column_one","nodeType":"slot","children":[{"uuid":"dynamic-image-udf7d","nodeType":"component","type":"experience_builder:image","children":[]},{"children":[],"nodeType":"component","type":"experience_builder:shoe_tab","uuid":"f61c597f-538b-4640-a7c4-8523467bb0ce"},{"children":[{"uuid":"f4dcd770-f7b1-4aac-b15c-07c85f8e58cd-slot-content","name":"content","nodeType":"slot","children":[]}],"nodeType":"component","type":"experience_builder:shoe_tab_panel","uuid":"f4dcd770-f7b1-4aac-b15c-07c85f8e58cd"},{"uuid":"static-static-card1ab","nodeType":"component","type":"experience_builder:my-hero","children":[]}]},{"uuid":"two-column-uuid-slot-column_two","name":"column_two","nodeType":"slot","children":[{"uuid":"dynamic-static-card2df","nodeType":"component","type":"experience_builder:my-hero","children":[]},{"uuid":"dynamic-dynamic-card3rr","nodeType":"component","type":"experience_builder:my-hero","children":[]},{"uuid":"dynamic-image-static-imageStyle-something7d","nodeType":"component","type":"experience_builder:image","children":[]}]}]}]},"model":{"two-column-uuid":{"width":50,"name":"Two Column"},"dynamic-image-udf7d":{"image":{"src":"/sites/default/files/2024-09/before_1.png","alt":"asdf","width":284,"height":334},"name":"Image"},"static-static-card1ab":{"heading":"hello, world!","cta1href":"https://drupal.org","name":"Hero"},"dynamic-static-card2df":{"heading":"asdfsaf","cta1href":"https://drupal.org","name":"Hero"},"dynamic-dynamic-card3rr":{"heading":"asdfsaf","cta1href":"public://2024-09/before_1.png","name":"Hero"},"dynamic-image-static-imageStyle-something7d":{"image":{"src":"http://core.test/sites/default/files/styles/thumbnail/public/2024-09/before_1.png.webp?itok=sHo4lELo","alt":"asdf","width":85,"height":100},"name":"Image"},"f61c597f-538b-4640-a7c4-8523467bb0ce":{"name":"Shoe Tab","label":"Tab 1","panel":"tab_1"},"f4dcd770-f7b1-4aac-b15c-07c85f8e58cd":{"name":"tab_name"}}}"

… which very much looks like a var_dump() 🤪

I debugged this and … it ended up crashing deep in Drupal core's Renderer.

Then I found the root cause: shoe_icon and shoe_tab_panel both have a prop named name. That ("name") is currently unfortunately a reserved keyword … which is why

    // @todo the current quick-and-dirty UI PoC unfortunately prevents any prop from being named `name`, because it expects that to convey the component name — but it's not actually one of the props consumed by the SDC.

was added in 📌 Refactor SdcController::preview() to use ComponentTreeHydrated, and update it to support nested components Fixed .

Actually, I reported this a month ago: 🐛 Some components cannot be used in XB because UI prevents SDC props being named `name` Active .

Closing as a duplicate, transfering credit.