RackPeek/RackPeek.Web/Components/Systems/SystemCardComponent.razor

@using RackPeek.Web.Components.Components
@typeparam TSystem where TSystem : RackPeek.Domain.Resources.SystemResources.SystemResource

<div class="border border-zinc-800 rounded p-4 bg-zinc-900">
    <div class="flex justify-between items-center mb-3">
        <div class="text-zinc-100">
            @System.Name
        </div>

        <div class="flex gap-3 text-xs">
            @if (!_isEditing)
            {
                <button class="text-zinc-400 hover:text-zinc-200"
                        @onclick="BeginEdit">
                    Edit
                </button>
            }
            else
            {
                <button class="text-emerald-400 hover:text-emerald-300"
                        @onclick="Save">
                    Save
                </button>
                <button class="text-zinc-500 hover:text-zinc-300"
                        @onclick="Cancel">
                    Cancel
                </button>
            }
        </div>
    </div>

    <div class="grid grid-cols-1 md:grid-cols-2 gap-3 text-sm">

        <!-- Type -->
        <div>
            <div class="text-zinc-400 mb-1">Type</div>
            @if (_isEditing)
            {
                <input class="input"
                       @bind="_edit.Type"/>
            }
            else if (!string.IsNullOrWhiteSpace(System.Type))
            {
                <div class="text-zinc-300">@System.Type</div>
            }
        </div>

        <!-- OS -->
        <div>
            <div class="text-zinc-400 mb-1">OS</div>
            @if (_isEditing)
            {
                <input class="input"
                       @bind="_edit.Os"/>
            }
            else if (!string.IsNullOrWhiteSpace(System.Os))
            {
                <div class="text-zinc-300">@System.Os</div>
            }
        </div>

        <!-- Cores -->
        <div>
            <div class="text-zinc-400 mb-1">Cores</div>
            @if (_isEditing)
            {
                <input type="number"
                       class="input"
                       @bind="_edit.Cores"/>
            }
            else if (System.Cores.HasValue)
            {
                <div class="text-zinc-300">@System.Cores</div>
            }
        </div>

        <!-- RAM -->
        <div>
            <div class="text-zinc-400 mb-1">RAM (GB)</div>
            @if (_isEditing)
            {
                <input type="number"
                       class="input"
                       @bind="_edit.Ram"/>
            }
            else if (System.Ram.HasValue)
            {
                <div class="text-zinc-300">@System.Ram GB</div>
            }
        </div>

        <!-- Runs On -->
        <div>
            <div class="text-zinc-400 mb-1">Runs On</div>
            @if (_isEditing)
            {
                <input class="input"
                       @bind="_edit.RunsOn"/>
            }
            else if (!string.IsNullOrWhiteSpace(System.RunsOn))
            {
                <NavLink href="@($"/resources/hardware/{System.RunsOn}")"
                         class="text-emerald-400 text-sm">
                    @System.RunsOn
                </NavLink>
            }
        </div>

        <!-- Drives (read-only) -->
        @if (!_isEditing && System.Drives?.Any() == true)
        {
            <div>
                <div class="text-zinc-400 mb-1">Drives</div>
                @foreach (var drive in System.Drives)
                {
                    <div class="text-zinc-300">
                        @drive.Type — @drive.Size GB
                    </div>
                }
            </div>
        }

    </div>
</div>

@code {
    [Parameter][EditorRequired] public TSystem System { get; set; } = default!;

    [Parameter] public EventCallback<SystemEditModel> OnSave { get; set; }

    private bool _isEditing;
    private SystemEditModel _edit = new();

    void BeginEdit()
    {
        _edit = SystemEditModel.From(System);
        _isEditing = true;
    }

    async Task Save()
    {
        _isEditing = false;
        await OnSave.InvokeAsync(_edit);
    }

    void Cancel()
    {
        _isEditing = false;
    }

}