Fix mark all as read notifications

[github/Chocobozzz/PeerTube.git] / client / src / app / shared / forms / peertube-checkbox.component.ts

diff --git a/client/src/app/shared/forms/peertube-checkbox.component.ts b/client/src/app/shared/forms/peertube-checkbox.component.ts
index bbc9904dfe8aa2ace1b58c28c289828a15849dcc..0303b7e2a4c4540b8b1f8326ffefe41931334773 100644 (file)
--- a/client/src/app/shared/forms/peertube-checkbox.component.ts
+++ b/client/src/app/shared/forms/peertube-checkbox.component.ts
@@ -1,5 +1,6 @@
-import { Component, forwardRef, Input } from '@angular/core'
+import { AfterContentInit, ChangeDetectorRef, Component, ContentChildren, forwardRef, Input, QueryList, TemplateRef } from '@angular/core'
 import { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms'
+import { PeerTubeTemplateDirective } from '@app/shared/angular/peertube-template.directive'
 
 @Component({
   selector: 'my-peertube-checkbox',
@@ -13,19 +14,44 @@ import { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms'
     }
   ]
 })
-export class PeertubeCheckboxComponent implements ControlValueAccessor {
+export class PeertubeCheckboxComponent implements ControlValueAccessor, AfterContentInit {
   @Input() checked = false
   @Input() inputName: string
   @Input() labelText: string
-  @Input() labelHtml: string
-  @Input() helpHtml: string
+  @Input() labelInnerHTML: string
+  @Input() helpPlacement = 'top'
+  @Input() disabled = false
 
-  isDisabled = false
+  @ContentChildren(PeerTubeTemplateDirective) templates: QueryList<PeerTubeTemplateDirective<'label' | 'help'>>
+
+  // FIXME: https://github.com/angular/angular/issues/10816#issuecomment-307567836
+  @Input() onPushWorkaround = false
+
+  labelTemplate: TemplateRef<any>
+  helpTemplate: TemplateRef<any>
+
+  constructor (private cdr: ChangeDetectorRef) { }
+
+  ngAfterContentInit () {
+    {
+      const t = this.templates.find(t => t.name === 'label')
+      if (t) this.labelTemplate = t.template
+    }
+
+    {
+      const t = this.templates.find(t => t.name === 'help')
+      if (t) this.helpTemplate = t.template
+    }
+  }
 
   propagateChange = (_: any) => { /* empty */ }
 
   writeValue (checked: boolean) {
     this.checked = checked
+
+    if (this.onPushWorkaround) {
+      this.cdr.markForCheck()
+    }
   }
 
   registerOnChange (fn: (_: any) => void) {
@@ -41,6 +67,6 @@ export class PeertubeCheckboxComponent implements ControlValueAccessor {
   }
 
   setDisabledState (isDisabled: boolean) {
-    this.isDisabled = isDisabled
+    this.disabled = isDisabled
   }
 }