11import 'altcha' ;
22
33import {
4+ AsyncPipe ,
45 Location ,
56 NgClass ,
67} from '@angular/common' ;
78import {
89 Component ,
910 EventEmitter ,
1011 Input ,
12+ OnDestroy ,
1113 OnInit ,
1214 Output ,
1315} from '@angular/core' ;
1416import { FormsModule } from '@angular/forms' ;
1517import { NgbDropdownModule } from '@ng-bootstrap/ng-bootstrap' ;
1618import { TranslateModule } from '@ngx-translate/core' ;
19+ import {
20+ Observable ,
21+ Subject ,
22+ } from 'rxjs' ;
23+ import { takeUntil } from 'rxjs/operators' ;
1724
1825import { BtnDisabledDirective } from '../../shared/btn-disabled.directive' ;
1926import { hasValue } from '../../shared/empty.util' ;
@@ -24,16 +31,20 @@ import { RequestCopyEmail } from './request-copy-email.model';
2431 styleUrls : [ './email-request-copy.component.scss' ] ,
2532 templateUrl : './email-request-copy.component.html' ,
2633 standalone : true ,
27- imports : [ FormsModule , NgClass , TranslateModule , BtnDisabledDirective , NgbDropdownModule ] ,
34+ imports : [ FormsModule , NgClass , TranslateModule , BtnDisabledDirective , NgbDropdownModule , AsyncPipe ] ,
2835} )
2936/**
3037 * A form component for an email to send back to the user requesting an item
3138 */
32- export class EmailRequestCopyComponent implements OnInit {
39+ export class EmailRequestCopyComponent implements OnInit , OnDestroy {
3340 /**
3441 * Event emitter for sending the email
3542 */
3643 @Output ( ) send : EventEmitter < RequestCopyEmail > = new EventEmitter < RequestCopyEmail > ( ) ;
44+
45+ /**
46+ * Selected access period emmitter, sending the new period up to the parent component
47+ */
3748 @Output ( ) selectedAccessPeriod : EventEmitter < string > = new EventEmitter ( ) ;
3849
3950 /**
@@ -49,24 +60,45 @@ export class EmailRequestCopyComponent implements OnInit {
4960 /**
5061 * A list of valid access periods to render in a drop-down menu
5162 */
52- @Input ( ) validAccessPeriods : string [ ] = [ ] ;
63+ @Input ( ) validAccessPeriods$ : Observable < string [ ] > ;
5364
5465 /**
5566 * The selected access period, e.g. +7DAYS, +12MONTHS, FOREVER. These will be
5667 * calculated as a timestamp to store as the access expiry date for the requested item
5768 */
5869 accessPeriod = 'FOREVER' ;
5970
71+ /**
72+ * Destroy subject for unsubscribing from observables
73+ * @private
74+ */
75+ private destroy$ = new Subject < void > ( ) ;
76+
6077 protected readonly hasValue = hasValue ;
6178
6279 constructor ( protected location : Location ) {
6380 }
6481
82+ /**
83+ * Initialise subscription to async valid access periods (from configuration service)
84+ */
6585 ngOnInit ( ) : void {
66- // If access periods are present, set the default to the first in the array
67- if ( hasValue ( this . validAccessPeriods ) && this . validAccessPeriods . length > 0 ) {
68- this . selectAccessPeriod ( this . validAccessPeriods [ 0 ] ) ;
69- }
86+ this . validAccessPeriods$ . pipe (
87+ takeUntil ( this . destroy$ ) ,
88+ ) . subscribe ( ( validAccessPeriods ) => {
89+ if ( hasValue ( validAccessPeriods ) && validAccessPeriods . length > 0 ) {
90+ this . selectAccessPeriod ( validAccessPeriods [ 0 ] ) ;
91+ }
92+ } ) ;
93+ }
94+
95+ /**
96+ * Clean up subscriptions and selectors
97+ */
98+ ngOnDestroy ( ) : void {
99+ this . selectedAccessPeriod . complete ( ) ;
100+ this . destroy$ . next ( ) ;
101+ this . destroy$ . complete ( ) ;
70102 }
71103
72104 /**
0 commit comments