{% extends '/wpadmin_pages/insights/base.twig' %}

{% block page_main %}

	<div class="row">
		<div class="col insights-sub-nav insights_section">
			<ul class="nav nav-tabs">

				<li class="nav-item">
					<a class="nav-link active" data-bs-toggle="tab" role="tab" href="#tabUpdates"
					   data-bs-toggle="tab">
						{{ strings.tab_updates }}
					</a>
				</li>

				<li class="nav-item">
					<a class="nav-link" data-bs-toggle="tab" role="tab" href="#tabEvents"
					   data-bs-toggle="tab">
						{{ strings.tab_events }}
					</a>
				</li>

				{% if not flags.is_pro %}
					<li class="nav-item">
						<a class="nav-link" role="tab" href="{{ hrefs.free_trial }}" target="_blank">
							{{ strings.tab_freetrial }}
						</a>
					</li>
				{% endif %}

				<li class="nav-item">
					<a class="nav-link announcekit-widget"></a>
				</li>
			</ul>
		</div>
	</div>

	<div class="tab-content">

		<div class="tab-pane show active" id="tabUpdates" role="tabpanel" aria-labelledby="tabUpdates">
			<div class="row">
				<div class="col pt-3" id="TabUpdates">
					{{ content.tab_updates|raw }}
				</div>
			</div>
		</div>

		<div class="tab-pane" id="tabEvents" role="tabpanel" aria-labelledby="tabEvents">
			<div class="row">
				<div class="col pt-3" id="tabEvents">
					{{ content.tab_events|raw }}
				</div>
			</div>
		</div>

	</div>
{% endblock %}

{% block inline_scripts %}
	{{ parent() }}

	<script type="text/javascript">
	  window.announcekit = (window.announcekit || {
		  queue: [], on: function ( n, x ) {
			  window.announcekit.queue.push( [ n, x ] );
		  }, push: function ( x ) {
			  window.announcekit.queue.push( x );
		  }
	  });
	  window.announcekit.push( {
		  "widget": "https://announcekit.app/widget/{{ vars.changelog_id }}",
		  "selector": ".announcekit-widget",
		  "version": 2
	  } )
	</script>
{% endblock %}