generated from bisco/codex-bootstrap
fix: remove scouting quick filter bar
This commit is contained in:
@@ -126,23 +126,6 @@ button {
|
||||
background: #e7eeeb;
|
||||
}
|
||||
|
||||
.quickbar {
|
||||
display: grid;
|
||||
grid-template-columns: auto minmax(0, 1fr) auto;
|
||||
gap: 10px;
|
||||
align-items: center;
|
||||
margin-top: 10px;
|
||||
padding: 10px 0;
|
||||
}
|
||||
|
||||
.chip-group {
|
||||
display: flex;
|
||||
gap: 6px;
|
||||
overflow-x: auto;
|
||||
scrollbar-width: thin;
|
||||
}
|
||||
|
||||
.chip-group button,
|
||||
.sort {
|
||||
min-height: 30px;
|
||||
padding: 0 10px;
|
||||
@@ -152,20 +135,12 @@ button {
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.chip-group button.active,
|
||||
.sort.active {
|
||||
color: white;
|
||||
background: var(--accent);
|
||||
border-color: var(--accent);
|
||||
}
|
||||
|
||||
.filter-count {
|
||||
color: var(--muted);
|
||||
font-size: 0.8rem;
|
||||
font-weight: 800;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.alert {
|
||||
margin: 10px 0 0;
|
||||
padding: 12px 14px;
|
||||
@@ -179,7 +154,7 @@ button {
|
||||
display: grid;
|
||||
grid-template-columns: minmax(0, 1fr) 390px;
|
||||
gap: 16px;
|
||||
margin-top: 8px;
|
||||
margin-top: 14px;
|
||||
align-items: start;
|
||||
}
|
||||
|
||||
@@ -351,8 +326,7 @@ dd {
|
||||
padding-top: 14px;
|
||||
}
|
||||
|
||||
.topbar,
|
||||
.quickbar {
|
||||
.topbar {
|
||||
align-items: stretch;
|
||||
display: grid;
|
||||
grid-template-columns: 1fr;
|
||||
|
||||
@@ -81,48 +81,6 @@
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="quickbar" aria-label="Quick filters">
|
||||
<div class="chip-group" aria-label="Position quick filter">
|
||||
<button
|
||||
type="button"
|
||||
[class.active]="filters.position === ''"
|
||||
[attr.aria-pressed]="filters.position === ''"
|
||||
(click)="setPosition('')"
|
||||
>
|
||||
All positions
|
||||
</button>
|
||||
<button
|
||||
*ngFor="let position of positions"
|
||||
type="button"
|
||||
[class.active]="filters.position === position"
|
||||
[attr.aria-pressed]="filters.position === position"
|
||||
(click)="setPosition(position)"
|
||||
>
|
||||
{{ position }}
|
||||
</button>
|
||||
</div>
|
||||
<div class="chip-group league-chips" aria-label="League quick filter">
|
||||
<button
|
||||
type="button"
|
||||
[class.active]="filters.league === ''"
|
||||
[attr.aria-pressed]="filters.league === ''"
|
||||
(click)="setLeague('')"
|
||||
>
|
||||
All leagues
|
||||
</button>
|
||||
<button
|
||||
*ngFor="let league of leagues"
|
||||
type="button"
|
||||
[class.active]="filters.league === league"
|
||||
[attr.aria-pressed]="filters.league === league"
|
||||
(click)="setLeague(league)"
|
||||
>
|
||||
{{ league }}
|
||||
</button>
|
||||
</div>
|
||||
<span class="filter-count">{{ isUpdatingResults ? 'Updating...' : activeFiltersCount + ' active' }}</span>
|
||||
</section>
|
||||
|
||||
<p *ngIf="errorMessage" class="alert">{{ errorMessage }}</p>
|
||||
|
||||
<section class="workspace" aria-label="Scouting workspace">
|
||||
|
||||
@@ -89,24 +89,6 @@ describe('AppComponent', () => {
|
||||
assert.equal(calls, 1);
|
||||
});
|
||||
|
||||
it('applies quick filters immediately and can clear them with all controls', () => {
|
||||
const requestedPositions: string[] = [];
|
||||
const api = {
|
||||
searchPlayers: (filters: { position: string; league: string }) => {
|
||||
requestedPositions.push(`${filters.position}:${filters.league}`);
|
||||
return of({ count: 0, results: [] });
|
||||
},
|
||||
} as unknown as PlayerApiService;
|
||||
const component = new AppComponent(api);
|
||||
|
||||
component.setPosition('PG');
|
||||
component.setLeague('LBA');
|
||||
component.setPosition('');
|
||||
component.setLeague('');
|
||||
|
||||
assert.deepEqual(requestedPositions, ['PG:', 'PG:LBA', ':LBA', ':']);
|
||||
});
|
||||
|
||||
it('shows the loading placeholder only before results exist', () => {
|
||||
const api = {
|
||||
searchPlayers: () => of({ count: samplePlayers.length, results: samplePlayers }),
|
||||
|
||||
@@ -95,16 +95,6 @@ export class AppComponent {
|
||||
this.search();
|
||||
}
|
||||
|
||||
setPosition(position: string): void {
|
||||
this.filters.position = position;
|
||||
this.search();
|
||||
}
|
||||
|
||||
setLeague(league: string): void {
|
||||
this.filters.league = league;
|
||||
this.search();
|
||||
}
|
||||
|
||||
sortBy(key: SortKey): void {
|
||||
this.activeSort = key;
|
||||
this.players = this.sortPlayers(this.players);
|
||||
@@ -140,27 +130,10 @@ export class AppComponent {
|
||||
return (total / this.players.length).toFixed(2);
|
||||
}
|
||||
|
||||
get activeFiltersCount(): number {
|
||||
return [
|
||||
this.filters.q,
|
||||
this.filters.position,
|
||||
this.filters.role,
|
||||
this.filters.league,
|
||||
this.filters.minPoints,
|
||||
this.filters.minAssists,
|
||||
this.filters.minRebounds,
|
||||
this.filters.minEfficiency,
|
||||
].filter((value) => value !== null && String(value).trim().length > 0).length;
|
||||
}
|
||||
|
||||
get showLoadingPlaceholder(): boolean {
|
||||
return this.loading && this.players.length === 0;
|
||||
}
|
||||
|
||||
get isUpdatingResults(): boolean {
|
||||
return this.loading && this.players.length > 0;
|
||||
}
|
||||
|
||||
private sortPlayers(players: PlayerSummary[]): PlayerSummary[] {
|
||||
return [...players].sort((a, b) => this.numericStat(b, this.activeSort) - this.numericStat(a, this.activeSort));
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user