Add TenantGridComponent with HTML template, styles, and unit tests for tenant display
This commit is contained in:
parent
a21d59fe41
commit
b5e8c28104
@ -0,0 +1,12 @@
|
|||||||
|
@if (loading()) {
|
||||||
|
Loading...
|
||||||
|
} @else {
|
||||||
|
@for (tenant of tenants(); track tenant.id) {
|
||||||
|
<app-panel class="neutral-80">
|
||||||
|
<span class="title">{{tenant.name}}</span>
|
||||||
|
<span class="actions">
|
||||||
|
<app-link [href]="'tenants/'+tenant.id">View Details</app-link>
|
||||||
|
</span>
|
||||||
|
</app-panel>
|
||||||
|
}
|
||||||
|
}
|
||||||
@ -0,0 +1,13 @@
|
|||||||
|
:host {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
gap: .5rem;
|
||||||
|
|
||||||
|
app-panel {
|
||||||
|
display: flex;
|
||||||
|
}
|
||||||
|
|
||||||
|
.actions {
|
||||||
|
margin-left: auto;
|
||||||
|
}
|
||||||
|
}
|
||||||
@ -0,0 +1,23 @@
|
|||||||
|
import { ComponentFixture, TestBed } from '@angular/core/testing';
|
||||||
|
|
||||||
|
import { TenantGridComponent } from './tenant-grid.component';
|
||||||
|
|
||||||
|
describe('TenantGridComponent', () => {
|
||||||
|
let component: TenantGridComponent;
|
||||||
|
let fixture: ComponentFixture<TenantGridComponent>;
|
||||||
|
|
||||||
|
beforeEach(async () => {
|
||||||
|
await TestBed.configureTestingModule({
|
||||||
|
imports: [TenantGridComponent]
|
||||||
|
})
|
||||||
|
.compileComponents();
|
||||||
|
|
||||||
|
fixture = TestBed.createComponent(TenantGridComponent);
|
||||||
|
component = fixture.componentInstance;
|
||||||
|
fixture.detectChanges();
|
||||||
|
});
|
||||||
|
|
||||||
|
it('should create', () => {
|
||||||
|
expect(component).toBeTruthy();
|
||||||
|
});
|
||||||
|
});
|
||||||
@ -0,0 +1,31 @@
|
|||||||
|
import {Component, inject, OnInit, signal} from '@angular/core';
|
||||||
|
import {TenantService} from '../../../clients/gandalf/mithrandir/tenant/tenant.service';
|
||||||
|
import {TenantGridViewDto} from '../../../clients/gandalf/mithrandir/tenant/dtos/tenant-grid-view-dto';
|
||||||
|
import {PanelComponent} from '../../panel/panel.component';
|
||||||
|
import {LinkComponent} from '../../link/link.component';
|
||||||
|
|
||||||
|
@Component({
|
||||||
|
selector: 'app-tenant-grid',
|
||||||
|
imports: [
|
||||||
|
PanelComponent,
|
||||||
|
LinkComponent
|
||||||
|
],
|
||||||
|
templateUrl: './tenant-grid.component.html',
|
||||||
|
styleUrl: './tenant-grid.component.scss'
|
||||||
|
})
|
||||||
|
export class TenantGridComponent implements OnInit {
|
||||||
|
|
||||||
|
protected tenants = signal<TenantGridViewDto[]>([]);
|
||||||
|
protected loading = signal<boolean>(true);
|
||||||
|
|
||||||
|
private tenantService = inject(TenantService);
|
||||||
|
|
||||||
|
async ngOnInit(): Promise<void> {
|
||||||
|
|
||||||
|
const tenants = await this.tenantService.tenantsAsync();
|
||||||
|
this.tenants.set(tenants);
|
||||||
|
this.loading.set(false);
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
Loading…
x
Reference in New Issue
Block a user