client/src/app/shared/shared-forms/select/select-categories.component.ts

   1
   2 import { Component, forwardRef, OnInit } from '@angular/core'
   3 import { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms'
   4 import { ServerService } from '@app/core'
   5 import { SelectOptionsItem } from '../../../../types/select-options-item.model'
   6 import { ItemSelectCheckboxValue } from './select-checkbox.component'
   7
   8 @Component({
   9   selector: 'my-select-categories',
  10   styleUrls: [ './select-shared.component.scss' ],
  11   templateUrl: './select-categories.component.html',
  12   providers: [
  13     {
  14       provide: NG_VALUE_ACCESSOR,
  15       useExisting: forwardRef(() => SelectCategoriesComponent),
  16       multi: true
  17     }
  18   ]
  19 })
  20 export class SelectCategoriesComponent implements ControlValueAccessor, OnInit {
  21   selectedCategories: ItemSelectCheckboxValue[] = []
  22   availableCategories: SelectOptionsItem[] = []
  23
  24   allCategoriesGroup = $localize`All categories`
  25
  26   // Fix a bug on ng-select when we update items after we selected items
  27   private toWrite: any
  28   private loaded = false
  29
  30   constructor (
  31     private server: ServerService
  32   ) {
  33
  34   }
  35
  36   ngOnInit () {
  37     this.server.getVideoCategories()
  38       .subscribe(
  39         categories => {
  40           this.availableCategories = categories.map(c => ({ label: c.label, id: c.id + '', group: this.allCategoriesGroup }))
  41           this.loaded = true
  42           this.writeValue(this.toWrite)
  43         }
  44       )
  45   }
  46
  47   propagateChange = (_: any) => { /* empty */ }
  48
  49   writeValue (categories: string[] | number[]) {
  50     if (!this.loaded) {
  51       this.toWrite = categories
  52       return
  53     }
  54
  55     this.selectedCategories = categories
  56       ? categories.map(c => c + '')
  57       : categories as string[]
  58   }
  59
  60   registerOnChange (fn: (_: any) => void) {
  61     this.propagateChange = fn
  62   }
  63
  64   registerOnTouched () {
  65     // Unused
  66   }
  67
  68   onModelChange () {
  69     this.propagateChange(this.selectedCategories)
  70   }
  71 }