<xf:title>{{ phrase('connected_account_providers') }}</xf:title>

<div class="block">
	<div class="block-outer">
		<xf:macro id="filter_macros::quick_filter" arg-key="connected-accounts" arg-class="block-outer-opposite" />
	</div>
	<div class="block-container">
		<xf:if is="$activeProviders is not empty">
			<div class="block-body">
				<xf:datalist>
					<xf:datarow rowtype="subsection" rowclass="dataList-row--noHover">
						<xf:cell colspan="3">{{ phrase('active_providers') }}</xf:cell>
					</xf:datarow>
					<xf:foreach loop="$activeProviders" value="$provider">
						<xf:datarow label="{$provider.title}" href="{{ link('connected-accounts/edit', $provider) }}">
							<xf:if is="$provider.canBeTested()">
								<xf:action href="{{ link('connected-accounts/test', $provider) }}" overlay="true">{{ phrase('test_provider') }}</xf:action>
							<xf:else />
								<xf:cell />
							</xf:if>
							<xf:delete href="{{ link('connected-accounts/deactivate', $provider) }}" tooltip="{{ phrase('deactivate') }}" />
						</xf:datarow>
					</xf:foreach>
				</xf:datalist>
			</div>
		<xf:else />
			<!--<div class="block-body block-row">{{ phrase('there_no_active_providers_yet') }}</div>-->
		</xf:if>

		<xf:if is="$inactiveProviders is not empty">
			<div class="block-body">
				<xf:datalist>
					<xf:datarow rowtype="subsection" rowclass="dataList-row--noHover">
						<xf:cell>{{ phrase('inactive_providers') }}</xf:cell>
					</xf:datarow>
					<xf:foreach loop="$inactiveProviders" value="$provider">
						<xf:datarow label="{$provider.title}" href="{{ link('connected-accounts/edit', $provider) }}" />
					</xf:foreach>
				</xf:datalist>
			</div>
		</xf:if>
		<div class="block-footer">
			<span class="block-footer-counter">{{ display_totals(count($activeProviders) + count($inactiveProviders)) }}</span>
		</div>
	</div>
</div>