Merge pull request #3208 from NoelDeMartin/MOBILE-3833

MOBILE-3833: Fix block contexts & calendar reactivity
main
Dani Palou 2022-03-29 09:52:48 +02:00 committed by GitHub
commit 1703c05740
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
9 changed files with 43 additions and 23 deletions

View File

@ -20,6 +20,7 @@ import { CoreCourseBlock } from '@features/course/services/course';
import { Params } from '@angular/router';
import { makeSingleton } from '@singletons';
import { AddonCalendarMainMenuHandlerService } from '@addons/calendar/services/handlers/mainmenu';
import { CoreSites } from '@services/sites';
/**
* Block handler.
@ -39,8 +40,11 @@ export class AddonBlockCalendarUpcomingHandlerService extends CoreBlockBaseHandl
* @return Data or promise resolved with the data.
*/
getDisplayData(block: CoreCourseBlock, contextLevel: string, instanceId: number): CoreBlockHandlerData {
const linkParams: Params = contextLevel == 'course' ? { courseId: instanceId } : {};
linkParams.upcoming = true;
const linkParams: Params = { upcoming: true };
if (contextLevel == 'course' && instanceId !== CoreSites.getCurrentSiteHomeId()) {
linkParams.courseId = instanceId;
}
return {
title: 'addon.block_calendarupcoming.pluginname',
@ -48,9 +52,6 @@ export class AddonBlockCalendarUpcomingHandlerService extends CoreBlockBaseHandl
component: CoreBlockOnlyTitleComponent,
link: AddonCalendarMainMenuHandlerService.PAGE_NAME,
linkParams: linkParams,
navOptions: {
preferCurrentTab: false,
},
};
}

View File

@ -23,6 +23,7 @@ import {
KeyValueDiffers,
KeyValueDiffer,
ViewChild,
HostBinding,
} from '@angular/core';
import { CoreEventObserver, CoreEvents } from '@singletons/events';
import { CoreSites } from '@services/sites';
@ -64,6 +65,7 @@ export class AddonCalendarCalendarComponent implements OnInit, DoCheck, OnDestro
@Input() initialYear?: number; // Initial year to load.
@Input() initialMonth?: number; // Initial month to load.
@Input() filter?: AddonCalendarFilter; // Filter to apply.
@Input() hidden?: boolean; // Whether the component is hidden.
@Input() canNavigate?: string | boolean; // Whether to include arrows to change the month. Defaults to true.
@Input() displayNavButtons?: string | boolean; // Whether to display nav buttons created by this component. Defaults to true.
@Output() onEventClicked = new EventEmitter<number>();
@ -74,14 +76,13 @@ export class AddonCalendarCalendarComponent implements OnInit, DoCheck, OnDestro
loaded = false;
protected currentSiteId: string;
protected differ: KeyValueDiffer<unknown, unknown>; // To detect changes in the data input.
protected hiddenDiffer?: boolean; // To detect changes in the hidden input.
protected filterDiffer: KeyValueDiffer<unknown, unknown>; // To detect changes in the filters input.
// Observers and listeners.
protected undeleteEventObserver: CoreEventObserver;
protected managerUnsubscribe?: () => void;
constructor(
differs: KeyValueDiffers,
) {
constructor(differs: KeyValueDiffers) {
this.currentSiteId = CoreSites.getCurrentSiteId();
// Listen for events "undeleted" (offline).
@ -104,7 +105,12 @@ export class AddonCalendarCalendarComponent implements OnInit, DoCheck, OnDestro
this.currentSiteId,
);
this.differ = differs.find([]).create();
this.hiddenDiffer = this.hidden;
this.filterDiffer = differs.find(this.filter ?? {}).create();
}
@HostBinding('attr.hidden') get hiddenAttribute(): string | null {
return this.hidden ? 'hidden' : null;
}
/**
@ -137,7 +143,7 @@ export class AddonCalendarCalendarComponent implements OnInit, DoCheck, OnDestro
if (items?.length) {
// Check if there's any change in the filter object.
const changes = this.differ.diff(this.filter || {});
const changes = this.filterDiffer.diff(this.filter ?? {});
if (changes) {
items.forEach((month) => {
if (month.loaded && month.weeks) {
@ -146,6 +152,14 @@ export class AddonCalendarCalendarComponent implements OnInit, DoCheck, OnDestro
});
}
}
if (this.hiddenDiffer !== this.hidden) {
this.hiddenDiffer = this.hidden;
if (!this.hidden) {
this.slides?.slides?.getSwiper().then(swipper => swipper.update());
}
}
}
get timeFormat(): string {

View File

@ -30,7 +30,8 @@ import { CoreBlockSideBlocksComponent } from '../side-blocks/side-blocks';
})
export class CoreBlockSideBlocksButtonComponent implements OnInit, OnDestroy {
@Input() courseId!: number;
@Input() contextLevel!: string;
@Input() instanceId!: number;
@ViewChild('button', { read: ElementRef }) button?: ElementRef<HTMLElement>;
protected element: HTMLElement;
@ -54,7 +55,8 @@ export class CoreBlockSideBlocksButtonComponent implements OnInit, OnDestroy {
CoreDomUtils.openSideModal({
component: CoreBlockSideBlocksComponent,
componentProps: {
courseId: this.courseId,
contextLevel: this.contextLevel,
instanceId: this.instanceId,
},
});
}

View File

@ -14,7 +14,7 @@
<core-loading [hideUntil]="loaded">
<ion-list *ngIf="blocks.length > 0">
<ng-container *ngFor="let block of blocks">
<core-block *ngIf="block.visible" [block]="block" contextLevel="course" [instanceId]="courseId"></core-block>
<core-block *ngIf="block.visible" [block]="block" [contextLevel]="contextLevel" [instanceId]="instanceId"></core-block>
</ng-container>
</ion-list>

View File

@ -32,7 +32,8 @@ import { CoreCoursesDashboard } from '@features/courses/services/dashboard';
})
export class CoreBlockSideBlocksComponent implements OnInit {
@Input() courseId?: number;
@Input() contextLevel!: string;
@Input() instanceId!: number;
@ViewChildren(CoreBlockComponent) blocksComponents?: QueryList<CoreBlockComponent>;
@ -56,8 +57,8 @@ export class CoreBlockSideBlocksComponent implements OnInit {
async invalidateBlocks(): Promise<void> {
const promises: Promise<void>[] = [];
if (this.courseId) {
promises.push(CoreCourse.invalidateCourseBlocks(this.courseId));
if (this.contextLevel === 'course') {
promises.push(CoreCourse.invalidateCourseBlocks(this.instanceId));
} else {
promises.push(CoreCoursesDashboard.invalidateDashboardBlocks());
}
@ -79,8 +80,8 @@ export class CoreBlockSideBlocksComponent implements OnInit {
*/
async loadContent(): Promise<void> {
try {
if (this.courseId) {
this.blocks = await CoreBlockHelper.getCourseBlocks(this.courseId);
if (this.contextLevel === 'course') {
this.blocks = await CoreBlockHelper.getCourseBlocks(this.instanceId);
} else {
const blocks = await CoreCoursesDashboard.getDashboardBlocks();

View File

@ -44,7 +44,8 @@
</core-dynamic-component>
<core-block-side-blocks-button slot="fixed" *ngIf="loaded && course && displayBlocks && hasBlocks" [courseId]="course.id">
<core-block-side-blocks-button slot="fixed" *ngIf="loaded && course && displayBlocks && hasBlocks" contextlevel="course"
[instanceId]="course.id">
</core-block-side-blocks-button>
<!-- Course Index button. -->

View File

@ -2,5 +2,5 @@
<core-dynamic-component [component]="componentClass" [data]="data"></core-dynamic-component>
</div>
<core-block-side-blocks-button slot="fixed" *ngIf="course && hasBlocks" [courseId]="course.id">
<core-block-side-blocks-button slot="fixed" *ngIf="course && hasBlocks" contextLevel="course" [instanceId]="course.id">
</core-block-side-blocks-button>

View File

@ -15,7 +15,8 @@
</ng-container>
</ion-list>
<core-block-side-blocks-button slot="fixed" *ngIf="hasSideBlocks"></core-block-side-blocks-button>
<core-block-side-blocks-button slot="fixed" *ngIf="hasSideBlocks" contextLevel="user" [instanceId]="userId">
</core-block-side-blocks-button>
<core-empty-box *ngIf="blocks.length == 0" icon="fas-cubes" [message]="'core.course.nocontentavailable' | translate">
</core-empty-box>

View File

@ -45,7 +45,7 @@
</ng-container>
</ng-container>
</ion-list>
<core-block-side-blocks-button slot="fixed" *ngIf="hasBlocks" [courseId]="siteHomeId">
<core-block-side-blocks-button slot="fixed" *ngIf="hasBlocks" contextLevel="course" [instanceId]="siteHomeId">
</core-block-side-blocks-button>
<core-empty-box *ngIf="!hasContent" icon="fas-box-open" [message]="'core.course.nocontentavailable' | translate">