9205123826

Committed 23 May 2024 08:55AM CUT coverage: 88.822%. Remained the same

Build # 9205123826

Build Type

Pull #3800

github

Committed by

web-flow

Commit Message

Merge 5208cd19f into 59c39b170

Pull Request Pull Request #3800: chore(deps): bump zone.js from 0.11.8 to 0.14.6 in /showcase

Run Details

1260 of 1528 branches covered (82.46%)

Branch coverage included in aggregate %.

3770 of 4135 relevant lines covered (91.17%)

193.16 hits per line

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

5.41

/packages/stark-ui/src/modules/progress-indicator/directives/progress-indicator.directive.ts

import {
        ComponentFactoryResolver,
        Directive,
        ElementRef,
        Inject,
        Injector,
        Input,
        OnDestroy,
        OnInit,
        Renderer2,
        ViewContainerRef,
        ViewRef
} from "@angular/core";
import { STARK_PROGRESS_INDICATOR_SERVICE, StarkProgressIndicatorService } from "../services";
import { StarkProgressIndicatorConfig, StarkProgressIndicatorType } from "../entities";
import { Subscription } from "rxjs";
import { StarkProgressIndicatorComponent } from "../components";

/**
 * @ignore
 */
const directiveName = "[starkProgressIndicator]";

/* eslint-disable jsdoc/check-alignment,jsdoc/check-indentation */
/**
 * This directive must be used as attribute on a DOM element and the config provided should be a {@link StarkProgressIndicatorConfig} object:
 *
```html
<some-element [starkProgressIndicator]="{topic: 'some-topic', type: 'SPINNER'}" ></some-element>
<!-- or -->
<some-element [starkProgressIndicator]="progressIndicatorConfig" ></some-element>
```
 *
 * Once the directive is initialized, it registers itself to the {@link StarkProgressIndicatorService} and creates an instance of the {@link StarkProgressIndicatorComponent} which is the one that actually displays the progress indicator (e.g., spinner).
 *
 * From then on you can control the state/visibility of the progress indicator programmatically by using the {@link StarkProgressIndicatorService}:
 *
```typescript
// the service should be injected in your component
@Inject(STARK_PROGRESS_INDICATOR_SERVICE) private progressService: StarkProgressIndicatorService;

// then you can call the method to show the progress indicator
this.progressService.show(this.progressIndicatorConfig.topic);
// or to hide it
this.progressService.hide(this.progressIndicatorConfig.topic);
```
 */
/* eslint-enable jsdoc/check-alignment,jsdoc/check-indentation */
@Directive({
        selector: directiveName
})
export class StarkProgressIndicatorDirective implements OnInit, OnDestroy {
        /**
         * Configuration object for the progress indicator to be shown.
         */
        @Input()
        public starkProgressIndicator!: StarkProgressIndicatorConfig;

        /**
         * The topic that the progress indicator will subscribe to.
         */
        public topic!: string;

        /**
         * Type of progress indicator
         */
        public type!: StarkProgressIndicatorType | string;

        /**
         * @ignore
         */
        private progressSubscription?: Subscription;

        /**
         * @ignore
         */
        private readonly componentViewRef!: ViewRef;

        /**
         * Class constructor
         * @param _progressService - The ProgressIndicator service of the application
         * @param componentFactoryResolver - Resolver that returns Angular component factories
         * @param injector - The application Injector
         * @param _viewContainer - The container where one or more views can be attached to the host element of this directive.
         * @param renderer - Angular `Renderer2` wrapper for DOM manipulations.
         * @param elementRef - Reference to the DOM element where this directive is applied to.
         */
        public constructor(
                @Inject(STARK_PROGRESS_INDICATOR_SERVICE) public _progressService: StarkProgressIndicatorService,
                componentFactoryResolver: ComponentFactoryResolver,
                injector: Injector,
                private _viewContainer: ViewContainerRef,
                protected renderer: Renderer2,
                protected elementRef: ElementRef
        ) {
                const componentFactory = componentFactoryResolver.resolveComponentFactory(StarkProgressIndicatorComponent);
                const componentRef = componentFactory.create(injector);
                this.componentViewRef = componentRef.hostView;
        }

        /**
         * Registers an instance of progress indicator
         * @param progressConfig - `StarkProgressIndicatorConfig` object
         */
        public registerInstance(progressConfig: StarkProgressIndicatorConfig): void {
                this.topic = progressConfig.topic;

                if (typeof StarkProgressIndicatorType[progressConfig.type] !== "undefined") {
                        this.type = StarkProgressIndicatorType[progressConfig.type];
                } else {
                        this.type = StarkProgressIndicatorType.SPINNER;
                }

                this._progressService.register(this.topic, <StarkProgressIndicatorType>this.type);
        }

        /**
         * The directive registers itself to the {@link StarkProgressIndicatorService}.
         * The component to add is then created and inserted inside of the container.
         * Finally, if the host component should be hidden or shown, the "stark-hide" class is removed/added accordingly
         */
        public ngOnInit(): void {
                if (!this.starkProgressIndicator) {
                        throw new Error("StarkProgressIndicatorDirective: a StarkProgressIndicatorConfig is required.");
                }
                this.registerInstance(this.starkProgressIndicator);

                this.progressSubscription = this._progressService.isVisible(this.topic).subscribe((isVisible: boolean = false) => {
                        if (isVisible) {
                                // TODO The element is here added as a child, not as a sibling
                                // this.renderer.appendChild(this.elementRef.nativeElement, componentRef.location.nativeElement);

                                this._viewContainer.insert(this.componentViewRef); // insert the view in the last position
                                this.renderer.addClass(this.elementRef.nativeElement, "stark-hide");
                        } else {
                                const componentViewRefIndex = this._viewContainer.indexOf(this.componentViewRef);
                                if (componentViewRefIndex > -1) {
                                        this._viewContainer.detach(componentViewRefIndex);
                                        this.renderer.removeClass(this.elementRef.nativeElement, "stark-hide");
                                }
                        }
                });
        }

        /**
         * The directive de-registers itself from the {@link StarkProgressIndicatorService} when it is destroyed.
         */
        public ngOnDestroy(): void {
                this.componentViewRef.destroy(); // destroy the progress indicator
                if (this.progressSubscription) {
                        this.progressSubscription.unsubscribe();
                }
                this._progressService.deregister(this.topic);
        }
}

1	import {
2	ComponentFactoryResolver,
3	Directive,
4	ElementRef,
5	Inject,
6	Injector,
7	Input,
8	OnDestroy,
9	OnInit,
10	Renderer2,
11	ViewContainerRef,
12	ViewRef
13	} from "@angular/core";
14	import { STARK_PROGRESS_INDICATOR_SERVICE, StarkProgressIndicatorService } from "../services";
15	import { StarkProgressIndicatorConfig, StarkProgressIndicatorType } from "../entities";
16	import { Subscription } from "rxjs";
17	import { StarkProgressIndicatorComponent } from "../components";
18
19	/**
20	* @ignore
21	*/
22	const directiveName = "[starkProgressIndicator]";	1✔
23
24	/* eslint-disable jsdoc/check-alignment,jsdoc/check-indentation */
25	/**
26	* This directive must be used as attribute on a DOM element and the config provided should be a {@link StarkProgressIndicatorConfig} object:
27	*
28	```html
29	<some-element [starkProgressIndicator]="{topic: 'some-topic', type: 'SPINNER'}" ></some-element>
30	<!-- or -->
31	<some-element [starkProgressIndicator]="progressIndicatorConfig" ></some-element>
32	```
33	*
34	* Once the directive is initialized, it registers itself to the {@link StarkProgressIndicatorService} and creates an instance of the {@link StarkProgressIndicatorComponent} which is the one that actually displays the progress indicator (e.g., spinner).
35	*
36	* From then on you can control the state/visibility of the progress indicator programmatically by using the {@link StarkProgressIndicatorService}:
37	*
38	```typescript
39	// the service should be injected in your component
40	@Inject(STARK_PROGRESS_INDICATOR_SERVICE) private progressService: StarkProgressIndicatorService;
41
42	// then you can call the method to show the progress indicator
43	this.progressService.show(this.progressIndicatorConfig.topic);
44	// or to hide it
45	this.progressService.hide(this.progressIndicatorConfig.topic);
46	```
47	*/
48	/* eslint-enable jsdoc/check-alignment,jsdoc/check-indentation */
49	@Directive({
50	selector: directiveName
51	})
52	export class StarkProgressIndicatorDirective implements OnInit, OnDestroy {	1✔
53	/**
54	* Configuration object for the progress indicator to be shown.
55	*/
56	@Input()
57	public starkProgressIndicator!: StarkProgressIndicatorConfig;
58
59	/**
60	* The topic that the progress indicator will subscribe to.
61	*/
62	public topic!: string;
63
64	/**
65	* Type of progress indicator
66	*/
67	public type!: StarkProgressIndicatorType \| string;
68
69	/**
70	* @ignore
71	*/
72	private progressSubscription?: Subscription;
73
74	/**
75	* @ignore
76	*/
77	private readonly componentViewRef!: ViewRef;
78
79	/**
80	* Class constructor
81	* @param _progressService - The ProgressIndicator service of the application
82	* @param componentFactoryResolver - Resolver that returns Angular component factories
83	* @param injector - The application Injector
84	* @param _viewContainer - The container where one or more views can be attached to the host element of this directive.
85	* @param renderer - Angular `Renderer2` wrapper for DOM manipulations.
86	* @param elementRef - Reference to the DOM element where this directive is applied to.
87	*/
88	public constructor(
89	@Inject(STARK_PROGRESS_INDICATOR_SERVICE) public _progressService: StarkProgressIndicatorService,	×
90	componentFactoryResolver: ComponentFactoryResolver,
91	injector: Injector,
92	private _viewContainer: ViewContainerRef,	×
93	protected renderer: Renderer2,	×
94	protected elementRef: ElementRef	×
95	) {
96	const componentFactory = componentFactoryResolver.resolveComponentFactory(StarkProgressIndicatorComponent);	×
97	const componentRef = componentFactory.create(injector);	×
98	this.componentViewRef = componentRef.hostView;	×
99	}
100
101	/**
102	* Registers an instance of progress indicator
103	* @param progressConfig - `StarkProgressIndicatorConfig` object
104	*/
105	public registerInstance(progressConfig: StarkProgressIndicatorConfig): void {
106	this.topic = progressConfig.topic;	×
107
108	if (typeof StarkProgressIndicatorType[progressConfig.type] !== "undefined") {	×
109	this.type = StarkProgressIndicatorType[progressConfig.type];	×
110	} else {
111	this.type = StarkProgressIndicatorType.SPINNER;	×
112	}
113
114	this._progressService.register(this.topic, <StarkProgressIndicatorType>this.type);	×
115	}
116
117	/**
118	* The directive registers itself to the {@link StarkProgressIndicatorService}.
119	* The component to add is then created and inserted inside of the container.
120	* Finally, if the host component should be hidden or shown, the "stark-hide" class is removed/added accordingly
121	*/
122	public ngOnInit(): void {
123	if (!this.starkProgressIndicator) {	×
124	throw new Error("StarkProgressIndicatorDirective: a StarkProgressIndicatorConfig is required.");	×
125	}
126	this.registerInstance(this.starkProgressIndicator);	×
127
128	this.progressSubscription = this._progressService.isVisible(this.topic).subscribe((isVisible: boolean = false) => {	×
129	if (isVisible) {	×
130	// TODO The element is here added as a child, not as a sibling
131	// this.renderer.appendChild(this.elementRef.nativeElement, componentRef.location.nativeElement);
132
133	this._viewContainer.insert(this.componentViewRef); // insert the view in the last position	×
134	this.renderer.addClass(this.elementRef.nativeElement, "stark-hide");	×
135	} else {
136	const componentViewRefIndex = this._viewContainer.indexOf(this.componentViewRef);	×
137	if (componentViewRefIndex > -1) {	×
138	this._viewContainer.detach(componentViewRefIndex);	×
139	this.renderer.removeClass(this.elementRef.nativeElement, "stark-hide");	×
140	}
141	}
142	});
143	}
144
145	/**
146	* The directive de-registers itself from the {@link StarkProgressIndicatorService} when it is destroyed.
147	*/
148	public ngOnDestroy(): void {
149	this.componentViewRef.destroy(); // destroy the progress indicator	×
150	if (this.progressSubscription) {	×
151	this.progressSubscription.unsubscribe();	×
152	}
153	this._progressService.deregister(this.topic);	×
154	}
155	}

NationalBankBelgium / stark / 9205123826

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