13465996605

Committed 21 Feb 2025 10:04PM UTC coverage: 85.71% (+1.3%) from 84.386%

Build # 13465996605

Build Type

Pull #1120

github

Committed by

web-flow

Commit Message

Merge 4e531b267 into a73b34bf9

Pull Request Pull Request #1120: Datahub: Add pagination for table component

Run Details

1319 of 1706 branches covered (77.32%)

Branch coverage included in aggregate %.

74 of 85 new or added lines in 9 files covered. (87.06%)

13 existing lines in 3 files now uncovered.

3809 of 4277 relevant lines covered (89.06%)

246.71 hits per line

Source File
Press 'n' to go to next uncovered line, 'b' for previous

82.14

/libs/ui/dataviz/src/lib/table-scroll/table-scroll.component.ts

import { ScrollingModule } from '@angular/cdk/scrolling'
import { NgForOf } from '@angular/common'
import {
  AfterViewInit,
  ChangeDetectionStrategy,
  Component,
  ElementRef,
  EventEmitter,
  Input,
  Output,
  ViewChild,
} from '@angular/core'
import { MatSort, MatSortModule } from '@angular/material/sort'
import { MatTableModule } from '@angular/material/table'
import {
  TableVirtualScrollDataSource,
  TableVirtualScrollModule,
} from 'ng-table-virtual-scroll'
import { TranslateModule } from '@ngx-translate/core'
import { TableItemId, TableItemModel } from '../table/table.component'

const rowIdPrefix = 'table-item-'

/**
 * Note: This component can be used with a dataset instead of a reader.
 * It does not provide pagination and is currenlty on used in the geo-table-view component
 */

@Component({
  standalone: true,
  imports: [
    MatTableModule,
    MatSortModule,
    TableVirtualScrollModule,
    ScrollingModule,
    NgForOf,
    TranslateModule,
  ],
  selector: 'gn-ui-table-scroll',
  templateUrl: './table-scroll.component.html',
  styleUrls: ['./table-scroll.component.css'],
  changeDetection: ChangeDetectionStrategy.OnPush,
})
export class TableScrollComponent implements AfterViewInit {
  @Input() set data(value: TableItemModel[]) {
    this.dataSource = new TableVirtualScrollDataSource(value)
    this.dataSource.sort = this.sort
    this.properties =
      Array.isArray(value) && value.length ? Object.keys(value[0]) : []
    this.count = value.length
  }
  @Input() activeId: TableItemId
  @Output() selected = new EventEmitter<any>()

  @ViewChild(MatSort, { static: true }) sort: MatSort
  properties: string[]
  dataSource: TableVirtualScrollDataSource<any>
  headerHeight: number
  count: number

  constructor(private eltRef: ElementRef) {}

  ngAfterViewInit() {
    this.headerHeight =
      this.eltRef.nativeElement.querySelector('thead').offsetHeight
  }

  scrollToItem(itemId: TableItemId): void {
    const row = this.eltRef.nativeElement.querySelector(
      `#${this.getRowEltId(itemId)}`
    )
    this.eltRef.nativeElement.scrollTop = row.offsetTop - this.headerHeight
  }

  public getRowEltId(id: TableItemId): string {
    return rowIdPrefix + id
  }
}

1	import { ScrollingModule } from '@angular/cdk/scrolling'	1✔
2	import { NgForOf } from '@angular/common'	1✔
3	import {	1✔
4	AfterViewInit,
5	ChangeDetectionStrategy,
6	Component,
7	ElementRef,
8	EventEmitter,
9	Input,
10	Output,
11	ViewChild,
12	} from '@angular/core'
13	import { MatSort, MatSortModule } from '@angular/material/sort'	1✔
14	import { MatTableModule } from '@angular/material/table'	1✔
15	import {	1✔
16	TableVirtualScrollDataSource,
17	TableVirtualScrollModule,
18	} from 'ng-table-virtual-scroll'
19	import { TranslateModule } from '@ngx-translate/core'	1✔
20	import { TableItemId, TableItemModel } from '../table/table.component'	1✔
21
22	const rowIdPrefix = 'table-item-'	1✔
23
24	/**
25	* Note: This component can be used with a dataset instead of a reader.
26	* It does not provide pagination and is currenlty on used in the geo-table-view component
27	*/
28
29	@Component({
30	standalone: true,
31	imports: [
32	MatTableModule,
33	MatSortModule,
34	TableVirtualScrollModule,
35	ScrollingModule,
36	NgForOf,
37	TranslateModule,
38	],
39	selector: 'gn-ui-table-scroll',
40	templateUrl: './table-scroll.component.html',
41	styleUrls: ['./table-scroll.component.css'],
42	changeDetection: ChangeDetectionStrategy.OnPush,
43	})
44	export class TableScrollComponent implements AfterViewInit {	1✔
45	@Input() set data(value: TableItemModel[]) {
46	this.dataSource = new TableVirtualScrollDataSource(value)	7✔
47	this.dataSource.sort = this.sort	7✔
48	this.properties =	7✔
49	Array.isArray(value) && value.length ? Object.keys(value[0]) : []	21!
50	this.count = value.length	7✔
51	}
52	@Input() activeId: TableItemId
53	@Output() selected = new EventEmitter<any>()	5✔
54
55	@ViewChild(MatSort, { static: true }) sort: MatSort
56	properties: string[]
57	dataSource: TableVirtualScrollDataSource<any>
58	headerHeight: number
59	count: number
60
61	constructor(private eltRef: ElementRef) {}	5!
62
63	ngAfterViewInit() {
64	this.headerHeight =	5✔
65	this.eltRef.nativeElement.querySelector('thead').offsetHeight
66	}
67
68	scrollToItem(itemId: TableItemId): void {
NEW 69	const row = this.eltRef.nativeElement.querySelector(	×
70	`#${this.getRowEltId(itemId)}`
71	)
NEW 72	this.eltRef.nativeElement.scrollTop = row.offsetTop - this.headerHeight	×
73	}
74
75	public getRowEltId(id: TableItemId): string {
NEW 76	return rowIdPrefix + id	×
77	}
78	}

geonetwork / geonetwork-ui / 13465996605

Source File Press 'n' to go to next uncovered line, 'b' for previous

Source File
Press 'n' to go to next uncovered line, 'b' for previous