MOBILE-2630 messages: Fix PTR issue in conversations

main
Dani Palou 2019-01-02 16:37:45 +01:00
parent 0a59a42006
commit 79b67560ae
2 changed files with 33 additions and 9 deletions

View File

@ -15,7 +15,7 @@
</ion-header> </ion-header>
<core-split-view> <core-split-view>
<ion-content class="core-expand-max"> <ion-content class="core-expand-max">
<ion-refresher [enabled]="loaded" (ionRefresh)="refreshData($event)"> <ion-refresher [enabled]="loaded && (!currentListEl || currentListEl.scrollTop < 5)" (ionRefresh)="refreshData($event)">
<ion-refresher-content pullingText="{{ 'core.pulltorefresh' | translate }}"></ion-refresher-content> <ion-refresher-content pullingText="{{ 'core.pulltorefresh' | translate }}"></ion-refresher-content>
</ion-refresher> </ion-refresher>
@ -33,11 +33,11 @@
{{ 'core.favourites' | translate }} ({{ favourites.count }}) {{ 'core.favourites' | translate }} ({{ favourites.count }})
<ion-badge item-end *ngIf="favourites.unread">{{ favourites.unread }}</ion-badge> <ion-badge item-end *ngIf="favourites.unread">{{ favourites.unread }}</ion-badge>
</ion-item-divider> </ion-item-divider>
<div *ngIf="favourites.conversations && favourites.expanded && !favourites.loading"> <div [hidden]="!favourites.conversations || !favourites.expanded || favourites.loading" #favlist>
<ng-container *ngTemplateOutlet="conversationsTemplate; context: {conversations: favourites.conversations}"></ng-container> <ng-container *ngTemplateOutlet="conversationsTemplate; context: {conversations: favourites.conversations}"></ng-container>
<!-- The infinite loading cannot be inside the ng-template, it fails because it doesn't find ion-content. --> <!-- The infinite loading cannot be inside the ng-template, it fails because it doesn't find ion-content. -->
<core-infinite-loading [enabled]="favourites.canLoadMore" (action)="loadMoreConversations(favourites, $event)" [error]="favourites.loadMoreError"></core-infinite-loading> <core-infinite-loading [enabled]="favourites.canLoadMore" (action)="loadMoreConversations(favourites, $event)" [error]="favourites.loadMoreError"></core-infinite-loading>
<ion-item text-wrap *ngIf="favourites.conversations.length == 0"> <ion-item text-wrap *ngIf="favourites.conversations && favourites.conversations.length == 0">
<p>{{ 'addon.messages.nofavourites' | translate }}</p> <p>{{ 'addon.messages.nofavourites' | translate }}</p>
</ion-item> </ion-item>
</div> </div>
@ -52,11 +52,11 @@
{{ 'addon.messages.groupconversations' | translate }} ({{ group.count }}) {{ 'addon.messages.groupconversations' | translate }} ({{ group.count }})
<ion-badge item-end *ngIf="group.unread">{{ group.unread }}</ion-badge> <ion-badge item-end *ngIf="group.unread">{{ group.unread }}</ion-badge>
</ion-item-divider> </ion-item-divider>
<div *ngIf="group.conversations && group.expanded && !group.loading"> <div [hidden]="!group.conversations || !group.expanded || group.loading" #grouplist>
<ng-container *ngTemplateOutlet="conversationsTemplate; context: {conversations: group.conversations}"></ng-container> <ng-container *ngTemplateOutlet="conversationsTemplate; context: {conversations: group.conversations}"></ng-container>
<!-- The infinite loading cannot be inside the ng-template, it fails because it doesn't find ion-content. --> <!-- The infinite loading cannot be inside the ng-template, it fails because it doesn't find ion-content. -->
<core-infinite-loading [enabled]="group.canLoadMore" (action)="loadMoreConversations(group, $event)" [error]="group.loadMoreError"></core-infinite-loading> <core-infinite-loading [enabled]="group.canLoadMore" (action)="loadMoreConversations(group, $event)" [error]="group.loadMoreError"></core-infinite-loading>
<ion-item text-wrap *ngIf="group.conversations.length == 0"> <ion-item text-wrap *ngIf="group.conversations && group.conversations.length == 0">
<p>{{ 'addon.messages.nogroupconversations' | translate }}</p> <p>{{ 'addon.messages.nogroupconversations' | translate }}</p>
</ion-item> </ion-item>
</div> </div>
@ -70,11 +70,11 @@
{{ 'addon.messages.individualconversations' | translate }} ({{ individual.count }}) {{ 'addon.messages.individualconversations' | translate }} ({{ individual.count }})
<ion-badge item-end *ngIf="individual.unread">{{ individual.unread }}</ion-badge> <ion-badge item-end *ngIf="individual.unread">{{ individual.unread }}</ion-badge>
</ion-item-divider> </ion-item-divider>
<div *ngIf="individual.conversations && individual.expanded && !individual.loading"> <div [hidden]="!individual.conversations || !individual.expanded || individual.loading" #indlist>
<ng-container *ngTemplateOutlet="conversationsTemplate; context: {conversations: individual.conversations}"></ng-container> <ng-container *ngTemplateOutlet="conversationsTemplate; context: {conversations: individual.conversations}"></ng-container>
<!-- The infinite loading cannot be inside the ng-template, it fails because it doesn't find ion-content. --> <!-- The infinite loading cannot be inside the ng-template, it fails because it doesn't find ion-content. -->
<core-infinite-loading [enabled]="individual.canLoadMore" (action)="loadMoreConversations(individual, $event)" [error]="individual.loadMoreError"></core-infinite-loading> <core-infinite-loading [enabled]="individual.canLoadMore" (action)="loadMoreConversations(individual, $event)" [error]="individual.loadMoreError"></core-infinite-loading>
<ion-item text-wrap *ngIf="individual.conversations.length == 0"> <ion-item text-wrap *ngIf="individual.conversations && individual.conversations.length == 0">
<p>{{ 'addon.messages.noindividualconversations' | translate }}</p> <p>{{ 'addon.messages.noindividualconversations' | translate }}</p>
</ion-item> </ion-item>
</div> </div>

View File

@ -12,7 +12,7 @@
// See the License for the specific language governing permissions and // See the License for the specific language governing permissions and
// limitations under the License. // limitations under the License.
import { Component, OnInit, OnDestroy, ViewChild } from '@angular/core'; import { Component, OnInit, OnDestroy, ViewChild, ElementRef } from '@angular/core';
import { IonicPage, Platform, NavController, NavParams, Content } from 'ionic-angular'; import { IonicPage, Platform, NavController, NavParams, Content } from 'ionic-angular';
import { TranslateService } from '@ngx-translate/core'; import { TranslateService } from '@ngx-translate/core';
import { CoreEventsProvider } from '@providers/events'; import { CoreEventsProvider } from '@providers/events';
@ -36,6 +36,9 @@ import { CoreUserProvider } from '@core/user/providers/user';
export class AddonMessagesGroupConversationsPage implements OnInit, OnDestroy { export class AddonMessagesGroupConversationsPage implements OnInit, OnDestroy {
@ViewChild(CoreSplitViewComponent) splitviewCtrl: CoreSplitViewComponent; @ViewChild(CoreSplitViewComponent) splitviewCtrl: CoreSplitViewComponent;
@ViewChild(Content) content: Content; @ViewChild(Content) content: Content;
@ViewChild('favlist') favListEl: ElementRef;
@ViewChild('grouplist') groupListEl: ElementRef;
@ViewChild('indlist') indListEl: ElementRef;
loaded = false; loaded = false;
loadingMessage: string; loadingMessage: string;
@ -61,6 +64,7 @@ export class AddonMessagesGroupConversationsPage implements OnInit, OnDestroy {
unread: 0 unread: 0
}; };
typeIndividual = AddonMessagesProvider.MESSAGE_CONVERSATION_TYPE_INDIVIDUAL; typeIndividual = AddonMessagesProvider.MESSAGE_CONVERSATION_TYPE_INDIVIDUAL;
currentListEl: HTMLElement;
protected loadingString: string; protected loadingString: string;
protected siteId: string; protected siteId: string;
@ -295,6 +299,8 @@ export class AddonMessagesGroupConversationsPage implements OnInit, OnDestroy {
this.favourites.expanded = this.favourites.count != 0; this.favourites.expanded = this.favourites.count != 0;
this.group.expanded = this.favourites.count == 0 && this.group.count != 0; this.group.expanded = this.favourites.count == 0 && this.group.count != 0;
this.individual.expanded = this.favourites.count == 0 && this.group.count == 0; this.individual.expanded = this.favourites.count == 0 && this.group.count == 0;
this.loadCurrentListElement();
} }
/** /**
@ -622,6 +628,7 @@ export class AddonMessagesGroupConversationsPage implements OnInit, OnDestroy {
if (option.expanded) { if (option.expanded) {
// Already expanded, close it. // Already expanded, close it.
option.expanded = false; option.expanded = false;
this.loadCurrentListElement();
} else { } else {
this.expandOption(option).catch((error) => { this.expandOption(option).catch((error) => {
this.domUtils.showErrorModalDefault(error, 'addon.messages.errorwhileretrievingdiscussions', true); this.domUtils.showErrorModalDefault(error, 'addon.messages.errorwhileretrievingdiscussions', true);
@ -645,7 +652,9 @@ export class AddonMessagesGroupConversationsPage implements OnInit, OnDestroy {
option.expanded = true; option.expanded = true;
option.loading = true; option.loading = true;
return this.fetchDataForOption(option, false, refreshUnreadCounts).catch((error) => { return this.fetchDataForOption(option, false, refreshUnreadCounts).then(() => {
this.loadCurrentListElement();
}).catch((error) => {
option.expanded = false; option.expanded = false;
return Promise.reject(error); return Promise.reject(error);
@ -654,6 +663,21 @@ export class AddonMessagesGroupConversationsPage implements OnInit, OnDestroy {
}); });
} }
/**
* Load the current list element based on the expanded list.
*/
protected loadCurrentListElement(): void {
if (this.favourites.expanded) {
this.currentListEl = this.favListEl && this.favListEl.nativeElement;
} else if (this.group.expanded) {
this.currentListEl = this.groupListEl && this.groupListEl.nativeElement;
} else if (this.individual.expanded) {
this.currentListEl = this.indListEl && this.indListEl.nativeElement;
} else {
this.currentListEl = undefined;
}
}
/** /**
* Navigate to the search page. * Navigate to the search page.
*/ */