yetangitu/Peertube
1
0
Fork 0
mirror of https://github.com/Chocobozzz/PeerTube.git synced 2025-10-04 10:19:35 +02:00
Code Issues Releases Wiki Activity

Remove ng-select

Browse source 
Component is too complex and causes accessibility issues
This commit is contained in:
Chocobozzz 2024-10-01 15:19:04 +02:00
parent 9fbad291af
commit d54e5178bc
No known key found for this signature in database
GPG key ID: 583A612D890159BE
60 changed files with 850 additions and 852 deletions
Download patch file Download diff file Expand all files Collapse all files

69
client/src/app/shared/shared-forms/select/select-checkbox.component.ts
View file

@ -1,13 +1,11 @@
import { Component, forwardRef, Input, OnInit } from '@angular/core'
import { ControlValueAccessor, NG_VALUE_ACCESSOR, FormsModule } from '@angular/forms'
import { CommonModule } from '@angular/common'
import { booleanAttribute, Component, EventEmitter, forwardRef, Input, numberAttribute, Output } from '@angular/core'
import { ControlValueAccessor, FormsModule, NG_VALUE_ACCESSOR } from '@angular/forms'
import { MultiSelectModule } from 'primeng/multiselect'
import { SelectOptionsItem } from '../../../../types/select-options-item.model'
import { NgSelectModule } from '@ng-select/ng-select'
export type ItemSelectCheckboxValue = { id?: string, group?: string } | string
@Component({
selector: 'my-select-checkbox',
styleUrls: [ './select-shared.component.scss', 'select-checkbox.component.scss' ],
templateUrl: './select-checkbox.component.html',
providers: [
{
@ -17,40 +15,35 @@ export type ItemSelectCheckboxValue = { id?: string, group?: string } | string
}
],
standalone: true,
imports: [ NgSelectModule, FormsModule ]
imports: [ MultiSelectModule, FormsModule, CommonModule ]
})
export class SelectCheckboxComponent implements OnInit, ControlValueAccessor {
@Input({ required: true }) labelForId: string
export class SelectCheckboxComponent implements ControlValueAccessor {
@Input({ required: true }) inputId: string
@Input() availableItems: SelectOptionsItem[] = []
@Input() selectedItems: ItemSelectCheckboxValue[] = []
@Input() selectedItems: string[] = []
@Input() selectableGroup: boolean
@Input() selectableGroupAsModel: boolean
@Input() placeholder: string
disabled = false
@Input() selectionLimit: number
ngOnInit () {
if (!this.placeholder) this.placeholder = $localize`Add a new option`
}
@Input() selectedItemsLabel: string
@Input({ transform: booleanAttribute }) virtualScroll = false
@Input({ transform: numberAttribute }) virtualScrollItemSize = 33
@Input({ transform: booleanAttribute }) showClear: boolean
@Output() panelHide = new EventEmitter()
disabled = false
propagateChange = (_: any) => { /* empty */ }
writeValue (items: ItemSelectCheckboxValue[]) {
if (Array.isArray(items)) {
this.selectedItems = items.map(i => {
if (typeof i === 'string' || typeof i === 'number') {
return i + ''
}
if (i.group) {
return { group: i.group }
}
return { id: i.id + '' }
})
} else {
this.selectedItems = items
}
writeValue (items: string[]) {
this.selectedItems = items
}
registerOnChange (fn: (_: any) => void) {
@ -68,20 +61,4 @@ export class SelectCheckboxComponent implements OnInit, ControlValueAccessor {
setDisabledState (isDisabled: boolean) {
this.disabled = isDisabled
}
compareFn (item: SelectOptionsItem, selected: ItemSelectCheckboxValue) {
if (typeof selected === 'string' || typeof selected === 'number') {
return item.id === selected
}
if (this.selectableGroup && item.group && selected.group) {
return item.group === selected.group
}
if (selected.id && item.id) {
return item.id === selected.id
}
return false
}
}