package templates

import (
	"backend/internal/auth"
	"backend/internal/db/sqlc"
)

templ AccountProvidersPage(user *auth.User, providers []LinkedProviderStatus, csrfToken string, activePath string, tablos []sqlc.Tablo, pageTitle string, breadcrumb []BreadcrumbItem) {
	@AppLayout("Linked providers", user, csrfToken, activePath, tablos, pageTitle, breadcrumb, nil) {
		<section class="mx-auto max-w-xl">
			<h1 class="mb-6 text-xl font-semibold">Linked providers</h1>
			<div class="space-y-2">
				for _, provider := range providers {
					<div class="min-h-11 rounded border border-slate-200 bg-white px-4 py-3 sm:flex sm:items-center sm:justify-between">
						<div class="text-sm font-medium text-slate-900">{ provider.Name }</div>
						<div class="mt-1 text-sm text-slate-600 sm:mt-0 sm:text-right">
							if provider.Connected {
								<div>Connected</div>
								<div class="text-slate-500">{ provider.Email }</div>
							} else {
								<div>Not connected</div>
							}
						</div>
					</div>
				}
			</div>
		</section>
	}
}