Add Group ID and Group Field values as classes in page.html.twig

Created on 1 February 2024, 10 months ago
Updated 2 February 2024, 10 months ago

Problem/Motivation

I want to enable Groups to have 'custom' styles. I would like to achieve this by including the Group ID and the value of field_style in page.html.twig for the group entity as well as any nodes associated with a group.

Note: for this case, the nodes have a cardinality of 1:1 for groups.

Progress and attempts tracked below, Any help would be greatly appreciated.

💬 Support request
Status

Active

Version

3.3

Component

Code

Created by

🇨🇦Canada ydahi Waterloo, Canada

Live updates comments and jobs are added and updated live.
Sign in to follow issues

Comments & Activities

  • Issue created by @ydahi
  • 🇨🇦Canada ydahi Waterloo, Canada
  • 🇨🇦Canada ydahi Waterloo, Canada

    I was able to get Group ID (and other data) into my template like so:

    In theme.theme:

    function theme_preprocess_page(&$variables) {
    
      if (($group = \Drupal::routeMatch()->getParameter('group'))) {
        $variables['group']['id'] = $group->id();
        $variables['group']['type'] = $group->getGroupType()->id();
    
        $styles = $group->get('field_style')->referencedEntities();
        foreach ($styles as $style) {
          $name = $style->getName();
          $variables['group']['style'] = $name;
        }
    
        $subjects = $group->get('field_subject')->referencedEntities();
        foreach ($subjects as $subject) {
          $name = $subject->getName();
          $variables['group']['subject'] = $name;
        }
    
        // Print entire Group object for testing
        //$variables['group']['object'] = $group;
    
      }
    

    In page--group.html.twig:

    {% if group.id %}
      {% set data_id = group.id %}
      {% set data_type = group.type %}
      {% set data_style = "#{ group.style |lower }" %}
    {% endif %}
    
    <div
      data-courseid="{{ data_id }}"
      data-coursetype="{{ data_type }}"
      data-coursestyle="{{ data_style }}"
      {{ page_attributes.addClass(page_classes)
    }}>
    

    However, now I am wondering the best approach to getting the same data attributes (or classes) in a node that is part of a group.

    The following does not work:

     if (($group_relationship = \Drupal::routeMatch()->getParameter('group_relationship'))) {
      dump($group_relationship);
     }
    

    Any suggestions?

  • 🇨🇦Canada ydahi Waterloo, Canada

    This is how I'm pursuing adding the same sort of attributes to nodes within the group context:

    if (($node = \Drupal::routeMatch()->getParameter('node'))) {
    
      if ($variables['node']->getType() === 'page') {
        dump($node);
        $node_id = $variables['node']->id();
    
        $storage = \Drupal::entityTypeManager()->getStorage('group_relationship');
        $group = $storage->loadByEntity($node);
      }
    }
    

    But, I need to figure out how to load the group entity from the group_relationship now. Or maybe there is another way.

  • 🇨🇦Canada ydahi Waterloo, Canada
  • 🇨🇦Canada ydahi Waterloo, Canada
  • 🇨🇦Canada ydahi Waterloo, Canada

    I was able to get this work, solution shared below.

    My Groups have a field called Style (term ref) and Subject (term ref). When a Group is created, these fields are selected. I add these fields as CSS classes (or data attributes) in page.html.twig, allowing me to write custom styles per "Style" or "Subject" selected.

    The following hook_preprocess_page implementation adds those classes to the Group and Group nodes.

    function yourtheme_preprocess_page(&$variables) {
    
      if (($group = \Drupal::routeMatch()->getParameter('group'))) {
        $variables['group']['id'] = $group->id();
        $variables['group']['type'] = $group->getGroupType()->id();
    
        $styles = $group->get('field_style')->referencedEntities();
        foreach ($styles as $style) {
          $name = $style->getName();
          $variables['group']['style'] = $name;
        }
    
        $subjects = $group->get('field_subject')->referencedEntities();
        foreach ($subjects as $subject) {
          $name = $subject->getName();
          $variables['group']['subject'] = $name;
        }
    
        // Print entire Group object for testing
        //$variables['group']['object'] = $group;
    
      }
    
      if (($node = \Drupal::routeMatch()->getParameter('node'))) {
    
        if ($variables['node']->getType() === 'page') {
    
          $node_id = $variables['node']->id();
    
          $storage = \Drupal::entityTypeManager()->getStorage('group_relationship');
          assert($storage instanceof GroupRelationshipStorageInterface);
    
          $group_relationship = $storage->loadByEntity($node);
          assert($group_relationship instanceof GroupRelationshipInterface);
    
          foreach ($storage->loadByEntity($variables['node']) as $group_content) {
            //$variables['group']['group'] = $group_content->getGroup();
            $variables['group']['id'] = $group_content->getGroup()->id();
            $variables['group']['type'] = $group_content->getGroupType()->id();
    
            $styles = $group_content->getGroup()->get('field_style')->referencedEntities();
            foreach ($styles as $style) {
              $name = $style->getName();
              $variables['group']['style'] = $name;
            }
    
            $subjects = $group_content->getGroup()->get('field_subject')->referencedEntities();
            foreach ($subjects as $subject) {
              $name = $subject->getName();
              $variables['group']['subject'] = $name;
            }
          }
    
          //dump($variables);
        }
      }
    }
    
Production build 0.71.5 2024