MOBILE-4362 course: Apply Infinite loading improvements from type list

main
Pau Ferrer Ocaña 2023-10-18 11:30:36 +02:00
parent 0e31b8214a
commit 702abcdfd1
2 changed files with 13 additions and 32 deletions

View File

@ -21,7 +21,7 @@
<div *ngIf="selectedSection && selectedSection.id == allSectionsId"> <div *ngIf="selectedSection && selectedSection.id == allSectionsId">
<core-dynamic-component [component]="allSectionsComponent" [data]="data"> <core-dynamic-component [component]="allSectionsComponent" [data]="data">
<ng-container *ngFor="let section of sections; index as i"> <ng-container *ngFor="let section of sections; index as i">
<ng-container *ngIf="i <= showSectionId"> <ng-container *ngIf="i <= lastShownSectionIndex">
<ng-container *ngTemplateOutlet="sectionTemplate; context: {section: section}"></ng-container> <ng-container *ngTemplateOutlet="sectionTemplate; context: {section: section}"></ng-container>
</ng-container> </ng-container>
</ng-container> </ng-container>

View File

@ -70,7 +70,7 @@ import { CoreBlockSideBlocksComponent } from '@features/block/components/side-bl
}) })
export class CoreCourseFormatComponent implements OnInit, OnChanges, OnDestroy { export class CoreCourseFormatComponent implements OnInit, OnChanges, OnDestroy {
static readonly LOAD_MORE_ACTIVITIES = 20; // How many activities should load each time showMoreActivities is called. static readonly LOAD_MORE_ACTIVITIES = 10; // How many activities should load each time showMoreActivities is called.
@Input() course!: CoreCourseAnyCourseData; // The course to render. @Input() course!: CoreCourseAnyCourseData; // The course to render.
@Input() sections: CoreCourseSectionToDisplay[] = []; // List of course sections. @Input() sections: CoreCourseSectionToDisplay[] = []; // List of course sections.
@ -89,7 +89,7 @@ export class CoreCourseFormatComponent implements OnInit, OnChanges, OnDestroy {
allSectionsComponent?: Type<unknown>; allSectionsComponent?: Type<unknown>;
canLoadMore = false; canLoadMore = false;
showSectionId = 0; lastShownSectionIndex = 0;
data: Record<string, unknown> = {}; // Data to pass to the components. data: Record<string, unknown> = {}; // Data to pass to the components.
courseIndexTour: CoreUserTourDirectiveOptions = { courseIndexTour: CoreUserTourDirectiveOptions = {
id: 'course-index', id: 'course-index',
@ -514,8 +514,7 @@ export class CoreCourseFormatComponent implements OnInit, OnChanges, OnDestroy {
} else { } else {
this.previousSection = undefined; this.previousSection = undefined;
this.nextSection = undefined; this.nextSection = undefined;
this.canLoadMore = false; this.lastShownSectionIndex = -1;
this.showSectionId = 0;
this.showMoreActivities(); this.showMoreActivities();
} }
@ -594,40 +593,22 @@ export class CoreCourseFormatComponent implements OnInit, OnChanges, OnDestroy {
* @param infiniteComplete Infinite scroll complete function. Only used from core-infinite-loading. * @param infiniteComplete Infinite scroll complete function. Only used from core-infinite-loading.
*/ */
showMoreActivities(infiniteComplete?: () => void): void { showMoreActivities(infiniteComplete?: () => void): void {
this.canLoadMore = false;
const sections = this.sections || [];
let modulesLoaded = 0; let modulesLoaded = 0;
let i: number; while (this.lastShownSectionIndex < this.sections.length - 1 &&
for (i = this.showSectionId + 1; i < sections.length; i++) { modulesLoaded < CoreCourseFormatComponent.LOAD_MORE_ACTIVITIES) {
if (!sections[i].hasContent || !sections[i].modules) { this.lastShownSectionIndex++;
if (!this.sections[this.lastShownSectionIndex].hasContent || !this.sections[this.lastShownSectionIndex].modules) {
continue; continue;
} }
modulesLoaded += sections[i].modules.reduce((total, module) => modulesLoaded += this.sections[this.lastShownSectionIndex].modules.reduce((total, module) =>
!CoreCourseHelper.isModuleStealth(module, sections[i]) ? total + 1 : total, 0); !CoreCourseHelper.isModuleStealth(module, this.sections[this.lastShownSectionIndex]) ? total + 1 : total, 0);
if (modulesLoaded >= CoreCourseFormatComponent.LOAD_MORE_ACTIVITIES) {
break;
}
} }
this.showSectionId = i; this.canLoadMore = this.lastShownSectionIndex < this.sections.length - 1;
this.canLoadMore = i < sections.length;
if (this.canLoadMore) { infiniteComplete?.();
// Check if any of the following sections have any content.
let thereAreMore = false;
for (i++; i < sections.length; i++) {
if (sections[i].hasContent && sections[i].modules && sections[i].modules?.length > 0) {
thereAreMore = true;
break;
}
}
this.canLoadMore = thereAreMore;
}
infiniteComplete && infiniteComplete();
} }
/** /**