package components

// SidebarItem represents a navigation item
type SidebarItem struct {
	ID     string
	Icon   string
	Label  string
	Href   string
	Active bool
	Badge  string
}

// DefaultSidebarItems returns the main navigation items
func DefaultSidebarItems(activeTab string) []SidebarItem {
	return []SidebarItem{
		{ID: "overview", Icon: "house", Label: "Overview", Href: "/dashboard?tab=overview", Active: activeTab == "overview" || activeTab == ""},
		{ID: "transactions", Icon: "right-left", Label: "Transactions", Href: "/dashboard?tab=transactions", Active: activeTab == "transactions"},
		{ID: "tokens", Icon: "wallet", Label: "Tokens", Href: "/dashboard?tab=tokens", Active: activeTab == "tokens"},
		{ID: "nfts", Icon: "images", Label: "NFTs", Href: "/dashboard?tab=nfts", Active: activeTab == "nfts"},
		{ID: "activity", Icon: "clock-rotate-left", Label: "Activity", Href: "/dashboard?tab=activity", Active: activeTab == "activity"},
	}
}

// SecondarySidebarItems returns the bottom navigation items
func SecondarySidebarItems(activeTab string) []SidebarItem {
	return []SidebarItem{
		{ID: "settings", Icon: "gear", Label: "Settings", Href: "/settings", Active: activeTab == "settings"},
	}
}

templ NavigationItems(activeTab string) {
	for _, item := range DefaultSidebarItems(activeTab) {
		<a
			href={ templ.SafeURL(item.Href) }
			class={ "nav-item", templ.KV("active", item.Active) }
			hx-get={ item.Href }
			hx-target="#dashboard-content"
			hx-swap="outerHTML"
			hx-push-url="true"
			preload="mousedown"
		>
			<wa-icon name={ item.Icon }></wa-icon>
			{ item.Label }
			if item.Badge != "" {
				<wa-badge variant="danger" pill>{ item.Badge }</wa-badge>
			}
		</a>
	}
	<div class="nav-section">
		<div class="nav-section-title">Settings</div>
		for _, item := range SecondarySidebarItems(activeTab) {
			<a
				href={ templ.SafeURL(item.Href) }
				class={ "nav-item", templ.KV("active", item.Active) }
			>
				<wa-icon name={ item.Icon }></wa-icon>
				{ item.Label }
			</a>
		}
	</div>
}