Build a navigation code component

Left a question about using core's linkset endpoint instead of needing the contrib one

The BE pieces of this MR (src/Plugin/ExperienceBuilder/ComponentSource/JsComponent.php + test expectation changes) look fine 👍 (They're just more imports.)

However this MR is 99% front-end, so my sign-off is basically meaningless 😅

This blocks 🌱 Plan how to evolve code component overrides Active , which is a beta blocker. So: tagging.

I opened 📌 Build Breadcrumb and SiteBranding code components Needs work as a sibling issue.

Checking to see if I can help get this over the line …

Last remaining test failure:

      Schema errors for core.base_field_override.node.page.promote with the follo  
      wing errors: core.base_field_override.node.page.promote:default_value.0.val  
      ue variable type is integer but applied schema class is Drupal\Core\TypedDa  
      ta\Plugin\DataType\BooleanData     

This is related to

  /**
   * Implements hook_config_schema_info_alter().
   */
  #[Hook('config_schema_info_alter')]
  public function configSchemaInfoAlter(array &$definitions): void {
    // @todo Fix upstream.
    $definitions['field.value.boolean']['mapping']['value']['type'] = 'boolean';
  }

— \Drupal\experience_builder\Hook\ComponentSourceHooks::configSchemaInfoAlter()

AFAICT this is happening because tests/fixtures/recipes/base/recipe.yml contains:

recipes:
  …
  - ./core/recipes/page_content_type

And that recipe ships with core/recipes/page_content_type/config/core.base_field_override.node.page.promote.yml which contains:

default_value:
  -
    value: 0

👆

That's the problem.

Recommendation: use \Drupal\Core\Config\Development\ConfigSchemaChecker::__construct(exclude: ['core.base_field_override.node.page.promote']).

I'm surprised this is only now a problem, but that should be a viable work-around :)

Sally asked in Slack whether 0.x was failing too then.

I had just asked the same:

I'm surprised this is only now a problem

I bet this is due to this MR's new "menu" recipe installing XB earlier, which then has \Drupal\experience_builder\Hook\ComponentSourceHooks::configSchemaInfoAlter() take effect earlier, which in turn means config schema validation errors for core recipes.

Note that this work-around was added at #3523841-20: Versioned Component config entities (SDC, JS: prop_field_definitions, block: default_setting, all: slots for fallback) + component instances refer to versions ⇒ less data to store per XB field row → .

Let's remove it for a second to see how that plays out :)

wim leers → changed the visibility of the branch 0.x to hidden.

That caused the widespread failures I feared. Reverted it and created the missing upstream bug report: 🐛 BooleanItem has invalid config schema for its default values Active , the comment now points there 👍

FYI I rebased this off 0.x so I can base 📌 Build Breadcrumb and SiteBranding code components Needs work atop it

Code looks good, has all the examples, and manual testing was successful.

🥳 Awesome to see this in! One big step closer to 🌱 [Meta] Plan for code components Active 's "remove block overrides" MR landing 😄

Can we get a screenshot/GIF of the final incarnation? (I see one at https://git.drupalcode.org/project/experience_builder/-/merge_requests/1166, but I'm not sure it does the final iteration justice :D)

The Navigation component added here isn't the only way to trigger the bug in 🐛 Drupal.behaviors.xbDisableLinks doesn't disable links added to the DOM later Active , but it's now a common way, so adding that as a related issue.

Tested changes on branch 0.x , for following scenarios :

• composer require drupal/jsonapi_menu_items
• From /admin/modules install JSON:API Menu items and JSON:API module
• go to /admin/config/services/linkset and enable the menu linkset endpoint
• Go to /admin/structure/menu/manage/main and create menu items, with nesting
• Go to /homepage and then click "Edit"
• Click + (Add) on the left hand menu, "+ Add new", give the component a name and click Add
• In the experience_builder module source code go to tests/fixtures/code_components/menus
• Copy the example into the editor

• Save the code component and drag it from the Components list to the content area of a page
• Preview the page
• Publish the changes

Thanks, @neha_bawankar! You happened to provide a screenshot, so … all done! 😄

Automatically closed - issue fixed for 2 weeks with no activity.