Moved the context @Input() to the loaders (since they are not always required for all the loaders) & added AbstractComponentLoaderComponent documentation

This commit is contained in:
Alexandre Vryghem
2024-02-02 09:35:27 +01:00
parent 7942c900f4
commit 239f082cce
5 changed files with 44 additions and 25 deletions

View File

@@ -4,6 +4,7 @@ import { GenericConstructor } from '../../core/shared/generic-constructor';
import { AbstractComponentLoaderComponent } from '../../shared/abstract-component-loader/abstract-component-loader.component'; import { AbstractComponentLoaderComponent } from '../../shared/abstract-component-loader/abstract-component-loader.component';
import { AbstractBrowseByTypeComponent } from '../abstract-browse-by-type.component'; import { AbstractBrowseByTypeComponent } from '../abstract-browse-by-type.component';
import { BrowseByDataType } from './browse-by-data-type'; import { BrowseByDataType } from './browse-by-data-type';
import { Context } from '../../core/shared/context.model';
@Component({ @Component({
selector: 'ds-browse-by-switcher', selector: 'ds-browse-by-switcher',
@@ -11,15 +12,17 @@ import { BrowseByDataType } from './browse-by-data-type';
}) })
export class BrowseBySwitcherComponent extends AbstractComponentLoaderComponent<AbstractBrowseByTypeComponent> { export class BrowseBySwitcherComponent extends AbstractComponentLoaderComponent<AbstractBrowseByTypeComponent> {
@Input() context: Context;
@Input() browseByType: BrowseByDataType; @Input() browseByType: BrowseByDataType;
protected inputNamesDependentForComponent: (keyof this & string)[] = [ protected inputNamesDependentForComponent: (keyof this & string)[] = [
...this.inputNamesDependentForComponent, 'context',
'browseByType', 'browseByType',
]; ];
protected inputNames: (keyof this & string)[] = [ protected inputNames: (keyof this & string)[] = [
...this.inputNames, 'context',
'browseByType', 'browseByType',
]; ];

View File

@@ -1,22 +1,27 @@
import { Component, ComponentRef, Input, OnChanges, OnDestroy, OnInit, SimpleChanges, ViewChild, ViewContainerRef } from '@angular/core'; import { Component, ComponentRef, OnChanges, OnDestroy, OnInit, SimpleChanges, ViewChild, ViewContainerRef } from '@angular/core';
import { Context } from '../../core/shared/context.model';
import { ThemeService } from '../theme-support/theme.service'; import { ThemeService } from '../theme-support/theme.service';
import { GenericConstructor } from '../../core/shared/generic-constructor'; import { GenericConstructor } from '../../core/shared/generic-constructor';
import { hasValue, isNotEmpty } from '../empty.util'; import { hasValue, isNotEmpty } from '../empty.util';
import { Subscription } from 'rxjs'; import { Subscription } from 'rxjs';
import { DynamicComponentLoaderDirective } from './dynamic-component-loader.directive'; import { DynamicComponentLoaderDirective } from './dynamic-component-loader.directive';
/**
* To create a new loader component you will need to:
* <ul>
* <li>Create a new LoaderComponent component extending this component</li>
* <li>Point the templateUrl to this component's templateUrl</li>
* <li>Add all the @Input()/@Output() names that the dynamically generated components should inherit from the loader to the inputNames/outputNames lists</li>
* <li>Create a decorator file containing the new decorator function, a map containing all the collected {@link Component}s and a function to retrieve the {@link Component}</li>
* <li>Call the function to retrieve the correct {@link Component} in getComponent()</li>
* <li>Add all the @Input()s you had to used in getComponent() in the inputNamesDependentForComponent array</li>
* </ul>
*/
@Component({ @Component({
selector: 'ds-abstract-component-loader', selector: 'ds-abstract-component-loader',
templateUrl: './abstract-component-loader.component.html', templateUrl: './abstract-component-loader.component.html',
}) })
export abstract class AbstractComponentLoaderComponent<T> implements OnInit, OnChanges, OnDestroy { export abstract class AbstractComponentLoaderComponent<T> implements OnInit, OnChanges, OnDestroy {
/**
* The optional context
*/
@Input() context: Context;
/** /**
* Directive to determine where the dynamic child component is located * Directive to determine where the dynamic child component is located
*/ */
@@ -33,20 +38,21 @@ export abstract class AbstractComponentLoaderComponent<T> implements OnInit, OnC
protected subs: Subscription[] = []; protected subs: Subscription[] = [];
/** /**
* The @{@link Input}() that are used to find the matching component using {@link getComponent}. When the value of * The @Input() that are used to find the matching component using {@link getComponent}. When the value of
* one of these @{@link Input}() change this loader needs to retrieve the best matching component again using the * one of these @Input() change this loader needs to retrieve the best matching component again using the
* {@link getComponent} method. * {@link getComponent} method.
*/ */
protected inputNamesDependentForComponent: (keyof this & string)[] = [ protected inputNamesDependentForComponent: (keyof this & string)[] = [];
'context',
];
protected inputNames: (keyof this & string)[] = [ /**
'context', * The list of the @Input() names that should be passed down to the dynamically created components.
]; */
protected inputNames: (keyof this & string)[] = [];
protected outputNames: (keyof this & string)[] = [ /**
]; * The list of the @Output() names that should be passed down to the dynamically created components.
*/
protected outputNames: (keyof this & string)[] = [];
constructor( constructor(
protected themeService: ThemeService, protected themeService: ThemeService,

View File

@@ -19,13 +19,20 @@ import { AbstractComponentLoaderComponent } from '../abstract-component-loader/a
*/ */
export class MetadataRepresentationLoaderComponent extends AbstractComponentLoaderComponent<MetadataRepresentationListElementComponent> { export class MetadataRepresentationLoaderComponent extends AbstractComponentLoaderComponent<MetadataRepresentationListElementComponent> {
@Input() context: Context;
/** /**
* The item or metadata to determine the component for * The item or metadata to determine the component for
*/ */
@Input() mdRepresentation: MetadataRepresentation; @Input() mdRepresentation: MetadataRepresentation;
protected inputNamesDependentForComponent: (keyof this & string)[] = [
'context',
'mdRepresentation',
];
protected inputNames: (keyof this & string)[] = [ protected inputNames: (keyof this & string)[] = [
...this.inputNames, 'context',
'mdRepresentation', 'mdRepresentation',
]; ];

View File

@@ -47,7 +47,6 @@ export class ClaimedTaskActionsLoaderComponent extends AbstractComponentLoaderCo
* The list of input and output names for the dynamic component * The list of input and output names for the dynamic component
*/ */
protected inputNames: (keyof this & string)[] = [ protected inputNames: (keyof this & string)[] = [
...this.inputNames,
'item', 'item',
'object', 'object',
'option', 'option',
@@ -55,7 +54,6 @@ export class ClaimedTaskActionsLoaderComponent extends AbstractComponentLoaderCo
]; ];
protected outputNames: (keyof this & string)[] = [ protected outputNames: (keyof this & string)[] = [
...this.outputNames,
'processCompleted', 'processCompleted',
]; ];

View File

@@ -58,7 +58,7 @@ export class ListableObjectComponentLoaderComponent extends AbstractComponentLoa
/** /**
* Whether to show the thumbnail preview * Whether to show the thumbnail preview
*/ */
@Input() showThumbnails; @Input() showThumbnails: boolean;
/** /**
* The value to display for this element * The value to display for this element
@@ -70,13 +70,19 @@ export class ListableObjectComponentLoaderComponent extends AbstractComponentLoa
*/ */
@Output() contentChange = new EventEmitter<ListableObject>(); @Output() contentChange = new EventEmitter<ListableObject>();
protected inputNamesDependentForComponent: (keyof this & string)[] = [
'object',
'viewMode',
'context',
];
/** /**
* The list of input and output names for the dynamic component * The list of input and output names for the dynamic component
*/ */
protected inputNames: (keyof this & string)[] = [ protected inputNames: (keyof this & string)[] = [
...this.inputNames,
'object', 'object',
'index', 'index',
'context',
'linkType', 'linkType',
'listID', 'listID',
'showLabel', 'showLabel',
@@ -86,7 +92,6 @@ export class ListableObjectComponentLoaderComponent extends AbstractComponentLoa
]; ];
protected outputNames: (keyof this & string)[] = [ protected outputNames: (keyof this & string)[] = [
...this.outputNames,
'contentChange', 'contentChange',
]; ];