MDL-75513 core_grades: Renderer for the custom user header

grade/renderer.php

@@ -17,6 +17,8 @@
 defined('MOODLE_INTERNAL') || die;
 
 use \core_grades\output\action_bar;
+use core_message\helper;
+use core_message\api;
 
 /**
  * Renderer class for the grade pages.
@@ -82,4 +84,67 @@ class core_grades_renderer extends plugin_renderer_base {
         $this->page->requires->js_call_amd('core_grades/searchwidget/group', 'init');
         return $this->render_from_template('core_grades/group_selector', $data);
     }
+
+    /**
+     * Creates and renders a custom user heading.
+     *
+     * @param stdClass $user The user object.
+     * @param int $courseid The course ID.
+     * @param bool $showbuttons Whether to display buttons (message, add to contacts) within the heading.
+     * @return string The raw HTML to render.
+     */
+    public function user_heading(stdClass $user, int $courseid, bool $showbuttons = true) {
+        global $USER;
+
+        $headingdata = [
+            'userprofileurl' => (new moodle_url('/user/view.php', ['id' => $user->id, 'course' => $courseid]))->out(false),
+            'name' => fullname($user),
+            'image' => $this->user_picture($user, ['size' => 50, 'link' => false])
+        ];
+
+        if ($showbuttons) {
+            // Generate the data for the 'message' button.
+            $messagelinkattributes = array_map(function($name, $value) {
+                return ['name' => $name, 'value' => $value];
+            }, array_keys(helper::messageuser_link_params($user->id)), helper::messageuser_link_params($user->id));
+            $messagelinkattributes[] = ['name' => 'class', 'value' => 'btn px-0'];
+
+            $headingdata['buttons'][] = [
+                'title' => get_string('message', 'message'),
+                'url' => (new moodle_url('/message/index.php', ['id' => $user->id]))->out(false),
+                'icon' => ['name' => 't/message', 'component' => 'core'],
+                'linkattributes' => $messagelinkattributes
+            ];
+            // Include js for messaging.
+            helper::messageuser_requirejs();
+
+            if ($USER->id != $user->id) {
+                // Generate the data for the 'contact' button.
+                $iscontact = api::is_contact($USER->id, $user->id);
+                $contacttitle = $iscontact ? 'removefromyourcontacts' : 'addtoyourcontacts';
+                $contacturlaction = $iscontact ? 'removecontact' : 'addcontact';
+                $contacticon = $iscontact ? 't/removecontact' : 't/addcontact';
+
+                $togglelinkparams = helper::togglecontact_link_params($user, $iscontact, false);
+                $togglecontactlinkattributes = array_map(function($name, $value) {
+                    if ($name === 'class') {
+                        $value .= ' btn px-0';
+                    }
+                    return ['name' => $name, 'value' => $value];
+                }, array_keys($togglelinkparams), $togglelinkparams);
+
+                $headingdata['buttons'][] = [
+                    'title' => get_string($contacttitle, 'message'),
+                    'url' => (new moodle_url('/message/index.php', ['user1' => $USER->id, 'user2' => $user->id,
+                        $contacturlaction => $user->id, 'sesskey' => sesskey()]))->out(false),
+                    'icon' => ['name' => $contacticon, 'component' => 'core'],
+                    'linkattributes' => $togglecontactlinkattributes
+                ];
+                // Include js for contact toggle.
+                helper::togglecontact_requirejs();
+            }
+        }
+
+        return $this->render_from_template('core_grades/user_heading', $headingdata);
+    }
 }

grade/templates/user_heading.mustache

@@ -0,0 +1,73 @@
+{{!
+    This file is part of Moodle - http://moodle.org/
+
+    Moodle is free software: you can redistribute it and/or modify
+    it under the terms of the GNU General Public License as published by
+    the Free Software Foundation, either version 3 of the License, or
+    (at your option) any later version.
+
+    Moodle is distributed in the hope that it will be useful,
+    but WITHOUT ANY WARRANTY; without even the implied warranty of
+    MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+    GNU General Public License for more details.
+
+    You should have received a copy of the GNU General Public License
+    along with Moodle.  If not, see <http://www.gnu.org/licenses/>.
+}}
+{{!
+    @template core_grades/user_heading
+
+    Custom user heading.
+
+    Context variables required for this template:
+    * image - HTML img element representing the avatar of the user.
+    * userprofileurl - The URL to the user profile page.
+    * name - The name of the user
+    * buttons - List of buttons to be displayed in the heading for the user report (e.g. 'message', 'add user to contacts')
+
+    Example context (json):
+    {
+        "image": "<img src=\"http://example.com/pluginfile.php/14/user/icon/boost/f2\" class=\"userpicture\" width=\"50\" alt=\"\">",
+        "userprofileurl": "http://example.com/user/view.php?id=6&course=8",
+        "name": "John Doe",
+        "buttons": [
+            {
+                "linkattributes": [
+                    {
+                        "name": "role",
+                        "value": "button"
+                    },
+                    {
+                        "name": "data-userid",
+                        "value": "3"
+                    }
+                ],
+                "title": "Message",
+                "url": "http://example.com/message/index.php?user1=2&user2=3&addcontact=3",
+                "icon": {
+                    "name": "t/message",
+                    "component": "core"
+                }
+            }
+        ]
+    }
+}}
+<div class="user-heading d-flex align-items-center">
+    <div class="d-flex h4">
+        {{{image}}}
+    </div>
+    <div class="d-flex ml-2">
+        <a class="h4 m-0" href="{{userprofileurl}}">{{name}}</a>
+    </div>
+    <div class="d-inline-flex ml-4">
+        {{#buttons}}
+            <a {{#linkattributes}} {{name}}="{{value}}" {{/linkattributes}} aria-label="{{title}}" href="{{url}}">
+                {{#icon}}
+                    <span>
+                        {{#pix}} {{name}}, {{component}}, {{title}} {{/pix}}
+                    </span>
+                {{/icon}}
+            </a>
+        {{/buttons}}
+    </div>
+</div>

theme/boost/scss/moodle/grade.scss

@@ -65,6 +65,11 @@
     #region-main {
         overflow-x: visible;
     }
+
+    .user-heading .userinitials {
+        width: 50px;
+        height: 50px;
+    }
 }
 
 // Rubrics

theme/boost/style/moodle.css

@@ -19417,6 +19417,10 @@ p.arrow_button {
 .path-grade #region-main {
   overflow-x: visible; }
 
+.path-grade .user-heading .userinitials {
+  width: 50px;
+  height: 50px; }
+
 #page-grade-grading-manage #activemethodselector label {
   display: inline-block; }
 

theme/classic/style/moodle.css

@@ -19417,6 +19417,10 @@ p.arrow_button {
 .path-grade #region-main {
   overflow-x: visible; }
 
+.path-grade .user-heading .userinitials {
+  width: 50px;
+  height: 50px; }
+
 #page-grade-grading-manage #activemethodselector label {
   display: inline-block; }