@using FoodsharingSiegen.Contracts.Entity

@{
    var rowClass = "";
    if (Done) rowClass += " done";
    if (NotNeeded) rowClass += " notneeded";
    if (Alert) rowClass += " fs-alert";
}

<tr class="@rowClass" style="border-top: 5px solid transparent;">
    <th class="text-center align-top pr-2">
        <i class="@IconClass"></i>
    </th>
    <th class="pr-2 align-top" style="white-space: nowrap;">@Caption:</th>
    <td class="align-top d-flex flex-column">
        @if (Interactions.Count > 0)
        {
            foreach (var interaction in Interactions)
            {
                <div style="padding-bottom: .5rem;">
                    <div style="white-space: nowrap;">
                        <span title="@interaction.User.Memo">@interaction.User.Name</span> (@interaction.Date.ToShortDateString())

                        @if ((Prospect is not { Complete: true } || interaction.Type == InteractionType.Complete) && AllowInteraction)
                        {
                            <span>&nbsp;<a href=""><i class="fa-solid fa-square-xmark" @onclick="async () => { if (RemoveClick != null) await RemoveClick.Invoke(interaction.Id); }" @onclick:preventDefault></i></a></span>
                        }
                    </div>
                    
                    @if (!string.IsNullOrWhiteSpace(interaction.Info))
                    {
                        <span>(<i>@interaction.Info</i>)</span>
                    }
                </div>
            }
        }

        @if (Prospect is not {Complete: true } && (Interactions.Count == 0 || Multiple) && AllowInteraction)
        {
            if (Multiple) ButtonIconClass = "fa-solid fa-plus";
            <div class="m-auto">
                <Button Size="Size.Small" Clicked="AddClick"><i class="@ButtonIconClass" style="color: #64ae24;"></i></Button>
            </div>
        }
    </td>
</tr>