@using BlazorApp.Components;
@using BlazorApp.Pages;
@using BlazorApp.Models;

<CascadingValue Value="@this">
    <div class="container">
        <div class="row">
            <div class="col-6">

                <div>Inventory:</div>
                <div>


                    <div class="css-grid">
                        <InventoryItem Index="0" />
                        <InventoryItem Index="1" />
                        <InventoryItem Index="2" />
                        <InventoryItem Index="3" />
                        <InventoryItem Index="4" />
                        <InventoryItem Index="5" />
                        <InventoryItem Index="6" />
                        <InventoryItem Index="7" />
                        <InventoryItem Index="8" />
                        <InventoryItem Index="9" />
                        <InventoryItem Index="10" />
                        <InventoryItem Index="11" />
                        <InventoryItem Index="12" />
                        <InventoryItem Index="13" />
                        <InventoryItem Index="14" />
                        <InventoryItem Index="15" />
                        <InventoryItem Index="16" />
                        <InventoryItem Index="17" />
                    </div>

                </div>

            </div>

            <div class="col-6">
                
                <div>Available items:</div>

    <div class="css-dataGrid">

        <div class="bar">
            <input type="text" />
            <Button type="submit" @onclick="() => SortByName()">SORT</Button>
        </div>
        <DataGrid TItem="Item"
                  Data="@Items"
                  ReadData="@OnReadData"
                  TotalItems="@totalItem"
                  PageSize="10"
                  ShowPager
                  Sortable="true">


            <DataGridColumn TItem="Item" Field="@nameof(Item.Id)">
                <DisplayTemplate>
                    <InventoryItem Item="@context" NoDrop="true" />
                </DisplayTemplate>
            </DataGridColumn>
            <DataGridColumn TItem="Item" Field="@nameof(Item.DisplayName)" />
        </DataGrid>

    </div>

                </div>
         </div>
        
            
    </div>
</CascadingValue>