
<nz-card>
    <nz-table #basicTable [nzData]="items$ | async">
        <thead>
            <tr>
                <th>For Device</th>
                <th>Description</th>
                <th>Build Date</th>
                <th>App Version</th>
                <th>Update Version</th>
                <th>Status</th>
                <th>Actions</th>
            </tr>
        </thead>
        <tbody>
            <tr *ngFor="let item of basicTable.data">
                <td>{{ item.deviceType }}</td>
                <td>{{ item.description }}</td>
                <td>{{ item.buildDate | date: "HH:mm dd-MMM-yyyy" }}</td>
                <td>{{ item.appVersion }}</td>
                <td>{{ item.updateVersion }}</td>
                <td>
                    <nz-switch
                        [ngModel]="item.isEnabled"
                        (ngModelChange)="handleToggleUpdateEnabled(item)"
                        [nzCheckedChildren]="'Enabled'"
                        [nzUnCheckedChildren]="'Disabled'"
                    >
                    </nz-switch>
                </td>
                <td>
                    <button 
                        nz-button 
                        nzType="default" 
                        nzDanger
                        (click)="handleDeleteUpdate(item)"
                        nz-tooltip
                        nzTooltipTitle="Delete Update"
                    >
                        <i nz-icon nzType="delete" nzTheme="outline"></i>
                    </button>
                </td>
            </tr>
        </tbody>
    </nz-table>
</nz-card>