first commit

reportbuilder/templates/editor_navbar.mustache

@@ -0,0 +1,35 @@
+{{!
+    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_reportbuilder/editor_navbar
+
+    This template renders the reportbuilder editor navbar
+
+    Example context (json):
+    {
+        "title": "Report title",
+        "buttons": "<button class='btn btn-secondary mr-2'>Close</button>"
+    }
+}}
+<nav class="navbar fixed-top navbar-light bg-white navbar-expand align-items-center" aria-label="{{#str}}sitemenubar, admin{{/str}}">
+    <div class="container-fluid">
+        <h1 class="h3 m-0 p-0">{{{title}}}</h1>
+        <div class="ml-auto d-flex">
+            {{{buttons}}}
+        </div>
+    </div>
+</nav>

reportbuilder/templates/local/audience/form.mustache

@@ -0,0 +1,85 @@
+{{!
+    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_reportbuilder/local/audience/form
+
+    Template for an audience form
+
+    Example context (json):
+    {
+        "instanceid": 1,
+        "classname": "some\\class\\name",
+        "heading": "Title",
+        "headingeditable": "Title (edit me)",
+        "showormessage": 1,
+        "editwarning": "Oh dear",
+        "canedit": 1,
+        "candelete": 1,
+        "description": "description",
+        "form": "form"
+    }
+}}
+<div data-region="audience-card" class="instance-card" data-audience-id="{{instanceid}}" data-audience-title="{{heading}}"
+    {{#editwarning}}
+        data-audience-edit-warning="1"
+    {{/editwarning}}
+>
+    {{#showormessage}}
+        <span class="audience-separator d-flex mb-3 justify-content-center align-items-center small text-muted font-weight-bold">
+            {{#str}} or, core_reportbuilder {{/str}}
+        </span>
+    {{/showormessage}}
+    <div class="mb-3 card">
+        <div class="card-header p-0">
+            <div class="mb-0 d-flex">
+                <h3 class="h6 text-left m-0 align-self-center pl-3" data-region="audience-heading">
+                    {{{headingeditable}}}
+                </h3>
+                <span class="ml-auto">
+                    {{#canedit}}
+                        <button class="btn btn-link px-0"
+                                data-action="edit-audience"
+                                title="{{#str}} editaudience, core_reportbuilder, {{heading}} {{/str}}"
+                                aria-label="{{#str}} editaudience, core_reportbuilder, {{heading}} {{/str}}"
+                                {{^description}}disabled{{/description}}>
+                            {{#pix}} i/settings, core {{/pix}}
+                        </button>
+                    {{/canedit}}
+                    {{#candelete}}
+                        <button class="btn btn-link px-0 mr-2"
+                                data-action="delete-audience"
+                                title="{{#str}} deleteaudience, core_reportbuilder, {{heading}} {{/str}}"
+                                aria-label="{{#str}} deleteaudience, core_reportbuilder, {{heading}} {{/str}}"
+                                {{^description}}disabled{{/description}}>
+                            {{#pix}} i/trash, core {{/pix}}
+                        </button>
+                    {{/candelete}}
+                </span>
+            </div>
+        </div>
+        <div class="card-body p-3" data-region="audience-form">
+            {{#editwarning}}<div class="alert alert-warning p-2">{{.}}</div>{{/editwarning}}
+            <div data-region="audience-description" {{^description}}class="hidden"{{/description}}>
+                {{{description}}}
+            </div>
+            <div data-region="audience-form-container" {{^form}}class="hidden"{{/form}}>
+                <div class="alert alert-warning p-2" data-region="audience-not-saved">{{#str}} audiencenotsaved, core_reportbuilder {{/str}}</div>
+                {{{form}}}
+            </div>
+        </div>
+    </div>
+</div>

reportbuilder/templates/local/conditions/footer.mustache

@@ -0,0 +1,26 @@
+{{!
+    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_reportbuilder/local/conditions/footer
+
+    Template for the footer of a filter instance within the filter form
+
+    Example context (json):
+    {
+    }
+}}
+</div>

reportbuilder/templates/local/conditions/header.mustache

@@ -0,0 +1,45 @@
+{{!
+    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_reportbuilder/local/conditions/header
+
+    Template for the header of a condition instance within the condition form
+
+    Example context (json):
+    {
+        "id": 1,
+        "heading": "Date modified",
+        "entityname": "Course"
+    }
+}}
+<div class="condition list-group-item list-group-item-action text-dark" data-region="active-condition"
+        data-condition-id="{{id}}" data-condition-name="{{heading}}" data-condition-position="{{sortorder}}">
+    <div class="condition-header d-flex align-items-start">
+        {{>core/drag_handle}}
+        <div>
+            <div class="d-flex">
+                <small class="text-muted text-uppercase">{{entityname}} • {{heading}}</small>
+            </div>
+        </div>
+        <button class="btn btn-link p-0 ml-auto"
+                type="button"
+                data-action="report-remove-condition"
+                title="{{#str}}deletecondition, core_reportbuilder, {{{heading}}}{{/str}}"
+                aria-label="{{#str}}deletecondition, core_reportbuilder, {{{heading}}}{{/str}}">
+            {{#pix}}e/cancel, core{{/pix}}
+        </button>
+    </div>

reportbuilder/templates/local/dynamictabs/access.mustache

@@ -0,0 +1,30 @@
+{{!
+    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_reportbuilder/local/dynamictabs/access
+
+    Template for Access report
+
+    Example context (json):
+    {
+        "report": "The report content"
+    }
+}}
+<h2 class="sr-only">{{#str}} access, core_reportbuilder {{/str}}</h2>
+<div class="reportbuilder-access-container">
+    {{{ report }}}
+</div>

reportbuilder/templates/local/dynamictabs/audience.mustache

@@ -0,0 +1,68 @@
+{{!
+    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_reportbuilder/local/dynamictabs/audience
+
+    Template for report audience
+
+    Example context (json):
+    {
+        "reportid": 1,
+        "contextid": 1,
+        "hasinstances": 1,
+        "instances": [{
+            "instanceid": 1,
+            "heading": "Title",
+            "headingeditable": "Title (edit me)",
+            "showormessage": 1,
+            "canedit": 1,
+            "candelete": 1,
+            "description": "description",
+            "form": "form"
+        }],
+        "sidebarmenucards": [{
+            "menucards": [{
+                "name": "General",
+                "items": [{
+                    "name": "Manually added users",
+                    "identifier": "core_reportbuilder:users"
+                }]
+            }]
+        }]
+    }
+}}
+<h2 class="sr-only">{{#str}} audience, core_reportbuilder {{/str}}</h2>
+<div class="audiences-wrapper d-flex flex-column flex-lg-row">
+    <div id="audiences-menu">
+        {{! Sidebar }}
+        {{> core_reportbuilder/local/sidebar-menu/area}}
+    </div>
+    <div id="audiences-container" class="reportbuilder-audiences-container d-flex flex-column flex-fill" data-region="audiences">
+        {{! No audience container }}
+        <div class="justify-content-center {{#hasinstances}}hidden{{/hasinstances}}" data-region="no-instances-message">
+            <div class="alert alert-info mb-0">{{#str}} noaudiences, core_reportbuilder {{/str}}</div>
+        </div>
+        {{#instances}}
+            {{> core_reportbuilder/local/audience/form}}
+        {{/instances}}
+    </div>
+</div>
+{{#js}}
+    require(['core_reportbuilder/audience'], function(audience) {
+        audience.init({{reportid}}, {{contextid}});
+    });
+{{/js}}

reportbuilder/templates/local/dynamictabs/editor.mustache

@@ -0,0 +1,155 @@
+{{!
+    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_reportbuilder/local/dynamictabs/editor
+
+    Template for the custom report editor
+
+    Example context (json):
+    {
+        "id": 1,
+        "type": 1,
+        "table": "table",
+        "editmode": true,
+        "attributes": [{
+            "name": "data-custom",
+            "value": "1"
+        }],
+        "sidebarmenucards": [{
+            "menucards": [{
+                "name": "General",
+                "items": [{
+                    "name": "Manually added users",
+                    "identifier": "core_reportbuilder:users"
+                }]
+            }]
+        }],
+        "conditions": [{
+            "hasavailableconditions": true,
+            "availableconditions": [{
+                "optiongroup": [{
+                    "text": "User",
+                    "values": [{
+                        "value": 1,
+                        "visiblename": "User name"
+                    }]
+                }]
+            }],
+            "hasactiveconditions": true,
+            "activeconditionsform": "form"
+        }],
+        "filters": [{
+            "hasavailablefilters": true,
+            "availablefilters": [{
+                "optiongroup": [{
+                    "text": "User",
+                    "values": [{
+                        "value": 1,
+                        "visiblename": "User name"
+                    }]
+                }]
+            }],
+            "hasactivefilters": true,
+            "activefilters": [{
+                "heading": "Email address",
+                "entityname": "user",
+                "headingeditable": "Email address"
+            }]
+        }],
+        "sorting": [{
+            "hassortablecolumns": true,
+            "sortablecolumns": [{
+                "id": 1,
+                "title": "Email address",
+                "sortdirection": "4",
+                "sortenabled": true,
+                "sortorder": 1,
+                "sorticon": [{
+                    "key": "t/uplong",
+                    "component": "core",
+                    "title": "Sort column 'Email address' ascending"
+                }],
+                "heading": "Email address"
+            }]
+        }],
+        "cardview": {
+            "form": "form"
+        }
+    }
+}}
+<h2 class="sr-only">{{#str}} editor, core_reportbuilder {{/str}}</h2>
+<div class="reportbuilder-report"
+     data-region="core_reportbuilder/report"
+     data-report-id="{{id}}"
+     data-report-type="{{type}}"
+     data-parameter="[]"
+     {{#editmode}}data-editing{{/editmode}}
+     {{#attributes}}{{name}}="{{value}}" {{/attributes}}>
+    <div class="reportbuilder-wrapper d-flex flex-column flex-lg-row">
+        {{#editmode}}
+            {{! Menu sidebar }}
+            {{> core_reportbuilder/local/sidebar-menu/area}}
+        {{/editmode}}
+        {{! Report }}
+        <div class="reportbuilder-report-container">
+            <div class="{{#editmode}}p-2 border{{/editmode}}">
+                <div data-region="core_reportbuilder/report-header" class="dropdown d-flex justify-content-end">
+                    {{! Preview/Edit button }}
+                    <button data-action="toggle-edit-preview" class="btn btn-outline-secondary"
+                        {{#editmode}}
+                            data-edit-mode="1" title="{{#str}} switchpreview, core_reportbuilder {{/str}}"
+                        {{/editmode}}
+                        {{^editmode}}
+                            data-edit-mode="0" title="{{#str}} switchedit, core_reportbuilder {{/str}}"
+                        {{/editmode}}
+                    >
+                        {{#editmode}}
+                            {{#pix}} i/preview, core {{/pix}}
+                            {{#str}} preview, core {{/str}}
+                        {{/editmode}}
+                        {{^editmode}}
+                            {{#pix}} t/editstring, core {{/pix}}
+                            {{#str}} edit, core {{/str}}
+                        {{/editmode}}
+                    </button>
+                    {{^editmode}}
+                        {{! Filters }}
+                        {{#filterspresent}}
+                            {{>core_reportbuilder/local/filters/area}}
+                        {{/filterspresent}}
+                    {{/editmode}}
+                </div>
+                <div class="reportbuilder-editor-table-container mt-2">
+                    {{! Table }}
+                    {{{table}}}
+                </div>
+            </div>
+        </div>
+        {{#editmode}}
+            {{! Settings sidebar }}
+            {{> core_reportbuilder/local/settings/area}}
+        {{/editmode}}
+    </div>
+</div>
+
+{{#js}}
+    require(['core_reportbuilder/editor', 'core_reportbuilder/report'],
+    function(editor, report) {
+        editor.init();
+        report.init();
+    });
+{{/js}}

reportbuilder/templates/local/dynamictabs/schedules.mustache

@@ -0,0 +1,39 @@
+{{!
+    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_reportbuilder/local/dynamictabs/schedules
+
+    Template for Schedules tab
+
+    Example context (json):
+    {
+        "report": "The report content",
+        "reportid": 10
+    }
+}}
+<div class="reportbuilder-schedules-container">
+    <div class="d-flex mb-2">
+        <button class="btn btn-primary ml-auto" data-action="schedule-create">{{#str}} newschedule, core_reportbuilder {{/str}}</button>
+    </div>
+    {{{ report }}}
+</div>
+
+{{#js}}
+    require(['core_reportbuilder/schedules'], function(schedules) {
+        schedules.init({{reportid}});
+    });
+{{/js}}

reportbuilder/templates/local/filters/area.mustache

@@ -0,0 +1,56 @@
+{{!
+    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_reportbuilder/local/filters/area
+
+    Template for system report filters area
+
+    Example context (json):
+    {
+        "id": 3,
+        "contextid": 1,
+        "filtersapplied": 3,
+        "filtersform": "form"
+    }
+}}
+
+{{! Filters button }}
+<button class="btn btn-outline-secondary ml-2" type="button" id="dropdownFiltersButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" title="{{#str}} filters, moodle {{/str}}">
+    {{#pix}} i/filter, core {{/pix}}
+    <span data-region="filter-button-label">
+        {{#filtersapplied}} {{#str}} filtersappliedx, core_reportbuilder, {{filtersapplied}} {{/str}} {{/filtersapplied}}
+        {{^filtersapplied}} {{#str}} filters, moodle {{/str}} {{/filtersapplied}}
+    </span>
+</button>
+{{! Filters content }}
+<div class="filters-dropdown dropdown-menu dropdown-menu-right moodle-has-zindex" aria-labelledby="dropdownFiltersButton">
+    <div id="filters" class="reportbuilder-filters-sidebar scroll-shadow" data-region="report-filters">
+        <div class="px-3 pt-3">
+            {{#filtersform}}
+                <div class="reportbuilder-filters-wrapper" data-region="filters-form">
+                    {{{filtersform}}}
+                </div>
+            {{/filtersform}}
+        </div>
+    </div>
+</div>
+
+{{#js}}
+    require(['core_reportbuilder/filters'], function(filters) {
+        filters.init({{id}}, {{contextid}});
+    });
+{{/js}}

reportbuilder/templates/local/filters/footer.mustache

@@ -0,0 +1,26 @@
+{{!
+    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_reportbuilder/local/filters/footer
+
+    Template for the footer of a filter instance within the filter form
+
+    Example context (json):
+    {
+    }
+}}
+</div>

reportbuilder/templates/local/filters/header.mustache

@@ -0,0 +1,32 @@
+{{!
+    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_reportbuilder/local/filters/header
+
+    Template for the header of a filter instance within the filter form
+
+    Example context (json):
+    {
+        "name": "Date modified"
+    }
+}}
+<div class="filter pb-3 mb-3" data-filter-for="{{name}}">
+    <div class="filter-header d-flex align-items-start justify-content-between">
+        <div class="filter-name text-truncate">
+            {{{name}}}
+        </div>
+    </div>

reportbuilder/templates/local/report/debug.mustache

@@ -0,0 +1,41 @@
+{{!
+    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_reportbuilder/local/report/debug
+
+    Template for custom report debug
+
+    Example context (json):
+    {
+        "query": "SELECT foo FROM {bar} WHERE baz = :rbparam1",
+        "params": [
+            {
+                "param": "rbparam1",
+                "value": 42
+            }
+        ],
+        "duration": "0.124 secs"
+    }
+}}
+<details>
+    <summary>{{#str}} debuginfo, core_debug {{/str}}</summary>
+    <code class="d-block mb-2">{{query}}</code>
+    {{#params}}
+        <code class="d-block mb-2">{{param}} => {{value}}</code>
+    {{/params}}
+    {{#duration}}<code class="d-block">{{.}}</code>{{/duration}}
+</details>

reportbuilder/templates/local/settings/area.mustache

@@ -0,0 +1,120 @@
+{{!
+    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_reportbuilder/local/settings/area
+
+    Template for system report filters area
+
+    Example context (json):
+    {
+        "conditions": [{
+            "hasavailableconditions": true,
+            "availableconditions": [{
+                "optiongroup": [{
+                    "text": "User",
+                    "values": [{
+                        "value": 1,
+                        "visiblename": "User name"
+                    }]
+                }]
+            }],
+            "hasactiveconditions": true,
+            "activeconditionsform": "form"
+        }],
+        "filters": [{
+            "hasavailablefilters": true,
+            "availablefilters": [{
+                "optiongroup": [{
+                    "text": "User",
+                    "values": [{
+                        "value": 1,
+                        "visiblename": "User name"
+                    }]
+                }]
+            }],
+            "hasactivefilters": true,
+            "activefilters": [{
+                "heading": "Email address",
+                "entityname": "user",
+                "headingeditable": "Email address"
+            }]
+        }],
+        "sorting": [{
+            "hassortablecolumns": true,
+            "sortablecolumns": [{
+                "id": 1,
+                "title": "Email address",
+                "sortdirection": "4",
+                "sortenabled": true,
+                "sortorder": 1,
+                "sorticon": [{
+                    "key": "t/uplong",
+                    "component": "core",
+                    "title": "Sort column 'Email address' ascending"
+                }],
+                "heading": "Email address"
+            }]
+        }],
+        "cardview": {
+            "form": "form"
+        }
+    }
+}}
+
+<div class="reportbuilder-sidebar-settings d-flex flex-column mt-3 mt-lg-0 mb-3 mb-lg-0 ml-lg-3">
+
+            {{< core_reportbuilder/toggle_card }}
+                {{$collapsed}}collapsed{{/collapsed}}
+                {{$id}}settingsconditions{{/id}}
+                {{$header}}{{#str}} conditions, core_reportbuilder {{/str}}{{/header}}
+                {{$helpicon}}{{{conditions.helpicon}}}{{/helpicon}}
+                {{$body}}
+                    {{> core_reportbuilder/local/settings/conditions}}
+                {{/body}}
+            {{/ core_reportbuilder/toggle_card }}
+
+            {{< core_reportbuilder/toggle_card }}
+                {{$collapsed}}collapsed{{/collapsed}}
+                {{$id}}settingsfilters{{/id}}
+                {{$header}}{{#str}} filters, core_reportbuilder {{/str}}{{/header}}
+                {{$helpicon}}{{{filters.helpicon}}}{{/helpicon}}
+                {{$body}}
+                    {{> core_reportbuilder/local/settings/filters}}
+                {{/body}}
+            {{/ core_reportbuilder/toggle_card }}
+
+            {{< core_reportbuilder/toggle_card }}
+                {{$collapsed}}collapsed{{/collapsed}}
+                {{$id}}settingssorting{{/id}}
+                {{$header}}{{#str}} sorting, core_reportbuilder {{/str}}{{/header}}
+                {{$helpicon}}{{{sorting.helpicon}}}{{/helpicon}}
+                {{$body}}
+                    {{> core_reportbuilder/local/settings/sorting}}
+                {{/body}}
+            {{/ core_reportbuilder/toggle_card }}
+
+            {{< core_reportbuilder/toggle_card }}
+                {{$collapsed}}collapsed{{/collapsed}}
+                {{$id}}settingscardview{{/id}}
+                {{$header}}{{#str}} cardview, core_reportbuilder {{/str}}{{/header}}
+                {{$helpicon}}{{{cardview.helpicon}}}{{/helpicon}}
+                {{$body}}
+                    {{> core_reportbuilder/local/settings/card_view}}
+                {{/body}}
+            {{/ core_reportbuilder/toggle_card }}
+
+</div>

reportbuilder/templates/local/settings/card_view.mustache

@@ -0,0 +1,34 @@
+{{!
+  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_reportbuilder/local/settings/card_view
+
+    Template for custom report card view settings area
+
+    Example context (json):
+    {
+        "cardview": {
+            "form": "form"
+        }
+    }
+}}
+
+<div class="px-4 pt-4 pb-0" data-region="settings-cardview">
+    {{#cardview}}
+        {{{form}}}
+    {{/cardview}}
+</div>

reportbuilder/templates/local/settings/conditions.mustache

@@ -0,0 +1,72 @@
+{{!
+  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_reportbuilder/local/settings/conditions
+
+    Template for custom report conditions settings area
+
+    Example context (json):
+    {
+        "conditions": [{
+            "hasavailableconditions": true,
+            "availableconditions": [{
+                "optiongroup": [{
+                    "text": "User",
+                    "values": [{
+                        "value": 1,
+                        "visiblename": "User name"
+                    }]
+                }]
+            }],
+            "hasactiveconditions": true,
+            "activeconditionsform": "form"
+        }]
+    }
+}}
+
+<div class="p-2" data-region="settings-conditions">
+    {{#conditions}}
+        {{#hasavailableconditions}}
+            <div class="reportbuilder-conditions-select">
+                <label for="addconditionselect" class="sr-only">{{#str}} selectacondition, core_reportbuilder {{/str}}</label>
+                <select id="addconditionselect" data-action="report-add-condition" class="w-100 custom-select">
+                    <option value="0"></option>
+                    {{#availableconditions}}
+                        {{#optiongroup}}
+                            <option disabled class="suggestions-heading">{{text}}</option>
+                            {{#values}}
+                                <option value="{{value}}">{{visiblename}}</option>
+                            {{/values}}
+                        {{/optiongroup}}
+                    {{/availableconditions}}
+                </select>
+            </div>
+        {{/hasavailableconditions}}
+
+        <div class="reportbuilder-conditions-list" data-region="conditions-form">
+            {{#hasactiveconditions}}
+                {{{activeconditionsform}}}
+            {{/hasactiveconditions}}
+
+            {{^hasactiveconditions}}
+                {{< core_reportbuilder/local/settings/empty_message }}
+                    {{$nothingtoshow}} {{#str}} noconditions, core_reportbuilder {{/str}} {{/nothingtoshow}}
+                {{/ core_reportbuilder/local/settings/empty_message }}
+            {{/hasactiveconditions}}
+        </div>
+    {{/conditions}}
+</div>

reportbuilder/templates/local/settings/empty_message.mustache

@@ -0,0 +1,31 @@
+{{!
+    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_reportbuilder/local/settings/empty_message
+
+    Template for empty_message
+
+    Example context (json):
+    {
+        "nothingtoshow": "Nothing to show"
+    }
+}}
+<div class="d-flex justify-content-center">
+    <div class="text-xs-center text-center mt-3" data-region="empty-message">
+        <p class="text-muted mt-3">{{$nothingtoshow}}{{nothingtoshow}}{{/nothingtoshow}}</p>
+    </div>
+</div>

reportbuilder/templates/local/settings/filters.mustache

@@ -0,0 +1,98 @@
+{{!
+  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_reportbuilder/local/settings/filters
+
+    Template for custom report filters settings area
+
+    Example context (json):
+    {
+        "filters": [{
+            "hasavailablefilters": true,
+            "availablefilters": [{
+                "optiongroup": [{
+                    "text": "User",
+                    "values": [{
+                        "value": 1,
+                        "visiblename": "User name"
+                    }]
+                }]
+            }],
+            "hasactivefilters": true,
+            "activefilters": [{
+                "heading": "Email address",
+                "entityname": "user",
+                "headingeditable": "Email address"
+            }]
+        }]
+    }
+}}
+
+<div class="p-2" data-region="settings-filters">
+    {{#filters}}
+        {{#hasavailablefilters}}
+            <div class="reportbuilder-filters-select">
+                <label for="addfilterselect" class="sr-only">{{#str}}selectafilter, core_reportbuilder{{/str}}</label>
+                <select id="addfilterselect" name="addfilterselect" data-action="report-add-filter" class="w-100 custom-select">
+                    <option value="0"></option>
+                    {{#availablefilters}}
+                        {{#optiongroup}}
+                            <option disabled class="suggestions-heading">{{text}}</option>
+                            {{#values}}
+                                <option value="{{value}}">{{visiblename}}</option>
+                            {{/values}}
+                        {{/optiongroup}}
+                    {{/availablefilters}}
+                </select>
+            </div>
+        {{/hasavailablefilters}}
+
+        <div data-region="active-filters" class="form-vertical">
+            {{#hasactivefilters}}
+                <ul class="list-group reportbuilder-sortable-list mt-2 ml-0">
+                    {{#activefilters}}
+                        <li class="list-group-item list-group-item-action d-flex align-items-start text-dark"
+                            data-region="active-filter" data-filter-id="{{id}}" data-filter-name="{{heading}}" data-filter-position="{{sortorder}}">
+                            {{>core/drag_handle}}
+                            <div>
+                                <div class="d-flex">
+                                    <small class="text-muted text-uppercase">{{entityname}} • {{heading}}</small>
+                                </div>
+                                <div>
+                                    {{{headingeditable}}}
+                                </div>
+                            </div>
+                            <button class="btn btn-link p-0 ml-auto"
+                                    type="button"
+                                    data-action="report-remove-filter"
+                                    title="{{#str}}deletefilter, core_reportbuilder, {{{heading}}}{{/str}}"
+                                    aria-label="{{#str}}deletefilter, core_reportbuilder, {{{heading}}}{{/str}}">
+                                {{#pix}}e/cancel, core{{/pix}}
+                            </button>
+                        </li>
+                    {{/activefilters}}
+                </ul>
+            {{/hasactivefilters}}
+
+            {{^hasactivefilters}}
+                {{< core_reportbuilder/local/settings/empty_message }}
+                    {{$nothingtoshow}} {{#str}} nofilters, core_reportbuilder {{/str}} {{/nothingtoshow}}
+                {{/ core_reportbuilder/local/settings/empty_message }}
+            {{/hasactivefilters}}
+        </div>
+    {{/filters}}
+</div>

reportbuilder/templates/local/settings/sorting.mustache

@@ -0,0 +1,82 @@
+{{!
+  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_reportbuilder/local/settings/sorting
+
+    Template for custom report sortable columns settings area
+
+    Example context (json):
+    {
+        "sorting": [{
+            "hassortablecolumns": true,
+            "sortablecolumns": [{
+                "id": 1,
+                "title": "Email address",
+                "sortdirection": "4",
+                "sortenabled": true,
+                "sortorder": 1,
+                "sorticon": [{
+                    "key": "t/uplong",
+                    "component": "core",
+                    "title": "Sort column 'Email address' ascending"
+                }],
+                "heading": "Email address"
+            }]
+        }]
+    }
+}}
+
+<div class="p-2" data-region="settings-sorting">
+    {{#sorting}}
+        {{#hassortablecolumns}}
+            <ul class="list-group reportbuilder-sortable-list ml-0">
+                {{#sortablecolumns}}
+                    <li class="list-group-item list-group-item-action d-flex align-items-center text-dark"
+                        data-column-sort-id="{{id}}"
+                        data-column-sort-name="{{title}}"
+                        data-column-sort-direction="{{sortdirection}}"
+                        data-column-sort-position="{{sortorder}}">
+                        {{>core/drag_handle}}
+                        {{#sorticon}}
+                            <span class="float-right">
+                                <button id="toggle-sort-direction-{{id}}"
+                                        class="btn btn-link p-0"
+                                        data-action="report-toggle-sort-direction"
+                                        title="{{{title}}}"
+                                        aria-label="{{{title}}}"
+                                        {{^sortenabled}}disabled{{/sortenabled}}>
+                                    {{#sorticon}}{{#pix}}{{key}}, {{component}}{{/pix}}{{/sorticon}}
+                                </button>
+                            </span>
+                        {{/sorticon}}
+                        <input id="toggle-sort-{{id}}" title="{{{sortenabledtitle}}}" data-action="report-toggle-column-sorting" type="checkbox" {{#sortenabled}}checked{{/sortenabled}}>
+                        <label for="toggle-sort-{{id}}" class="mb-0">
+                            <span class="ml-2 text-dark {{^sortenabled}}text-muted{{/sortenabled}}">{{{heading}}}</span>
+                            <span class="sr-only">{{{sortenabledtitle}}}</span>
+                        </label>
+                    </li>
+                {{/sortablecolumns}}
+            </ul>
+        {{/hassortablecolumns}}
+
+        {{^hassortablecolumns}}
+            {{< core_reportbuilder/local/settings/empty_message }}
+                {{$nothingtoshow}}{{#str}} nosortablecolumns, core_reportbuilder {{/str}} {{/nothingtoshow}}
+            {{/ core_reportbuilder/local/settings/empty_message }}
+        {{/hassortablecolumns}}
+    {{/sorting}}
+</div>

reportbuilder/templates/local/sidebar-menu/area.mustache

@@ -0,0 +1,65 @@
+{{!
+    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_reportbuilder/local/sidebar-menu/area
+
+    Template for showing report sidebar menu.
+
+    Example context (json):
+    {
+        "sidebarmenucards": [{
+            "menucards": [{
+                "name": "General",
+                "items": [{
+                    "name": "Manually added users",
+                    "identifier": "core_reportbuilder:users"
+                }]
+            }]
+        }]
+    }
+}}
+<div id="region-sidebar-menu-{{uniqid}}" class="reportbuilder-sidebar-menu d-flex flex-column mr-lg-3 mb-3 mb-lg-0" data-region="sidebar-menu">
+    <div class="input-group mb-3">
+        <label for="reportbuilder-sidebar-search">
+            <span class="sr-only">{{#str}} search, core_search {{/str}}</span>
+        </label>
+        <input id="reportbuilder-sidebar-search"
+               type="text"
+               class="form-control rounded-left border-right-0"
+               placeholder="{{#str}} search, core_search {{/str}}"
+               aria-label="{{#str}} search, core_search {{/str}}"
+               data-action="sidebar-search">
+        <div class="input-group-append">
+            <span class="input-group-text pl-2 pr-0 bg-white">
+                {{#pix}} a/search, core {{/pix}}
+            </span>
+        </div>
+    </div>
+    <div class="reportbuilder-sidebar-menu-cards">
+        {{#sidebarmenucards}}
+            {{#menucards}}
+                {{> core_reportbuilder/local/sidebar-menu/card}}
+            {{/menucards}}
+        {{/sidebarmenucards}}
+    </div>
+</div>
+
+{{#js}}
+    require(['core_reportbuilder/sidebar'], function(sidebar) {
+        sidebar.init('#region-sidebar-menu-{{uniqid}}');
+    });
+{{/js}}

reportbuilder/templates/local/sidebar-menu/card.mustache

@@ -0,0 +1,45 @@
+{{!
+    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_reportbuilder/local/sidebar-menu/card
+
+    Template for showing a single report sidebar menu card.
+
+    Example context (json):
+    {
+        "name": "General",
+        "key": "general",
+        "items": [{
+            "name": "Manually added users",
+            "identifier": "core_reportbuilder:users"
+        }]
+    }
+}}
+
+<div data-region="sidebar-card">
+    {{< core_reportbuilder/toggle_card }}
+        {{$id}}card_{{key}}{{/id}}
+        {{$header}}{{name}}{{/header}}
+        {{$body}}
+            <div class="list-group list-group-flush">
+                {{#items}}
+                    {{> core_reportbuilder/local/sidebar-menu/card_item}}
+                {{/items}}
+            </div>
+        {{/body}}
+    {{/ core_reportbuilder/toggle_card }}
+</div>

reportbuilder/templates/local/sidebar-menu/card_item.mustache

@@ -0,0 +1,54 @@
+{{!
+    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_reportbuilder/local/sidebar-menu/card_item
+
+    Template for showing a single element in a sidebar menu card.
+
+    Example context (json):
+    {
+        "name": "Manually added users",
+        "identifier": "tool_reportbuilder:users"
+    }
+}}
+{{^disabled}}
+    <a href="#"
+       title="{{title}}"
+       role="button"
+       class="list-group-item list-group-item-action pr-2 bg-transparent"
+       data-region="sidebar-item"
+       data-action="{{action}}"
+       data-unique-identifier="{{identifier}}"
+       data-name="{{name}}"
+    >
+        <span class="d-flex align-items-center justify-content-between">
+            {{{name}}}
+            {{#pix}} t/add, core {{/pix}}
+        </span>
+    </a>
+{{/disabled}}
+{{#disabled}}
+    <div title="{{#str}} notavailable, core {{/str}}"
+         class="list-group-item list-group-item-action pr-2 bg-transparent text-muted"
+         data-region="sidebar-item"
+    >
+        <span class="d-flex align-items-center justify-content-between">
+            {{{name}}}
+            {{#pix}} i/info, core {{/pix}}
+        </span>
+    </div>
+{{/disabled}}

reportbuilder/templates/report.mustache

@@ -0,0 +1,60 @@
+{{!
+    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_reportbuilder/report
+
+    Template for a report
+
+    Example context (json):
+    {
+        "id": 1,
+        "contextid": 1,
+        "type": 1,
+        "parameters": [],
+        "attributes": [{
+            "name": "data-custom",
+            "value": "1"
+        }],
+        "table": "table",
+        "filterspresent": true,
+        "filtersform": "form"
+    }
+}}
+<div class="reportbuilder-report {{classes}}"
+        data-region="core_reportbuilder/report"
+        data-report-id="{{id}}"
+        data-report-type="{{type}}"
+        data-parameter="{{parameters}}"
+        {{#attributes}}{{name}}="{{value}}" {{/attributes}}>
+            <div class="reportbuilder-wrapper">
+                {{#filterspresent}}
+                    <div class="dropdown d-flex justify-content-end">
+                        {{>core_reportbuilder/local/filters/area}}
+                    </div>
+                {{/filterspresent}}
+                {{! Table }}
+                <div class="mt-2">
+                    {{{table}}}
+                </div>
+            </div>
+</div>
+
+{{#js}}
+    require(['core_reportbuilder/report'], function(report) {
+        report.init();
+    });
+{{/js}}

reportbuilder/templates/table_header_cell.mustache

@@ -0,0 +1,50 @@
+{{!
+    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_reportbuilder/table_header_cell
+
+    This template renders the header of the columns
+
+    Example context (json):
+    {
+        "entityname": "Stuff",
+        "name": "Demo",
+        "headingeditable": "Demo",
+        "movetitle": "Move column 'Demo'"
+    }
+}}
+<div class="d-flex justify-content-start">
+    <div class="mr-2">
+        {{>core/drag_handle}}
+    </div>
+    <div class="w-100">
+        <div class="d-flex justify-content-between mb-2">
+            <small class="text-muted text-nowrap text-uppercase">{{entityname}} &bull; {{name}}</small>
+            <span class="text-nowrap">
+                <button class="btn btn-link p-0"
+                        data-action="report-remove-column"
+                        type="button"
+                        title="{{#str}}deletecolumn, core_reportbuilder, {{{name}}}{{/str}}"
+                        aria-label="{{#str}}deletecolumn, core_reportbuilder, {{{name}}}{{/str}}">
+                    {{#pix}}e/cancel, core{{/pix}}
+                </button>
+            </span>
+        </div>
+        <h3 class="h5 text-nowrap">{{{headingeditable}}}</h3>
+        <small class="text-muted text-nowrap">{{{aggregationeditable}}}</small>
+    </div>
+</div>

reportbuilder/templates/toggle_card.mustache

@@ -0,0 +1,54 @@
+{{!
+    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_reportbuilder/toggle_card
+
+    Template for empty_message
+
+    Example context (json):
+    {
+        "collapsed": "collapsed",
+        "id": "htmlid",
+        "header": "Toggle card heading",
+        "buttontitle": "Expand toggle card",
+        "body": "This is the toggle card content"
+    }
+}}
+<div class="card reportbuilder-toggle-card mb-2">
+    <div class="card-header p-0">
+        <div class="d-flex align-items-center mb-0 p-1">
+            <div class="ml-3">
+                <span class="mr-1">{{$header}}{{/header}}</span> {{$helpicon}}{{/helpicon}}
+            </div>
+            <button class="btn toggle-card-button ml-auto {{$collapsed}}{{/collapsed}}"
+                    data-toggle="collapse"
+                    data-target="#{{$id}}{{uniqid}}{{/id}}"
+                    aria-expanded="true"
+                    aria-controls="{{$id}}{{uniqid}}{{/id}}"
+                    title="{{#str}}showhide, core_reportbuilder, {{$header}}{{/header}}{{/str}}"
+            >
+                <span class="collapsed-icon-container"><i class="toggle-card-icon fa fa-lg fa-angle-down"></i></span>
+                <span class="expanded-icon-container"><i class="toggle-card-icon fa fa-lg fa-angle-up"></i></span>
+            </button>
+        </div>
+    </div>
+    <div id="{{$id}}{{uniqid}}{{/id}}" class="collapse {{$collapsed}}show{{/collapsed}}">
+        <div class="card-body p-0">
+            {{$body}}{{/body}}
+        </div>
+    </div>
+</div>