{{!
    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_course/activity_info

    Container to display activity information such as:
      - Activity dates
      - Activity completion requirements (automatic completion)
      - Manual completion button

    Example context (json):
    {
        "activityname": "Course announcements",
        "hascompletion": true,
        "uservisible": true,
        "hasdates": true,
        "isautomatic": true,
        "istrackeduser": true,
        "showmanualcompletion": true,
        "activitydates": [
            {
                "label": "Opens:",
                "timestamp": 1293876000
            }
        ],
        "completiondetails": [
             {
                "statuscomplete": 1,
                "description": "Viewed"
            },
            {
                "statusincomplete": 1,
                "description": "Receive a grade"
            }
        ]
    }
}}
<div class="rui-activity-wrapper {{#hasdates}}rui-activity--hasdates{{/hasdates}} {{#hascompletion}}rui-activity--hascompletion{{/hascompletion}} {{^hascompletion}}rui-activity--hasnotcompletion{{/hascompletion}}">
    {{#hasdates}}
    <div data-region="activity-information" data-activityname="{{activityname}}" class="rui-activity-information">
        <div data-region="activity-dates" class="rui-activity-dates">
            <svg class="d-none d-md-flex mr-2" width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
                <path d="M4.75 4.75V19.25" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path>
                <path d="M8.75 12H19.25" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path>
                <path d="M15.75 8.75L19.25 12L15.75 15.25" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path>
            </svg>
            {{#activitydates}}
                {{>core_course/activity_date}}
            {{/activitydates}}
        </div>
    </div>
    {{/hasdates}}

    {{#hascompletion}}
    {{#isautomatic}}
    <div class="rui-completion-info">
        {{#uservisible}}
            <div data-region="completion-info">
                
                    <div class="rui-completion-badges automatic-completion-conditions" data-region ="completionrequirements" role="list" aria-label="{{#str}}completionrequirements, core_course, {{activityname}}{{/str}}">
                        {{#completiondetails}}
                            {{> core_course/completion_automatic }}
                        {{/completiondetails}}
                    </div>
                
            </div>
        {{/uservisible}}
    </div>
    {{/isautomatic}}
    {{/hascompletion}}

    {{#hascompletion}}
        {{^isautomatic}}
            {{#uservisible}}
            <div class="{{^isautomatic}}rui-completion-info--manual{{/isautomatic}}">
                <div data-region="completion-info">
                    {{#showmanualcompletion}}
                        {{> core_course/completion_manual }}
                    {{/showmanualcompletion}}
                </div>
            </div>
            {{/uservisible}}
        {{/isautomatic}}
    {{/hascompletion}}
</div>