{% from "govuk/components/tabs/macro.njk" import govukTabs %}
{% from "govuk/components/inset-text/macro.njk" import govukInsetText %}
{%- from "moj/components/alert/macro.njk" import mojAlert -%}
{% from "./my-reports-list/macro.njk" import dprMyReportList %}
{% from "./my-reports-notification/view.njk" import dprMyReportsListNotification %}

{% macro dprMyReports(myReportsConfig) %}

  {% set items = [] %}
  {% set requested = myReportsConfig.requested %}
  {% set bookmarks = myReportsConfig.bookmarks %}
  {% set viewed = myReportsConfig.viewed %}
  {% set subscriptions = myReportsConfig.subscriptions %}
  {% set messages = myReportsConfig.messages %}

  {{ dprMyReportsListNotification(messages) }}

  {% if bookmarks %}
    {% set bookmarksHtml %}
      {{ dprMyReportList(bookmarks) }}
    {% endset %}

    {%
      set items = (items.push({
        label: "Bookmarks (" + bookmarks.totals.total + ")",
        id: "my-bookmarks-tab",
        panel: { html: bookmarksHtml }
      }), items)
    -%}
  {% endif %}

  {% if requested %}
    {% set requestedHtml %}
      {{ dprMyReportList(requested) }}
    {% endset -%}

    {%
      set items = (items.push({
        label: "Requested (" + requested.totals.total + ")",
        id: "requested-reports-tab",
        panel: { html: requestedHtml }
      }), items)
    %}
  {% endif %}

  {% if viewed %}
    {% set viewedHtml %}
      {{ dprMyReportList(viewed) }}
    {% endset -%}

    {%
      set items = (items.push({
        label: "Viewed (" + viewed.totals.total + ")",
        id: "recently-viewed-tab",
        panel: { html: viewedHtml }
      }), items)
    %}
  {% endif %}

  {% if subscriptions %}
    {% set viewedHtml %}
      {{ dprMyReportList(subscriptions) }}
    {% endset -%}

    {%
      set items = (items.push({
        label: "Subscriptions (" + subscriptions.totals.total + ")",
        id: "subscriptions-tab",
        panel: { html: viewedHtml }
      }), items)
    %}
  {% endif %}

  <div id="dpr-user-reports-list-component">{{ govukTabs({ items: items}) }}</div>
{% endmacro %}