sudacode/ghostfolio
1
0
Fork 0
Code Issues Pull Requests Actions Packages Releases Activity

Feature/improve tab navigations (#2031)

Browse Source 
* Improve tab navigations

* Update changelog
This commit is contained in:
Thomas Kaul 2023-06-03 07:44:59 +02:00 committed by GitHub
parent 23db85e940
commit ae57a188f5
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
18 changed files with 76 additions and 82 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
CHANGELOG.md
View File

@ -13,6 +13,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
### Changed
- Improved the routes of the tabs
- Removed the _Ghostfolio in Numbers_ section from the about page
## 1.275.0 - 2023-05-30

3
apps/client/src/app/pages/about/about-page-routing.module.ts
View File

@ -8,9 +8,8 @@ const routes: Routes = [
{
canActivate: [AuthGuard],
children: [
{ path: '', redirectTo: 'overview', pathMatch: 'full' },
{
path: 'overview',
path: '',
loadChildren: () =>
import('./overview/about-overview-page.module').then(
(m) => m.AboutOverviewPageModule

15
apps/client/src/app/pages/about/about-page.component.ts
View File

@ -7,7 +7,7 @@ import {
} from '@angular/core';
import { DataService } from '@ghostfolio/client/services/data.service';
import { UserService } from '@ghostfolio/client/services/user/user.service';
import { User } from '@ghostfolio/common/interfaces';
import { TabConfiguration, User } from '@ghostfolio/common/interfaces';
import { hasPermission, permissions } from '@ghostfolio/common/permissions';
import { Subject } from 'rxjs';
import { takeUntil } from 'rxjs/operators';
@ -24,12 +24,7 @@ export class AboutPageComponent implements OnDestroy, OnInit {
public hasMessage: boolean;
public hasPermissionForSubscription: boolean;
public tabs: {
iconName: string;
label: string;
path: string;
showCondition?: boolean;
}[] = [];
public tabs: TabConfiguration[] = [];
public user: User;
private unsubscribeSubject = new Subject<void>();
@ -54,17 +49,17 @@ export class AboutPageComponent implements OnDestroy, OnInit {
{
iconName: 'reader-outline',
label: $localize`About`,
path: 'overview'
path: ['/about']
},
{
iconName: 'sparkles-outline',
label: $localize`Changelog & License`,
path: 'changelog'
path: ['/about', 'changelog']
},
{
iconName: 'shield-checkmark-outline',
label: $localize`Privacy Policy`,
path: 'privacy-policy',
path: ['/about', 'privacy-policy'],
showCondition: this.hasPermissionForSubscription
}
];

1
apps/client/src/app/pages/about/about-page.html
View File

@ -12,6 +12,7 @@
routerLinkActive
[active]="rla.isActive"
[routerLink]="tab.path"
[routerLinkActiveOptions]="{ exact: true }"
>
<ion-icon size="large" [name]="tab.iconName"></ion-icon>
<div class="d-none d-sm-block ml-2">{{ tab.label }}</div>

11
apps/client/src/app/pages/admin/admin-page-routing.module.ts
View File

@ -13,18 +13,17 @@ const routes: Routes = [
{
canActivate: [AuthGuard],
children: [
{ path: '', redirectTo: 'overview', pathMatch: 'full' },
{
path: '',
component: AdminOverviewComponent,
title: $localize`Admin Control`
},
{ path: 'jobs', component: AdminJobsComponent, title: $localize`Jobs` },
{
path: 'market-data',
component: AdminMarketDataComponent,
title: $localize`Market Data`
},
{
path: 'overview',
component: AdminOverviewComponent,
title: $localize`Admin Control`
},
{
path: 'settings',
component: AdminSettingsComponent,

26
apps/client/src/app/pages/admin/admin-page.component.ts
View File

@ -1,5 +1,6 @@
import { Component, HostBinding, OnDestroy, OnInit } from '@angular/core';
import { DataService } from '@ghostfolio/client/services/data.service';
import { TabConfiguration } from '@ghostfolio/common/interfaces';
import { Subject } from 'rxjs';
@Component({
@ -13,12 +14,7 @@ export class AdminPageComponent implements OnDestroy, OnInit {
}
public hasMessage: boolean;
public tabs: {
iconName: string;
label: string;
path: string;
showCondition?: boolean;
}[] = [];
public tabs: TabConfiguration[] = [];
private unsubscribeSubject = new Subject<void>();
@ -33,20 +29,28 @@ export class AdminPageComponent implements OnDestroy, OnInit {
{
iconName: 'reader-outline',
label: $localize`Overview`,
path: 'overview'
path: ['/admin']
},
{
iconName: 'settings-outline',
label: $localize`Settings`,
path: 'settings'
path: ['/admin', 'settings']
},
{
iconName: 'server-outline',
label: $localize`Market Data`,
path: 'market-data'
path: ['/admin', 'market-data']
},
{ iconName: 'flash-outline', label: $localize`Jobs`, path: 'jobs' },
{ iconName: 'people-outline', label: $localize`Users`, path: 'users' }
{
iconName: 'flash-outline',
label: $localize`Jobs`,
path: ['/admin', 'jobs']
},
{
iconName: 'people-outline',
label: $localize`Users`,
path: ['/admin', 'users']
}
];
}

1
apps/client/src/app/pages/admin/admin-page.html
View File

@ -12,6 +12,7 @@
routerLinkActive
[active]="rla.isActive"
[routerLink]="tab.path"
[routerLinkActiveOptions]="{ exact: true }"
>
<ion-icon size="large" [name]="tab.iconName"></ion-icon>
<div class="d-none d-sm-block ml-2">{{ tab.label }}</div>

3
apps/client/src/app/pages/home/home-page-routing.module.ts
View File

@ -12,9 +12,8 @@ const routes: Routes = [
{
canActivate: [AuthGuard],
children: [
{ path: '', redirectTo: 'overview', pathMatch: 'full' },
{
path: 'overview',
path: '',
component: HomeOverviewComponent
},
{

44
apps/client/src/app/pages/home/home-page.component.ts
View File

@ -7,7 +7,7 @@ import {
} from '@angular/core';
import { DataService } from '@ghostfolio/client/services/data.service';
import { UserService } from '@ghostfolio/client/services/user/user.service';
import { InfoItem, User } from '@ghostfolio/common/interfaces';
import { TabConfiguration, User } from '@ghostfolio/common/interfaces';
import { hasPermission, permissions } from '@ghostfolio/common/permissions';
import { Subject } from 'rxjs';
import { takeUntil } from 'rxjs/operators';
@ -24,13 +24,7 @@ export class HomePageComponent implements OnDestroy, OnInit {
public hasMessage: boolean;
public hasPermissionToAccessFearAndGreedIndex: boolean;
public info: InfoItem;
public tabs: {
iconName: string;
label: string;
path: string;
showCondition?: boolean;
}[] = [];
public tabs: TabConfiguration[] = [];
public user: User;
private unsubscribeSubject = new Subject<void>();
@ -40,7 +34,12 @@ export class HomePageComponent implements OnDestroy, OnInit {
private dataService: DataService,
private userService: UserService
) {
this.info = this.dataService.fetchInfo();
const { globalPermissions, systemMessage } = this.dataService.fetchInfo();
this.hasPermissionToAccessFearAndGreedIndex = hasPermission(
globalPermissions,
permissions.enableFearAndGreedIndex
);
this.userService.stateChanged
.pipe(takeUntil(this.unsubscribeSubject))
@ -50,17 +49,23 @@ export class HomePageComponent implements OnDestroy, OnInit {
{
iconName: 'analytics-outline',
label: $localize`Overview`,
path: 'overview'
path: ['/home']
},
{
iconName: 'wallet-outline',
label: $localize`Holdings`,
path: 'holdings'
path: ['/home', 'holdings']
},
{
iconName: 'reader-outline',
label: $localize`Summary`,
path: 'summary'
path: ['/home', 'summary']
},
{
iconName: 'newspaper-outline',
label: $localize`Markets`,
path: ['/home', 'market'],
showCondition: this.hasPermissionToAccessFearAndGreedIndex
}
];
this.user = state.user;
@ -69,20 +74,7 @@ export class HomePageComponent implements OnDestroy, OnInit {
hasPermission(
this.user?.permissions,
permissions.createUserAccount
) || !!this.info.systemMessage;
this.hasPermissionToAccessFearAndGreedIndex = hasPermission(
this.info?.globalPermissions,
permissions.enableFearAndGreedIndex
);
if (this.hasPermissionToAccessFearAndGreedIndex) {
this.tabs.push({
iconName: 'newspaper-outline',
label: $localize`Markets`,
path: 'market'
});
}
) || !!systemMessage;
this.changeDetectorRef.markForCheck();
}

1
apps/client/src/app/pages/home/home-page.html
View File

@ -12,6 +12,7 @@
routerLinkActive
[active]="rla.isActive"
[routerLink]="tab.path"
[routerLinkActiveOptions]="{ exact: true }"
>
<ion-icon size="large" [name]="tab.iconName"></ion-icon>
<div class="d-none d-sm-block ml-2">{{ tab.label }}</div>

3
apps/client/src/app/pages/portfolio/portfolio-page-routing.module.ts
View File

@ -8,9 +8,8 @@ const routes: Routes = [
{
canActivate: [AuthGuard],
children: [
{ path: '', redirectTo: 'analysis', pathMatch: 'full' },
{
path: 'analysis',
path: '',
loadChildren: () =>
import('./analysis/analysis-page.module').then(
(m) => m.AnalysisPageModule

23
apps/client/src/app/pages/portfolio/portfolio-page.component.ts
View File

@ -7,7 +7,11 @@ import {
} from '@angular/core';
import { DataService } from '@ghostfolio/client/services/data.service';
import { UserService } from '@ghostfolio/client/services/user/user.service';
import { InfoItem, User } from '@ghostfolio/common/interfaces';
import {
InfoItem,
TabConfiguration,
User
} from '@ghostfolio/common/interfaces';
import { hasPermission, permissions } from '@ghostfolio/common/permissions';
import { Subject } from 'rxjs';
import { takeUntil } from 'rxjs/operators';
@ -24,12 +28,7 @@ export class PortfolioPageComponent implements OnDestroy, OnInit {
public hasMessage: boolean;
public info: InfoItem;
public tabs: {
iconName: string;
label: string;
path: string;
showCondition?: boolean;
}[] = [];
public tabs: TabConfiguration[] = [];
public user: User;
private unsubscribeSubject = new Subject<void>();
@ -49,27 +48,27 @@ export class PortfolioPageComponent implements OnDestroy, OnInit {
{
iconName: 'analytics-outline',
label: $localize`Analysis`,
path: 'analysis'
path: ['/portfolio']
},
{
iconName: 'wallet-outline',
label: $localize`Holdings`,
path: 'holdings'
path: ['/portfolio', 'holdings']
},
{
iconName: 'swap-vertical-outline',
label: $localize`Activities`,
path: 'activities'
path: ['/portfolio', 'activities']
},
{
iconName: 'pie-chart-outline',
label: $localize`Allocations`,
path: 'allocations'
path: ['/portfolio', 'allocations']
},
{
iconName: 'calculator-outline',
label: 'FIRE / X-ray',
path: 'fire'
path: ['/portfolio', 'fire']
}
];
this.user = state.user;

1
apps/client/src/app/pages/portfolio/portfolio-page.html
View File

@ -12,6 +12,7 @@
routerLinkActive
[active]="rla.isActive"
[routerLink]="tab.path"
[routerLinkActiveOptions]="{ exact: true }"
>
<ion-icon size="large" [name]="tab.iconName"></ion-icon>
<div class="d-none d-sm-block ml-2">{{ tab.label }}</div>

3
apps/client/src/app/pages/zen/zen-page-routing.module.ts
View File

@ -10,8 +10,7 @@ const routes: Routes = [
{
canActivate: [AuthGuard],
children: [
{ path: '', redirectTo: 'overview', pathMatch: 'full' },
{ path: 'overview', component: HomeOverviewComponent },
{ path: '', component: HomeOverviewComponent },
{ path: 'holdings', component: HomeHoldingsComponent }
],
component: ZenPageComponent,

13
apps/client/src/app/pages/zen/zen-page.component.ts
View File

@ -8,7 +8,7 @@ import {
} from '@angular/core';
import { ActivatedRoute } from '@angular/router';
import { UserService } from '@ghostfolio/client/services/user/user.service';
import { User } from '@ghostfolio/common/interfaces';
import { TabConfiguration, User } from '@ghostfolio/common/interfaces';
import { Subject } from 'rxjs';
import { first, takeUntil } from 'rxjs/operators';
@ -18,12 +18,7 @@ import { first, takeUntil } from 'rxjs/operators';
styleUrls: ['./zen-page.scss']
})
export class ZenPageComponent implements AfterViewInit, OnDestroy, OnInit {
public tabs: {
iconName: string;
label: string;
path: string;
showCondition?: boolean;
}[] = [];
public tabs: TabConfiguration[] = [];
public user: User;
private unsubscribeSubject = new Subject<void>();
@ -42,12 +37,12 @@ export class ZenPageComponent implements AfterViewInit, OnDestroy, OnInit {
{
iconName: 'analytics-outline',
label: $localize`Overview`,
path: 'overview'
path: ['/zen']
},
{
iconName: 'wallet-outline',
label: $localize`Holdings`,
path: 'holdings'
path: ['/zen', 'holdings']
}
];
this.user = state.user;

1
apps/client/src/app/pages/zen/zen-page.html
View File

@ -12,6 +12,7 @@
routerLinkActive
[active]="rla.isActive"
[routerLink]="tab.path"
[routerLinkActiveOptions]="{ exact: true }"
>
<ion-icon size="large" [name]="tab.iconName"></ion-icon>
<div class="d-none d-sm-block ml-2">{{ tab.label }}</div>

2
libs/common/src/lib/interfaces/index.ts
View File

@ -40,6 +40,7 @@ import type { PortfolioPerformanceResponse } from './responses/portfolio-perform
import type { ScraperConfiguration } from './scraper-configuration.interface';
import type { Statistics } from './statistics.interface';
import type { Subscription } from './subscription.interface';
import { TabConfiguration } from './tab-configuration.interface';
import type { TimelinePosition } from './timeline-position.interface';
import type { UniqueAsset } from './unique-asset.interface';
import type { UserSettings } from './user-settings.interface';
@ -86,6 +87,7 @@ export {
ScraperConfiguration,
Statistics,
Subscription,
TabConfiguration,
TimelinePosition,
UniqueAsset,
User,

6
libs/common/src/lib/interfaces/tab-configuration.interface.ts Normal file
View File

@ -0,0 +1,6 @@
export interface TabConfiguration {
iconName: string;
label: string;
path: string[];
showCondition?: boolean;
}