component ProfileHeader(viewUser *arn.User, user *arn.User)
	.profile
		img.profile-cover(src=viewUser.CoverImageURL(), alt="Cover image")

		.image-container.mountable.never-unmount
			ProfileImage(viewUser)

		.intro-container.mountable.never-unmount
			h2#nick= viewUser.Nick

			if viewUser.Tagline != ""
				p.profile-field.tagline
					Icon("comment")
					span.tagline-text= viewUser.Tagline
			else
				p.profile-field.tagline
					Icon("comment")
					span.tagline-text No tagline yet.

			if viewUser.Website != ""
				p.profile-field.website
					Icon("home")
					a(href=viewUser.WebsiteURL(), target="_blank", rel="nofollow")= viewUser.Website

			if viewUser.Accounts.Osu.Nick != "" && viewUser.Accounts.Osu.PP >= 1000
				p.profile-field.osu(title="osu! Level " + toString(int(viewUser.Accounts.Osu.Level)) + " | Accuracy: " + fmt.Sprintf("%.1f", viewUser.Accounts.Osu.Accuracy) + "%")
					Icon("trophy")
					a(href="https://osu.ppy.sh/u/" + viewUser.Accounts.Osu.Nick, target="_blank", rel="noopener")= toString(int(viewUser.Accounts.Osu.PP)) + " pp"

			//- if viewUser.dataEditCount
			//- 	p.profile-field.editor-contribution(title="Anime data modifications")
			//- 		Icon("edit")
			//- 		span= viewUser.dataEditCount

			if viewUser.Registered != ""
				p.profile-field.registration-date(title="Member since")
					Icon("calendar")
					//- span= time.Parse(time.RFC3339, viewUser.Registered)
					span= viewUser.RegisteredTime().Format("Jan 2006")
					//- span= monthNames[joined.getMonth()] + ' ' + joined.getFullYear()

			if viewUser.Role != ""
				p.profile-field.role
					Icon("rocket")
					span= arn.Capitalize(viewUser.Role)
	
	ProfileNavigation(viewUser)

component ProfileNavigation(viewUser *arn.User)
	.buttons.tabs
		a.button.tab.action(href="/+" + viewUser.Nick, data-action="diff", data-trigger="click")
			Icon("th")
			span.tab-text Anime

		a.button.tab.action(href="/+" + viewUser.Nick + "/animelist", data-action="diff", data-trigger="click")
			Icon("list")
			span.tab-text Collection

		a.button.tab.action(href="/+" + viewUser.Nick + "/threads", data-action="diff", data-trigger="click")
			Icon("comment")
			span.tab-text Threads

		a.button.tab.action(href="/+" + viewUser.Nick + "/posts", data-action="diff", data-trigger="click")
			Icon("comments")
			span.tab-text Posts

		a.button.tab.action(href="/+" + viewUser.Nick + "/tracks", data-action="diff", data-trigger="click")
			Icon("music")
			span.tab-text Tracks
	
	StatusTabs("/+" + viewUser.Nick + "/animelist")
	
component StatusTabs(urlPrefix string)
	.buttons.tabs
		a.button.tab.action(href=urlPrefix + "/watching", data-action="diff", data-trigger="click")
			Icon("play")
			span.tab-text Watching
		
		a.button.tab.action(href=urlPrefix + "/completed", data-action="diff", data-trigger="click")
			Icon("check")
			span.tab-text Completed

		a.button.tab.action(href=urlPrefix + "/planned", data-action="diff", data-trigger="click")
			Icon("forward")
			span.tab-text Planned

		a.button.tab.action(href=urlPrefix + "/hold", data-action="diff", data-trigger="click")
			Icon("pause")
			span.tab-text On Hold

		a.button.tab.action(href=urlPrefix + "/dropped", data-action="diff", data-trigger="click")
			Icon("stop")
			span.tab-text Dropped

component Profile(viewUser *arn.User, user *arn.User, animeList *arn.AnimeList, threads []*arn.Thread, posts []*arn.Post, tracks []*arn.SoundTrack)
	ProfileHeader(viewUser, user)

	if len(animeList.Items) == 0
		p.no-data.mountable= viewUser.Nick + " hasn't added any anime yet."
	else
		.profile-watching-list.mountable
			each item in animeList.Items
				a.profile-watching-list-item.ajax(href=item.Anime().Link(), title=item.Anime().Title.Canonical + " (" + toString(item.Episodes) + " / " + arn.EpisodesToString(item.Anime().EpisodeCount) + ")")
					img.anime-cover-image.profile-watching-list-item-image.lazy(data-src=item.Anime().Image.Tiny, alt=item.Anime().Title.Canonical)
	
	//- .profile-category.mountable
	//- 	h3
	//- 		a.ajax(href="/+" + viewUser.Nick + "/threads", title="View all threads") Threads

	//- 	if len(threads) == 0
	//- 		p No threads on the forum.
	//- 	else
	//- 		each thread in threads
	//- 			ThreadLink(thread)
	
	//- .profile-category.mountable
	//- 	h3
	//- 		a.ajax(href="/+" + viewUser.Nick + "/posts", title="View all posts") Posts
	//- 	if len(posts) == 0
	//- 		p No posts on the forum.
	//- 	else
	//- 		each post in posts
	//- 			.post
	//- 				.post-author
	//- 					Avatar(post.Author())
	//- 				.post-content
	//- 					div!= post.HTML()
	//- 					.post-toolbar.active
	//- 						.spacer
	//- 						.post-likes= len(post.Likes)
	
	//- .profile-category.mountable
	//- 	h3
	//- 		a.ajax(href="/+" + viewUser.Nick + "/tracks", title="View all tracks") Tracks

	//- 	if len(tracks) == 0
	//- 		p No soundtracks posted yet.
	//- 	else
	//- 		.sound-tracks
	//- 			each track in tracks
	//- 				SoundTrack(track)

	//- if user != nil && user.Role == "admin"
	//- 	.footer
	//- 		a(href="/api/user/" + viewUser.ID) User API