NotificationFilterTabs
DomainPill-style filter tabs for a notification list. Includes count badges, active/inactive colors, and is accessible via role="tab" / aria-selected.
<%- include('modules/domain/common/notification/NotificationFilterTabs', {
tabs: [
{ id: 'all', label: 'All', count: 24 },
{ id: 'unread', label: 'Unread', count: 5 },
{ id: 'mentions', label: 'Mentions', count: 2 },
{ id: 'system', label: 'System', count: 17 },
],
activeId: 'all'
}) %>
<%- include('modules/domain/common/notification/NotificationFilterTabs', {
tabs: [
{ id: 'all', label: 'All' },
{ id: 'unread', label: 'Unread' },
{ id: 'archived', label: 'Archived' },
],
activeId: 'unread'
}) %>
<%
var _tabs = locals.tabs || [];
var _activeId = locals.activeId || (_tabs.length > 0 ? _tabs[0].id : '');
var _id = locals.id || 'notif-filter-tabs-' + Math.random().toString(36).substr(2, 9);
var _className = locals.className || '';
%>
<% _tabs.forEach(function (tab) { %>
<% var isActive = tab.id === _activeId; %>
<% }); %>