Commit 5421183a authored by Marcelo Rivera's avatar Marcelo Rivera
Browse files

(fix): moved algorithm to a queryParam

(fix): removed title
(fix): keyup.enter listener for search input
parent af0b4e55
Pipeline #74183259 passed with stages
in 29 minutes and 57 seconds
......@@ -17,20 +17,63 @@
autocomplete="off"
class="mdl-textfield__input ng-pristine ng-valid ng-touched"
type="text"
(keyup)="search()"
(keyup.enter)="search()"
>
<label class="mdl-textfield__label" for="search"></label>
</div>
</div>
<ng-container *ngIf="!collapseNavItems">
<a class="m-proChannelTopbar__navItem" [routerLink]="['/pro', channel.username, 'feed', 'top']" routerLinkActive="active" i18n>Feed</a>
<a class="m-proChannelTopbar__navItem" [routerLink]="['/pro', channel.username, 'videos', 'top']" routerLinkActive="active" i18n>Videos</a>
<a class="m-proChannelTopbar__navItem" [routerLink]="['/pro', channel.username, 'images', 'top']" routerLinkActive="active" i18n>Images</a>
<a class="m-proChannelTopbar__navItem" [routerLink]="['/pro', channel.username, 'articles', 'top']" routerLinkActive="active" i18n>Articles</a>
<a class="m-proChannelTopbar__navItem" [routerLink]="['/pro', channel.username, 'groups', 'top']" routerLinkActive="active" i18n>Groups</a>
<a class="m-proChannelTopbar__navItem" [routerLink]="['/pro', channel.username, 'donate']" routerLinkActive="active">Donate</a>
<a class="m-proChannelTopbar__navItem" [routerLink]="['/pro', channel.username, 'signup']" routerLinkActive="active" *ngIf="!currentUser">Signup / Login</a>
<a
class="m-proChannelTopbar__navItem"
[routerLink]="['/pro', channel.username, 'feed']"
[queryParams]="{algorithm: 'pro'}"
routerLinkActive="active"
i18n
>Feed</a>
<a
class="m-proChannelTopbar__navItem"
[routerLink]="['/pro', channel.username, 'videos']"
[queryParams]="{algorithm: 'pro'}"
routerLinkActive="active"
i18n
>Videos</a>
<a
class="m-proChannelTopbar__navItem"
[routerLink]="['/pro', channel.username, 'images']"
[queryParams]="{algorithm: 'pro'}"
routerLinkActive="active"
i18n
>Images</a>
<a
class="m-proChannelTopbar__navItem"
[routerLink]="['/pro', channel.username, 'articles']"
[queryParams]="{algorithm: 'pro'}"
routerLinkActive="active"
i18n
>Articles</a>
<a
class="m-proChannelTopbar__navItem"
[routerLink]="['/pro', channel.username, 'groups']"
[queryParams]="{algorithm: 'pro'}"
routerLinkActive="active"
i18n
>Groups</a>
<a
class="m-proChannelTopbar__navItem"
[routerLink]="['/pro', channel.username, 'donate']"
[queryParams]="{algorithm: 'pro'}"
routerLinkActive="active"
i18n
>Donate</a>
<a
class="m-proChannelTopbar__navItem"
[routerLink]="['/pro', channel.username, 'signup']"
[queryParams]="{algorithm: 'pro'}"
routerLinkActive="active"
*ngIf="!currentUser"
i18n
>Signup / Login</a>
</ng-container>
<ng-container *ngIf="currentUser">
......
<h1 [ngSwitch]="type">
<ng-template ngSwitchCase="videos" i18n>Videos</ng-template>
<ng-template ngSwitchCase="images" i18n>Images</ng-template>
<ng-template ngSwitchCase="blogs" i18n>Articles</ng-template>
<ng-template ngSwitchCase="groups" i18n>Groups</ng-template>
<ng-template ngSwitchCase="activities" i18n>Feed</ng-template>
<ng-template ngSwitchDefault>{{ type | titlecase }}</ng-template>
</h1>
<div class="m-proChannelList__algorithm">
<a [routerLink]="['/pro', channelUsername, getTypeForRoute(type), 'hot']" routerLinkActive="active" i18n>
<i class="material-icons">whatshot</i>
......
import { ChangeDetectionStrategy, ChangeDetectorRef, Component, OnInit } from '@angular/core';
import { ActivatedRoute, Router } from "@angular/router";
import { ChangeDetectionStrategy, ChangeDetectorRef, Component, OnDestroy, OnInit } from '@angular/core';
import { ActivatedRoute, Router } from "@angular/router";
import { Subscription } from "rxjs";
import { FeedsService } from "../../../../common/services/feeds.service";
import { ProChannelService } from '../channel.service';
......@@ -10,11 +10,12 @@ import { first } from "rxjs/operators";
templateUrl: 'list.component.html',
changeDetection: ChangeDetectionStrategy.OnPush,
})
export class ProChannelListComponent implements OnInit {
export class ProChannelListComponent implements OnInit, OnDestroy {
type: string;
params$: Subscription;
queryParams$: Subscription;
entities: any[] = [];
......@@ -56,10 +57,12 @@ export class ProChannelListComponent implements OnInit {
throw new Error('Unknown type');
}
this.algorithm = params['algorithm'] || 'top';
this.load(true);
});
this.queryParams$ = this.route.queryParams.subscribe(queryParams => {
this.algorithm = queryParams['algorithm'] || 'top';
});
this.feedsService.feed.subscribe(async entities => {
if (!entities.length)
......@@ -74,6 +77,15 @@ export class ProChannelListComponent implements OnInit {
});
}
ngOnDestroy() {
if (this.params$) {
this.params$.unsubscribe();
}
if (this.queryParams$) {
this.queryParams$.unsubscribe();
}
}
async load(refresh: boolean = false) {
if (refresh) {
this.feedsService.clear();
......@@ -113,7 +125,7 @@ export class ProChannelListComponent implements OnInit {
* Returns the feed type on par to routes
* @param type feed type
*/
getTypeForRoute(type: string): string{
getTypeForRoute(type: string): string {
let routeType = '';
switch (type) {
case 'videos':
......
......@@ -48,7 +48,7 @@ const routes: Routes = [
component: ProChannelSignupComponent
},
{
path: ':type/:algorithm',
path: ':type',
component: ProChannelListComponent,
},
]
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment