Update GCWeb footer structure with new global footer design

From an implementation perspective, can these be menu blocks so that they can be managed in Drupal UI? Especially the contextual menu block that might be unique for each site. In particular, CRA is looking at that block from a content perspective, and will want flexibility with regards to it without having to change code.

Patches attached implement the changes required.

The migration scripts have been updated to include the new menu links, including placeholder links for the new contextual footer menu.

I ran into an issue where if the new menus didn't have any links (fresh install of Wxt) an empty nav element was still returned which was not desired. This was because the menus created in the UI were by default given a plugin of menu_block. Changing this manually in the config files to system_menu_block resolved the issue. Now no markup is returned if a menu doesn't have any links.

English:

French:

Composer changes to test:

"patches": {
  "drupalwxt/wxt": {
    "3335298 - New GCWeb footer structure": "https://www.drupal.org/files/issues/2023-01-24/wxt-gcweb-contextual-menu-3335298-9.patch"
  },
  "drupal/wxt_bootstrap": {
    "3335298 - New GCWeb footer structure": "https://www.drupal.org/files/issues/2023-01-24/wxt-bootstrap-gcweb-contextual-footer-menu-3335298-9.patch"
  }
}

On a fresh install, once you have the patches in place you just need to run the gcweb_menu_link and gcweb_menu_link_translation migrations to get the menu links and to see the whole structure.

Slight change to patches after testing on existing project.

I have tested this on a fresh install of WxT and it works well, just need to select GCWeb from wxt_library config page and run the migrations (English and French) to get the desired output. Once this gets tested some more and merged into a release this will be available out-of-the-box.

Update patches to ensure French footer menu uses proper characters in machine name: footer_fr -> footer-fr

This ensures the menu UI can be used to update footer links without throwing an error.

Added two GitHub PRs to make it easier to see changes and to merge:

drupalwxt/wxt - https://github.com/drupalwxt/wxt/pull/293
drupalwxt/wxt_bootstrap - https://github.com/drupalwxt/wxt_bootstrap/pull/29

Hey @smulvih2 so I took a look and appreciate all the great work you did here.

A few things I was happy were done:

a) You added enforced to all the migrations which is good since it is a dependency
b) All of the menu links were updated which they were due for a while
c) Added the new footer system

On my initial code review I didn't notice much so I'm going to merge into the codebase.

Is there any notes we need to add for the upgrade path?

Committed and attributed.

@sylus thanks for the review and merge! I’m glad you noticed the enforced key, it was added so that in the future the wxt_ext_migrations module could be uninstalled and installed again if needed, and all configs get uninstalled with the module.

In order to get this added to an existing project, the new configs in wxt_bootstrap are needed that define the new menu systems and blocks. Also the migration config updates are needed to get the new menu links. There are a few ways to go about getting these new configs. One option is you can take the new config YAML files and import them through the UI. What I did for the project I was developing this for was uninstall the wxt_bootstrap theme and the wxt_ext_migrations module and reinstall them. This ensures the new configs are installed properly.

When uninstalling wxt_ext_migrations and installing it again, you will run into an issue where the configs already exist (which the enforce key fixes for the future). I just did a drush cdel on all the configs it complains about and then I was able to install the module again.

You may run into an issue where your footer menu machine names don’t match. There have been some changes to these machine names over the last year or so, replacing underscores with dashes. This was done because underscores in menu machine names don’t pass validation so the menus can’t be edited and saved in the future. I made sure that all machine names use dashes in this feature request.

I must be missing a step, we're not seeing the new links in the migrations, perhaps we're missing the config update from menu_block that is above mentioned must be changed to system_menu_block? so I have to modify my own config/sync/ files manually or run some sort of wxt drush command or wxt config command?

Posted this in the wrong thread:

@joseph, since the migration scripts are actually config, you will need to import the new scripts or what I did was uninstall the wxt_ext_migration module, then enable it again to get the new scripts. This will throw error on install due to config already existing (not using enforced key), so just drush cdel the migration configs it complains about and you should have the new links ready to import.

We added the enforced key to all migration scripts, so in the future the error on install for wxt_ext_migration will not occur.

Hi @smulvih2,
I followed the instructions to add the new contextual footer blocks into the footer region and run importing scripts.

The contextual footer header h2 and GC-main-footer h3 are not shown up in my local DEV. Did i miss any steps of the new GCWeb footer structure? Please advise! Thank you!

@jamesyao I believe the block titles are being used, so try enabling block titles for the blocks in question and set the title value as needed. Hope this helps!

Enabling block titles doesn't seem to work, I'll have a closer look at vanilla wxt

Try enabling twig debug to see which block template file is being used. If you don't have changes from the starterkit for wxt_bootstrap in your *.theme then the block suggestions might not be targeting the correct template file.

@smulvih2, ok ya for some reason I had to copy the twigs from a vanilla 4.4.2 wxt_bootstrap/templates/twig and the naming was different due to some theming suggestion differences on our sub theme

so once I renamed the twig files as expected by our sub theme for the block twigs then it is good on the "upgraded" environment.

Looks great thanks :)

and yes I have the starterkit/wxt/THEMENAME.theme recommended theming suggestions hooks in our subtheme

Awesome, glad you got it working!

Thanks @joseph.olstad and @smulvih2!
@joseph.olstad updated 10 twigs to make the new global footer work well.

FYI - the new GCWeb footer structure is live on Canada.ca - https://www.canada.ca/en.html

Also see a few examples of the contextual menus being used https://www.canada.ca/en/government/about/design-system/latest-changes.html, https://www.canada.ca/en/immigration-refugees-citizenship/services/immigrate-canada.html