RackPeek/Shared.Rcl/Desktops/DesktopCardComponent.razor

@using RackPeek.Domain.Resources.Desktops
@using RackPeek.Domain.Resources.SubResources
@using RackPeek.Domain.UseCases.Cpus
@using RackPeek.Domain.UseCases.Drives
@using RackPeek.Domain.UseCases.Gpus
@using Shared.Rcl.Hardware
@inject IGetResourceByNameUseCase<Desktop> GetByNameUseCase
@inject UpdateDesktopUseCase UpdateUseCase
@inject IDeleteResourceUseCase<Desktop> DeleteUseCase
@inject IAddCpuUseCase<Desktop> AddCpuUseCase
@inject IUpdateCpuUseCase<Desktop> UpdateCpuUseCase
@inject IRemoveCpuUseCase<Desktop> RemoveCpuUseCase
@inject IAddDriveUseCase<Desktop> AddDriveUseCase
@inject IUpdateDriveUseCase<Desktop> UpdateDriveUseCase
@inject IRemoveDriveUseCase<Desktop> RemoveDriveUseCase
@inject IAddGpuUseCase<Desktop> AddGpuUseCase
@inject IUpdateGpuUseCase<Desktop> UpdateGpuUseCase
@inject IRemoveGpuUseCase<Desktop> RemoveGpuUseCase
@inject ICloneResourceUseCase<Desktop> CloneUseCase
@inject IRenameResourceUseCase<Desktop> RenameUseCase
@inject NavigationManager Nav

<div class="border border-zinc-800 rounded p-4 bg-zinc-900"
     data-testid=@($"desktop-item-{Desktop.Name.Replace(" ", "-")}")>

    <div class="flex justify-between items-center mb-3">

        <div class="text-zinc-100 hover:text-emerald-300">
            <NavLink href="@($"resources/hardware/{Uri.EscapeDataString(Desktop.Name)}")"
                     class="block"
                     data-testid=@($"desktop-item-{Desktop.Name.Replace(" ", "-")}-link")>
                @Desktop.Name
            </NavLink>
        </div>

        <div class="flex items-center gap-2">

            @if (!string.IsNullOrWhiteSpace(Desktop.Model))
            {
                <span class="text-xs text-zinc-400"
                      data-testid="desktop-model-badge">
                    @Desktop.Model
                </span>
            }

            <button data-testid="rename-desktop-button"
                    class="text-xs text-blue-400 hover:text-blue-300 transition"
                    @onclick="OpenRename">
                Rename
            </button>

            <button data-testid="clone-desktop-button"
                    class="text-xs text-emerald-400 hover:text-emerald-300 transition"
                    @onclick="OpenClone">
                Clone
            </button>

            <button data-testid="delete-desktop-button"
                    class="text-xs text-red-400 hover:text-red-300 transition"
                    @onclick="ConfirmDelete">
                Delete
            </button>

        </div>
    </div>

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

        <!-- CPU -->
        <div data-testid="desktop-cpu-section">
            <div class="flex items-center justify-between mb-1 group">
                <div class="text-zinc-400">
                    CPU
                    <button data-testid="add-cpu-button"
                            class="hover:text-emerald-400 transition"
                            @onclick="OpenAddCpu">
                        +
                    </button>
                </div>
            </div>

            @if (Desktop.Cpus?.Any() == true)
            {
                @foreach (var cpu in Desktop.Cpus)
                {
                    <div
                        class="flex items-center justify-between text-zinc-300 group hover:bg-zinc-800/40 rounded px-1 py-0.5">
                        <button data-testid=@($"edit-cpu-{cpu.ToString().Replace(" ", "-")}")
                                class="hover:text-emerald-400"
                                @onclick="() => OpenEditCpu(cpu)">
                            @cpu.Model — @cpu.Cores cores / @cpu.Threads threads
                        </button>
                    </div>
                }
            }
        </div>

        <!-- RAM -->
        <div data-testid="desktop-ram-section">
            <div class="text-zinc-400 mb-1">
                RAM
                <button data-testid="edit-ram-button"
                        class="hover:text-emerald-400 transition"
                        @onclick="EditRam">
                    +
                </button>
            </div>

            @if (Desktop.Ram is not null)
            {
                <div
                    class="flex items-center justify-between text-zinc-300 group hover:bg-zinc-800/40 rounded px-1 py-0.5">
                    <button data-testid="ram-value-button"
                            class="hover:text-emerald-400"
                            @onclick="EditRam">
                        @($"{Desktop.Ram.Size} GB {Desktop.Ram.Mts} MT/s")
                    </button>
                </div>
            }
        </div>

        <!-- Drives -->
        <div data-testid="desktop-drive-section">
            <div class="flex items-center justify-between mb-1 group">
                <div class="text-zinc-400">
                    Drives
                    <button data-testid="add-drive-button"
                            class="hover:text-emerald-400 transition"
                            @onclick="OpenAddDrive">
                        +
                    </button>
                </div>
            </div>

            @if (Desktop.Drives?.Any() == true)
            {
                @foreach (var drive in Desktop.Drives)
                {
                    <div
                        class="flex items-center justify-between text-zinc-300 group hover:bg-zinc-800/40 rounded px-1 py-0.5">
                        <button data-testid=@($"edit-drive-{drive.Type}-{drive.Size}")
                                class="hover:text-emerald-400"
                                @onclick="() => OpenEditDrive(drive)">
                            @drive.Type — @drive.Size GB
                        </button>
                    </div>
                }
            }
        </div>

        <!-- NICs -->
        <PortGroupEditor T="Desktop"
                         Resource="Desktop"
                         OnResourceChanged="r => Desktop = r"
                         TestIdPrefix="desktop-ports"/>

        <!-- GPUs -->
        <div data-testid="desktop-gpu-section">
            <div class="flex items-center justify-between mb-1 group">
                <div class="text-zinc-400">
                    GPUs
                    <button data-testid="add-gpu-button"
                            class="hover:text-emerald-400 transition"
                            @onclick="OpenAddGpu">
                        +
                    </button>
                </div>
            </div>

            @if (Desktop.Gpus?.Any() == true)
            {
                @foreach (var gpu in Desktop.Gpus)
                {
                    <div
                        class="flex items-center justify-between text-zinc-300 group hover:bg-zinc-800/40 rounded px-1 py-0.5">
                        <button data-testid=@($"edit-gpu-{gpu.Model}-{gpu.Vram}")
                                class="hover:text-emerald-400"
                                @onclick="() => OpenEditGpu(gpu)">
                            @gpu.Model — @gpu.Vram GB VRAM
                        </button>
                    </div>
                }
            }
        </div>

        <ResourceTagEditor Resource="Desktop"
                           TestIdPrefix="desktop"/>

        <ResourceLabelEditor Resource="Desktop"
                             TestIdPrefix="desktop"/>


        <div class="md:col-span-2" data-testid="desktop-notes-section">
            <div class="text-zinc-400 mb-1">Notes</div>

            @if (!_editingNotes)
            {
                <MarkdownViewer Value="@Desktop.Notes"
                                ShowEditButton="true"
                                OnEdit="BeginNotesEdit"
                                TestIdPrefix="desktop-notes-viewer"/>
            }
            else
            {
                <MarkdownEditor @bind-Value="_notesDraft"
                                ShowActionButtons="true"
                                OnSave="SaveNotes"
                                OnCancel="CancelNotesEdit"
                                TestIdPrefix="desktop-notes-editor"/>
            }
        </div>
    </div>
</div>

<ConfirmModal IsOpen="_confirmDeleteOpen"
              IsOpenChanged="v => _confirmDeleteOpen = v"
              Title="Delete desktop"
              ConfirmText="Delete"
              ConfirmClass="bg-red-600 hover:bg-red-500"
              OnConfirm="DeleteServer"
              TestIdPrefix="Desktop">
    Are you sure you want to delete <strong>@Desktop.Name</strong>?
</ConfirmModal>

<StringValueModal IsOpen="_renameOpen"
                  IsOpenChanged="v => _renameOpen = v"
                  Title="Rename desktop"
                  Description="Enter a new name for this desktop"
                  Label="New desktop name"
                  Value="@Desktop.Name"
                  OnSubmit="HandleRenameSubmit"
                  TestIdPrefix="desktop-rename"/>

<StringValueModal IsOpen="_cloneOpen"
                  IsOpenChanged="v => _cloneOpen = v"
                  Title="Clone resource"
                  Description="Enter a name for the cloned resource"
                  Label="New resource name"
                  Value="@($"{Desktop.Name}-copy")"
                  OnSubmit="HandleCloneSubmit"
                  TestIdPrefix="desktop-clone"/>


<CpuModal IsOpen="@_cpuModalOpen"
          IsOpenChanged="v => _cpuModalOpen = v"
          Value="@_editingCpu"
          OnSubmit="HandleCpuSubmit"
          OnDelete="HandleCpuDelete"
          TestIdPrefix="desktop"/>


<RamModal IsOpen="@_isRamModalOpen"
          IsOpenChanged="v => _isRamModalOpen = v"
          Value="@Desktop.Ram"
          OnSubmit="HandleRamSubmit"
          TestIdPrefix="desktop"/>


<DriveModal IsOpen="@_driveModalOpen"
            IsOpenChanged="v => _driveModalOpen = v"
            Value="@_editingDrive"
            OnSubmit="HandleDriveSubmit"
            OnDelete="HandleDriveDelete"
            TestIdPrefix="desktop"/>


<GpuModal IsOpen="@_gpuModalOpen"
          IsOpenChanged="v => _gpuModalOpen = v"
          Value="@_editingGpu"
          OnSubmit="HandleGpuSubmit"
          OnDelete="HandleGpuDelete"
          TestIdPrefix="desktop"/>

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

    #region RAM

    private bool _isRamModalOpen;

    private void EditRam()
    {
        _isRamModalOpen = true;
    }

    private async Task HandleRamSubmit(Ram? value)
    {
        _isRamModalOpen = false;
        await UpdateUseCase.ExecuteAsync(Desktop.Name, Desktop.Model, value?.Size ?? 0, value?.Mts ?? 0);
        Desktop = await GetByNameUseCase.ExecuteAsync(Desktop.Name);
    }

    #endregion

    #region CPU

    bool _cpuModalOpen;
    int _editingCpuIndex;
    Cpu? _editingCpu;

    void OpenAddCpu()
    {
        _editingCpuIndex = -1;
        _editingCpu = null;
        _cpuModalOpen = true;
    }

    void OpenEditCpu(Cpu cpu)
    {
        _editingCpu = cpu;
        Desktop.Cpus ??= new List<Cpu>();
        _editingCpuIndex = Desktop.Cpus.IndexOf(cpu);
        ;
        _cpuModalOpen = true;
    }

    async Task HandleCpuSubmit(Cpu cpu)
    {
        Desktop.Cpus ??= new List<Cpu>();

        if (_editingCpuIndex < 0)
        {
            await AddCpuUseCase.ExecuteAsync(Desktop.Name, cpu.Model, cpu.Cores, cpu.Threads);
        }
        else
        {
            await UpdateCpuUseCase.ExecuteAsync(Desktop.Name, _editingCpuIndex, cpu.Model, cpu.Cores, cpu.Threads);
        }

        Desktop = await GetByNameUseCase.ExecuteAsync(Desktop.Name);
    }

    async Task HandleCpuDelete(Cpu cpu)
    {
        await RemoveCpuUseCase.ExecuteAsync(Desktop.Name, _editingCpuIndex);
        Desktop = await GetByNameUseCase.ExecuteAsync(Desktop.Name);
    }

    #endregion

    #region Drives

    bool _driveModalOpen;
    int _editingDriveIndex;
    Drive? _editingDrive;

    void OpenAddDrive()
    {
        _editingDriveIndex = -1;
        _editingDrive = null;
        _driveModalOpen = true;
    }

    void OpenEditDrive(Drive drive)
    {
        _editingDrive = drive;
        Desktop.Drives ??= new List<Drive>();
        _editingDriveIndex = Desktop.Drives.IndexOf(drive);
        ;
        _driveModalOpen = true;
    }

    async Task HandleDriveSubmit(Drive drive)
    {
        Desktop.Drives ??= new List<Drive>();

        if (_editingDriveIndex < 0)
        {
            await AddDriveUseCase.ExecuteAsync(Desktop.Name, drive.Type, drive.Size);
        }
        else
        {
            await UpdateDriveUseCase.ExecuteAsync(Desktop.Name, _editingDriveIndex, drive.Type, drive.Size);
        }

        Desktop = await GetByNameUseCase.ExecuteAsync(Desktop.Name);
        StateHasChanged();
    }

    async Task HandleDriveDelete(Drive drive)
    {
        await RemoveDriveUseCase.ExecuteAsync(Desktop.Name, _editingDriveIndex);
        Desktop = await GetByNameUseCase.ExecuteAsync(Desktop.Name);
        StateHasChanged();
    }

    #endregion

    #region GPUs

    bool _gpuModalOpen;
    int _editingGpuIndex;
    Gpu? _editingGpu;

    void OpenAddGpu()
    {
        _editingGpuIndex = -1;
        _editingGpu = null;
        _gpuModalOpen = true;
    }

    void OpenEditGpu(Gpu gpu)
    {
        Desktop.Gpus ??= new List<Gpu>();
        _editingGpuIndex = Desktop.Gpus.IndexOf(gpu);
        _editingGpu = gpu;
        _gpuModalOpen = true;
    }

    async Task HandleGpuSubmit(Gpu gpu)
    {
        Desktop.Gpus ??= new List<Gpu>();

        if (_editingGpuIndex < 0)
        {
            await AddGpuUseCase.ExecuteAsync(
                Desktop.Name,
                gpu.Model,
                gpu.Vram);
        }
        else
        {
            await UpdateGpuUseCase.ExecuteAsync(
                Desktop.Name,
                _editingGpuIndex,
                gpu.Model,
                gpu.Vram);
        }

        Desktop = await GetByNameUseCase.ExecuteAsync(Desktop.Name);
    }

    async Task HandleGpuDelete(Gpu gpu)
    {
        await RemoveGpuUseCase.ExecuteAsync(Desktop.Name, _editingGpuIndex);
        Desktop = await GetByNameUseCase.ExecuteAsync(Desktop.Name);
    }

    #endregion

}

@code {
    private bool _confirmDeleteOpen;
    [Parameter] public EventCallback<string> OnDeleted { get; set; }

    void ConfirmDelete()
    {
        _confirmDeleteOpen = true;
    }

    async Task DeleteServer()
    {
        _confirmDeleteOpen = false;

        await DeleteUseCase.ExecuteAsync(Desktop.Name);

        if (OnDeleted.HasDelegate)
            await OnDeleted.InvokeAsync(Desktop.Name);
    }

}

@code
{
    bool _renameOpen;

    void OpenRename()
    {
        _renameOpen = true;
    }

    async Task HandleRenameSubmit(string newName)
    {
        await RenameUseCase.ExecuteAsync(Desktop.Name, newName);
        Nav.NavigateTo($"resources/hardware/{Uri.EscapeDataString(newName)}");
    }

}

@code
{
    bool _cloneOpen;

    void OpenClone()
    {
        _cloneOpen = true;
    }

    async Task HandleCloneSubmit(string newName)
    {
        await CloneUseCase.ExecuteAsync(Desktop.Name, newName);

        Nav.NavigateTo($"resources/hardware/{Uri.EscapeDataString(newName)}");
    }

}

@code
{
    bool _editingNotes;
    string? _notesDraft;

    void BeginNotesEdit()
    {
        _editingNotes = true;
        _notesDraft = Desktop.Notes; // draft buffer
    }

    void CancelNotesEdit()
    {
        _editingNotes = false;
        _notesDraft = null; // discard
    }

    async Task SaveNotes()
    {
        _editingNotes = false;

        await UpdateUseCase.ExecuteAsync(
            Desktop.Name,
            Desktop.Model,
            Desktop.Ram?.Size,
            Desktop.Ram?.Mts,
            _notesDraft);

        Desktop = await GetByNameUseCase.ExecuteAsync(Desktop.Name);
        _notesDraft = null;
    }


}