ngx-edu-sharing-ui 0.7.0 → 9.0.1

package/src/lib/edu-sharing-ui-configuration.ts

@@ -1,47 +0,0 @@
-import { Injectable, InjectionToken, Provider } from '@angular/core';
-import { Observable } from 'rxjs';
-import { AccessibilitySettings } from './types/accessibillity';
-import { KeyboardShortcut } from './types/keyboard-shortcuts';
-
-export const EDU_SHARING_UI_CONFIG = new InjectionToken<EduSharingUiConfigurationParams>(
-    'EDU_SHARING_API_CONFIG',
-);
-
-@Injectable({
-    providedIn: 'root',
-})
-export class EduSharingUiConfiguration {
-    production: boolean;
-    static create(params: EduSharingUiConfigurationParams = {}): EduSharingUiConfiguration {
-        return { ...new EduSharingUiConfiguration(), ...params };
-    }
-}
-
-export type EduSharingUiConfigurationParams = Partial<EduSharingUiConfiguration>;
-
-export function getConfigProvider(params?: EduSharingUiConfigurationParams): Provider[] {
-    return [
-        // Provide the params given to `forRoot()`. These can be overridden by the application by
-        // providing `EDU_SHARING_API_CONFIG` itself.
-        {
-            provide: EDU_SHARING_UI_CONFIG,
-            useValue: params,
-        },
-        // Inject `configuration` as both, `ApiConfiguration` and `EduSharingApiConfiguration`, to pass
-        // `rootUrl` on to `ApiModule` while also adding our custom configuration.
-        {
-            provide: EduSharingUiConfiguration,
-            deps: [EDU_SHARING_UI_CONFIG],
-            // deps: [[new Optional(), EDU_SHARING_API_CONFIG]],
-            useFactory: (configParams: EduSharingUiConfigurationParams) =>
-                EduSharingUiConfiguration.create(configParams),
-        },
-        {
-            provide: EduSharingUiConfiguration,
-            deps: [EDU_SHARING_UI_CONFIG],
-            // deps: [[new Optional(), EDU_SHARING_API_CONFIG]],
-            useFactory: (configParams: EduSharingUiConfigurationParams) =>
-                EduSharingUiConfiguration.create(configParams),
-        },
-    ];
-}

package/src/lib/edu-sharing-ui.module.ts

@@ -1,49 +0,0 @@
-import { ModuleWithProviders, NgModule } from '@angular/core';
-import { MatTooltipModule } from '@angular/material/tooltip';
-import { TranslateModule } from '@ngx-translate/core';
-import { CommonModule } from '@angular/common';
-import { EduSharingUiConfigurationParams, getConfigProvider } from './edu-sharing-ui-configuration';
-import { ListItemsModule } from './list-items/list-items.module';
-import { NodeEntriesModule } from './node-entries/node-entries.module';
-import { EduSharingUiCommonModule } from './common/edu-sharing-ui-common.module';
-import { NodeImageSizePipe } from './pipes/node-image-size.pipe';
-import { FormatDatePipe } from './pipes/format-date.pipe';
-import { ListItemLabelPipe } from './node-entries/list-item-label.pipe';
-import { SortDropdownComponent } from './sort-dropdown/sort-dropdown.component';
-
-@NgModule({
-    declarations: [],
-    imports: [
-        CommonModule,
-        TranslateModule,
-        EduSharingUiCommonModule,
-        ListItemsModule,
-        NodeEntriesModule,
-        // Loading the TranslationsModule here causes errors for lazy-loaded pages like the search
-        // page. For usage outside the context of edu-sharing, we probably need to import the
-        // TranslationsModule at the main module that packages or uses this library.
-    ],
-    exports: [
-        CommonModule,
-        MatTooltipModule,
-        TranslateModule,
-        EduSharingUiCommonModule,
-        ListItemsModule,
-        NodeEntriesModule,
-        NodeImageSizePipe,
-        FormatDatePipe,
-        ListItemsModule,
-        ListItemLabelPipe,
-        SortDropdownComponent,
-    ],
-})
-export class EduSharingUiModule {
-    public static forRoot(
-        config: EduSharingUiConfigurationParams,
-    ): ModuleWithProviders<EduSharingUiModule> {
-        return {
-            ngModule: EduSharingUiModule,
-            providers: [getConfigProvider(config)],
-        };
-    }
-}

package/src/lib/list-items/available-widgets.ts

@@ -1,30 +0,0 @@
-import { ListCollectionInfoComponent } from './list-collection-info/list-collection-info.component';
-import { ListCountsComponent } from './list-counts/list-counts.component';
-import { ListNodeLicenseComponent } from './list-node-license/list-node-license.component';
-import { ListNodeReplicationSourceComponent } from './list-node-replication-source/list-node-replication-source.component';
-import { ListNodeWorkflowComponent } from './list-node-workflow/list-node-workflow.component';
-import { ListTextComponent } from './list-text/list-text.component';
-import { ListWidgetClass } from './list-widget';
-
-export enum ListWidgetType {
-    CollectionInfo = 'CollectionInfo',
-    Text = 'Text',
-    Custom = 'Custom',
-    NodeLicense = 'NodeLicense',
-    NodeReplicationSource = 'NodeReplicationSource',
-    NodeWorkflow = 'NodeWorkflow',
-    NodeCounts = 'NodeCounts',
-}
-export const AVAILABLE_LIST_WIDGETS: {
-    [widgetType in ListWidgetType]: ListWidgetClass;
-} = {
-    CollectionInfo: ListCollectionInfoComponent,
-    NodeLicense: ListNodeLicenseComponent,
-    NodeReplicationSource: ListNodeReplicationSourceComponent,
-    NodeWorkflow: ListNodeWorkflowComponent,
-    NodeCounts: ListCountsComponent,
-    Custom: null,
-
-    // use the widgets with wildcards as last ones
-    Text: ListTextComponent,
-};

package/src/lib/list-items/format-duration.pipe.ts

@@ -1,17 +0,0 @@
-import { Pipe, PipeTransform } from '@angular/core';
-import { DurationFormat } from '../util/duration-helper';
-import { DurationHelper } from '../util/duration-helper';
-
-@Pipe({
-    name: 'formatDuration',
-})
-export class FormatDurationPipe implements PipeTransform {
-    transform(
-        value: string,
-        args = {
-            format: DurationFormat.Hms,
-        },
-    ): string {
-        return DurationHelper.getDurationFormatted(value, args.format);
-    }
-}

package/src/lib/list-items/list-base/list-base.component.html

@@ -1,52 +0,0 @@
-<ng-container [ngSwitch]="widgetType">
-  <ng-container *ngSwitchCase="'Custom'">
-    <ng-container
-      *ngTemplateOutlet="
-        customTemplate;
-        context: {
-          item: this.item,
-          node: this.node,
-          provideLabel: this.provideLabel,
-          forceText: this.forceText
-        }
-      "
-    >
-    </ng-container>
-  </ng-container>
-  <es-list-collection-info
-    *ngSwitchCase="'CollectionInfo'"
-    [item]="item"
-    [node]="node"
-    [provideLabel]="provideLabel"
-  ></es-list-collection-info>
-  <es-list-text
-    *ngSwitchCase="'Text'"
-    [item]="item"
-    [node]="node"
-    [provideLabel]="provideLabel"
-  ></es-list-text>
-  <es-list-counts
-    *ngSwitchCase="'NodeCounts'"
-    [item]="item"
-    [node]="node"
-    [provideLabel]="provideLabel"
-  ></es-list-counts>
-  <es-list-node-license
-    *ngSwitchCase="'NodeLicense'"
-    [item]="item"
-    [node]="node"
-    [provideLabel]="provideLabel"
-  ></es-list-node-license>
-  <es-list-node-replication-source
-    *ngSwitchCase="'NodeReplicationSource'"
-    [item]="item"
-    [node]="node"
-    [provideLabel]="provideLabel"
-  ></es-list-node-replication-source>
-  <es-list-node-workflow
-    *ngSwitchCase="'NodeWorkflow'"
-    [item]="item"
-    [node]="node"
-    [provideLabel]="provideLabel"
-  ></es-list-node-workflow>
-</ng-container>

package/src/lib/list-items/list-base/list-base.component.ts

@@ -1,44 +0,0 @@
-import { Component, Input, OnChanges, SimpleChanges, TemplateRef } from '@angular/core';
-import { AVAILABLE_LIST_WIDGETS, ListWidgetType } from '../available-widgets';
-import { ListWidget } from '../list-widget';
-import { NodeEntriesGlobalService } from '../../node-entries/node-entries-global.service';
-import { Node } from 'ngx-edu-sharing-api';
-
-@Component({
-    selector: 'es-list-base',
-    templateUrl: './list-base.component.html',
-})
-export class ListBaseComponent extends ListWidget implements OnChanges {
-    /**
-     * use text only widgets (for table)
-     */
-    @Input() forceText = false;
-    widgetType: ListWidgetType;
-    customTemplate: TemplateRef<unknown>;
-    constructor(private nodeEntriesGlobalService: NodeEntriesGlobalService) {
-        super();
-    }
-
-    ngOnChanges(changes: SimpleChanges): void {
-        if (this.node && this.item) {
-            this.customTemplate = this.nodeEntriesGlobalService.getCustomFieldTemplate(
-                this.item,
-                this.node as Node,
-            );
-            if (this.customTemplate) {
-                this.widgetType = ListWidgetType.Custom;
-            } else if (this.forceText) {
-                this.widgetType = ListWidgetType.Text;
-            } else {
-                this.widgetType = Object.entries(AVAILABLE_LIST_WIDGETS).find(
-                    ([id, w]) =>
-                        w?.supportedItems?.filter(
-                            (i) =>
-                                i.type === this.item.type &&
-                                (i.name === this.item.name || i.name === '*'),
-                        ).length > 0,
-                )?.[0] as ListWidgetType;
-            }
-        }
-    }
-}

package/src/lib/list-items/list-collection-info/list-collection-info.component.html

@@ -1,48 +0,0 @@
-<ng-container [ngSwitch]="item.name">
-  <ng-container *ngSwitchCase="'info'">
-    <ng-container *ngIf="indicatorIcons$ | async; else textRepresentation">
-      <i
-        esIcon="layers"
-        [altText]="'COLLECTION.INFO_REFERENCES_MULTI' | translate"
-        [matTooltip]="'COLLECTION.INFO_REFERENCES_MULTI' | translate"
-      ></i>
-      {{ $any(node).collection?.childCollectionsCount }}
-      <i
-        esIcon="insert_drive_file"
-        [altText]="'collections_content' | translate"
-        [matTooltip]="'collections_content' | translate"
-      ></i>
-      {{ $any(node).collection?.childReferencesCount }}
-    </ng-container>
-    <ng-template #textRepresentation>
-      <div class="rows">
-        <p>
-          {{ 'COLLECTION.INFO_REFERENCES_MULTI' | translate }}:
-          {{ $any(node).collection?.childCollectionsCount }}
-        </p>
-        <p>
-          {{ 'collections_content' | translate }}:
-          {{ $any(node).collection?.childReferencesCount }}
-        </p>
-      </div>
-    </ng-template>
-  </ng-container>
-  <ng-container *ngSwitchCase="'scope'">
-    <i
-      *ngIf="indicatorIcons$ | async; else textRepresentation"
-      class="collectionScope"
-      [esIcon]="nodeHelper.getCollectionScopeInfo($any(node)).icon"
-      [matTooltip]="
-        'COLLECTION.SCOPE.' + nodeHelper.getCollectionScopeInfo($any(node)).scopeName | translate
-      "
-      [altText]="
-        'COLLECTION.SCOPE.' + nodeHelper.getCollectionScopeInfo($any(node)).scopeName | translate
-      "
-    ></i>
-    <ng-template #textRepresentation>
-      {{
-        'COLLECTION.SCOPE.' + nodeHelper.getCollectionScopeInfo($any(node)).scopeName | translate
-      }}
-    </ng-template>
-  </ng-container>
-</ng-container>

package/src/lib/list-items/list-collection-info/list-collection-info.component.scss

@@ -1,8 +0,0 @@
-.rows {
-    display: flex;
-    flex-direction: column;
-    text-align: start;
-    p {
-        margin: 0;
-    }
-}

package/src/lib/list-items/list-collection-info/list-collection-info.component.ts

@@ -1,24 +0,0 @@
-import { Component } from '@angular/core';
-import { ListItem } from '../../types/list-item';
-import { ListWidget } from '../list-widget';
-import { NodeHelperService } from '../../services/node-helper.service';
-import { AccessibilityService } from '../../services/accessibility.service';
-
-@Component({
-    selector: 'es-list-collection-info',
-    templateUrl: './list-collection-info.component.html',
-    styleUrls: ['./list-collection-info.component.scss'],
-})
-export class ListCollectionInfoComponent extends ListWidget {
-    static supportedItems = [
-        new ListItem('COLLECTION', 'info'),
-        new ListItem('COLLECTION', 'scope'),
-    ];
-
-    readonly indicatorIcons$;
-
-    constructor(private accessibility: AccessibilityService, public nodeHelper: NodeHelperService) {
-        super();
-        this.indicatorIcons$ = this.accessibility.observe('indicatorIcons');
-    }
-}

package/src/lib/list-items/list-counts/list-counts.component.html

@@ -1 +0,0 @@
-{{ getCount() }}

package/src/lib/list-items/list-counts/list-counts.component.scss

@@ -1,3 +0,0 @@
-:host {
-    white-space: pre-line;
-}

package/src/lib/list-items/list-counts/list-counts.component.ts

@@ -1,59 +0,0 @@
-import { Component } from '@angular/core';
-import { ListWidget } from '../list-widget';
-import { ListItem } from '../../types/list-item';
-import { StatisticsGroup } from 'ngx-edu-sharing-api';
-
-@Component({
-    selector: 'es-list-counts',
-    templateUrl: './list-counts.component.html',
-    styleUrls: ['./list-counts.component.scss'],
-})
-export class ListCountsComponent extends ListWidget {
-    static supportedItems = [
-        new ListItem('NODE', 'counts.OVERALL'),
-        new ListItem('NODE', 'counts.VIEW_MATERIAL'),
-        new ListItem('NODE', 'counts.VIEW_MATERIAL_EMBEDDED'),
-        new ListItem('NODE', 'counts.VIEW_MATERIAL_PLAY_MEDIA'),
-        new ListItem('NODE', 'counts.DOWNLOAD_MATERIAL'),
-    ];
-
-    static getCountSingle(node: StatisticsGroup, id: string, group: number = null) {
-        const counts = (node as any).counts;
-        if (id === 'OVERALL') {
-            return Object.keys(counts.counts)
-                .map((c) => (group ? group : counts.counts[c]))
-                .reduce((a, b) => a + b);
-        }
-        return (group ? group : counts.counts[id]) || 0;
-    }
-    static getCount(node: StatisticsGroup, id: string) {
-        const counts = (node as any).counts;
-        let result = this.getCountSingle(node, id);
-        if (Object.keys(counts.groups)?.length > 0) {
-            const i1 = id;
-            if (counts.groups[i1]) {
-                const i2 = Object.keys(counts.groups[i1])[0];
-                if (counts.groups?.[i1]?.[i2]) {
-                    result = Object.keys(counts.groups?.[i1]?.[i2])
-                        .map(
-                            (group) =>
-                                (group || '-') +
-                                ': ' +
-                                this.getCountSingle(node, id, counts.groups?.[i1]?.[i2][group]),
-                        )
-                        .join('\n')
-                        .trim();
-                }
-            }
-        }
-        return result;
-    }
-
-    getId() {
-        return this.item.name.split('.')[1];
-    }
-
-    getCount() {
-        return ListCountsComponent.getCount(this.node as StatisticsGroup, this.getId());
-    }
-}

package/src/lib/list-items/list-items.module.ts

@@ -1,33 +0,0 @@
-import { NgModule } from '@angular/core';
-import { FormatDurationPipe } from './format-duration.pipe';
-import { ListBaseComponent } from './list-base/list-base.component';
-import { ListCollectionInfoComponent } from './list-collection-info/list-collection-info.component';
-import { ListCountsComponent } from './list-counts/list-counts.component';
-import { ListNodeLicenseComponent } from './list-node-license/list-node-license.component';
-import { ListNodeReplicationSourceComponent } from './list-node-replication-source/list-node-replication-source.component';
-import { ListNodeWorkflowComponent } from './list-node-workflow/list-node-workflow.component';
-import { ListTextComponent } from './list-text/list-text.component';
-import { NodeRowComponent } from './node-row/node-row.component';
-import { NodeSourcePipe } from './node-source.pipe';
-import { CommonModule } from '@angular/common';
-import { EduSharingUiCommonModule } from '../common/edu-sharing-ui-common.module';
-import { MatTooltipModule } from '@angular/material/tooltip';
-import { TranslateModule } from '@ngx-translate/core';
-
-@NgModule({
-    declarations: [
-        ListBaseComponent,
-        ListCollectionInfoComponent,
-        ListNodeLicenseComponent,
-        ListNodeReplicationSourceComponent,
-        ListNodeWorkflowComponent,
-        ListTextComponent,
-        ListCountsComponent,
-        NodeSourcePipe,
-        FormatDurationPipe,
-        NodeRowComponent,
-    ],
-    imports: [CommonModule, EduSharingUiCommonModule, MatTooltipModule, TranslateModule],
-    exports: [ListBaseComponent, ListTextComponent, FormatDurationPipe, NodeRowComponent],
-})
-export class ListItemsModule {}

package/src/lib/list-items/list-node-license/list-node-license.component.html

@@ -1,8 +0,0 @@
-<ng-container *ngIf="licenseIcon$ | async as licenseIcon">
-  <span *ngIf="indicatorIcons$ | async; else textRepresentation" [matTooltip]="tooltip$ | async"
-    ><img [alt]="tooltip$ | async" [src]="licenseIcon"
-  /></span>
-  <ng-template #textRepresentation>
-    <span>{{ tooltip$ | async }}</span>
-  </ng-template>
-</ng-container>

package/src/lib/list-items/list-node-license/list-node-license.component.ts

@@ -1,47 +0,0 @@
-import { Component } from '@angular/core';
-import { ListWidget } from '../list-widget';
-import { TranslateService } from '@ngx-translate/core';
-import * as rxjs from 'rxjs';
-import { map, switchMap } from 'rxjs/operators';
-import { ListItem } from '../../types/list-item';
-import { NodeHelperService } from '../../services/node-helper.service';
-import { Node, RestConstants } from 'ngx-edu-sharing-api';
-import { AccessibilityService } from '../../services/accessibility.service';
-
-@Component({
-    selector: 'es-list-node-license',
-    templateUrl: './list-node-license.component.html',
-})
-export class ListNodeLicenseComponent extends ListWidget {
-    static supportedItems = [new ListItem('NODE', RestConstants.CCM_PROP_LICENSE)];
-
-    readonly licenseName$ = this.nodeSubject.pipe(
-        map((node) => this.nodeHelper.getLicenseName(node as Node)),
-    );
-
-    readonly licenseIcon$ = this.nodeSubject.pipe(
-        switchMap((node) => this.nodeHelper.getLicenseIcon(node as Node)),
-    );
-
-    readonly tooltip$ = rxjs.combineLatest([this.licenseName$, this.provideLabelSubject]).pipe(
-        switchMap(([licenseName, provideLabel]) => {
-            if (provideLabel) {
-                return this.translate
-                    .get('NODE.ccm:commonlicense_key')
-                    .pipe(map((commonLicenseKey) => `${commonLicenseKey}: ${licenseName}`));
-            } else {
-                return rxjs.of(licenseName);
-            }
-        }),
-    );
-
-    readonly indicatorIcons$ = this.accessibility.observe('indicatorIcons');
-
-    constructor(
-        private accessibility: AccessibilityService,
-        private nodeHelper: NodeHelperService,
-        private translate: TranslateService,
-    ) {
-        super();
-    }
-}

package/src/lib/list-items/list-node-replication-source/list-node-replication-source.component.html

@@ -1,11 +0,0 @@
-<span *ngIf="indicatorIcons$ | async; else textRepresentation" [matTooltip]="tooltip$ | async">
-  <img
-    [src]="replicationSource$ | async | appNodeSource : { mode: 'url' }"
-    (error)="$any($event.target).style.display = 'none'"
-    [alt]="tooltip$ | async"
-  />
-</span>
-
-<ng-template #textRepresentation>
-  <span>{{ tooltip$ | async }}</span>
-</ng-template>

package/src/lib/list-items/list-node-replication-source/list-node-replication-source.component.ts

@@ -1,60 +0,0 @@
-import { Component } from '@angular/core';
-import { TranslateService } from '@ngx-translate/core';
-import * as rxjs from 'rxjs';
-import { map, switchMap } from 'rxjs/operators';
-import { ListWidget } from '../list-widget';
-import { NodeSourcePipe } from '../node-source.pipe';
-import { AccessibilityService } from '../../services/accessibility.service';
-import { NetworkService, Node, RestConstants } from 'ngx-edu-sharing-api';
-import { ListItem } from '../../types/list-item';
-
-@Component({
-    selector: 'es-list-node-replication-source',
-    templateUrl: './list-node-replication-source.component.html',
-    providers: [NodeSourcePipe],
-})
-export class ListNodeReplicationSourceComponent extends ListWidget {
-    static supportedItems = [new ListItem('NODE', RestConstants.CCM_PROP_REPLICATIONSOURCE)];
-
-    readonly replicationSource$ = this.nodeSubject.pipe(
-        map((node) => (node as Node).properties['ccm:replicationsource']?.[0]),
-    );
-
-    readonly text$ = this.replicationSource$.pipe(
-        // Wait for repositories to be available to `restNetwork` since `nodeSource.transform` fails
-        // if it isn't.
-        switchMap((replicationSource) =>
-            this.networkService.getRepositories().pipe(map(() => replicationSource)),
-        ),
-        switchMap((replicationSource) =>
-            this.translate.get(
-                'REPOSITORIES.' + this.nodeSource.transform(replicationSource, { mode: 'escaped' }),
-                { fallback: this.nodeSource.transform(replicationSource, { mode: 'text' }) },
-            ),
-        ),
-    );
-
-    readonly tooltip$ = rxjs.combineLatest([this.text$, this.provideLabelSubject]).pipe(
-        switchMap(([text, provideLabel]) => {
-            if (provideLabel) {
-                return this.translate
-                    .get('NODE.ccm:replicationsource')
-                    .pipe(map((replicationSource) => `${replicationSource}: ${text}`));
-            } else {
-                return rxjs.of(text);
-            }
-        }),
-    );
-
-    readonly indicatorIcons$ = this.accessibility.observe('indicatorIcons');
-
-    constructor(
-        private accessibility: AccessibilityService,
-
-        private nodeSource: NodeSourcePipe,
-        private translate: TranslateService,
-        private networkService: NetworkService,
-    ) {
-        super();
-    }
-}

package/src/lib/list-items/list-node-workflow/list-node-workflow.component.html

@@ -1,3 +0,0 @@
-<div class="workflowStatus" [style.background-color]="getWorkflowStatus().color">
-  {{ 'WORKFLOW.' + getWorkflowStatus().id | translate }}
-</div>

package/src/lib/list-items/list-node-workflow/list-node-workflow.component.ts

@@ -1,21 +0,0 @@
-import { Component } from '@angular/core';
-import { ListWidget } from '../list-widget';
-import { ListItem } from '../../types/list-item';
-import { NodeHelperService } from '../../services/node-helper.service';
-import { Node, RestConstants } from 'ngx-edu-sharing-api';
-
-@Component({
-    selector: 'es-list-node-workflow',
-    templateUrl: './list-node-workflow.component.html',
-})
-export class ListNodeWorkflowComponent extends ListWidget {
-    static supportedItems = [new ListItem('NODE', RestConstants.CCM_PROP_WF_STATUS)];
-
-    constructor(private nodeHelper: NodeHelperService) {
-        super();
-    }
-
-    getWorkflowStatus() {
-        return this.nodeHelper.getWorkflowStatus(this.node as Node).current;
-    }
-}