SocialAccounts.razor

@using LinkDotNet.Blog.Domain
<div class="d-flex flex-row justify-content-center h3 gap-4 py-2">
    @foreach (var account in AllSocialAccounts.Where(a => a.HasAccount))
    {
	    <a id="@account.Id" class="nav-link" target="_blank" href="@account.Url" aria-label="@account.Name" rel="noreferrer">
		    <i class="@account.Icon"></i>
	    </a>
    }
</div>

@code {
    private List<SocialAccount> AllSocialAccounts =>
    [
	    // Icons have to be defined in the icons.css or basic.css as a class
	    new("linkedin", Social.HasLinkedinAccount, Social.LinkedInAccountUrl, "LinkedIn", "linkedin"),
	    new("github", Social.HasGithubAccount, Social.GithubAccountUrl, "Github", "github"),
	    new("twitter", Social.HasTwitterAccount, Social.TwitterAccountUrl, "Twitter", "twitter"),
	    new("youtube", Social.HasYoutubeAccount, Social.YoutubeAccountUrl, "Youtube", "youtube"),
	    new("bluesky", Social.HasBlueSkyHandle, $"https://bsky.app/profile/{Social.BlueSkyHandle}", "Bluesky", "bluesky"),
    ];

    [Parameter, EditorRequired]
    public required Social Social { get; set; }

    private sealed record SocialAccount(string Id, bool HasAccount, string? Url, string Name, string Icon);
}