Migrate UI components to standalone (#3302)

pull/3304/head
Thomas Kaul 4 weeks ago committed by GitHub
parent b6ad362850
commit bed9ae916c
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194

@ -1,4 +1,4 @@
import { GfLogoModule } from '@ghostfolio/ui/logo';
import { GfLogoComponent } from '@ghostfolio/ui/logo';
import { Platform } from '@angular/cdk/platform';
import { HttpClientModule } from '@angular/common/http';
@ -43,7 +43,7 @@ export function NgxStripeFactory(): string {
BrowserAnimationsModule,
BrowserModule,
GfHeaderModule,
GfLogoModule,
GfLogoComponent,
GfSubscriptionInterstitialDialogModule,
HttpClientModule,
MarkdownModule.forRoot(),

@ -1,7 +1,7 @@
import { GfDialogFooterModule } from '@ghostfolio/client/components/dialog-footer/dialog-footer.module';
import { GfDialogHeaderModule } from '@ghostfolio/client/components/dialog-header/dialog-header.module';
import { GfInvestmentChartModule } from '@ghostfolio/client/components/investment-chart/investment-chart.module';
import { GfAccountBalancesModule } from '@ghostfolio/ui/account-balances';
import { GfAccountBalancesComponent } from '@ghostfolio/ui/account-balances';
import { GfActivitiesTableComponent } from '@ghostfolio/ui/activities-table';
import { GfHoldingsTableComponent } from '@ghostfolio/ui/holdings-table';
import { GfValueComponent } from '@ghostfolio/ui/value';
@ -19,7 +19,7 @@ import { AccountDetailDialog } from './account-detail-dialog.component';
declarations: [AccountDetailDialog],
imports: [
CommonModule,
GfAccountBalancesModule,
GfAccountBalancesComponent,
GfActivitiesTableComponent,
GfDialogFooterModule,
GfDialogHeaderModule,

@ -1,4 +1,4 @@
import { GfLineChartModule } from '@ghostfolio/ui/line-chart';
import { GfLineChartComponent } from '@ghostfolio/ui/line-chart';
import { CommonModule } from '@angular/common';
import { CUSTOM_ELEMENTS_SCHEMA, NgModule } from '@angular/core';
@ -9,7 +9,7 @@ import { GfMarketDataDetailDialogModule } from './market-data-detail-dialog/mark
@NgModule({
declarations: [AdminMarketDataDetailComponent],
exports: [AdminMarketDataDetailComponent],
imports: [CommonModule, GfLineChartModule, GfMarketDataDetailDialogModule],
imports: [CommonModule, GfLineChartComponent, GfMarketDataDetailDialogModule],
schemas: [CUSTOM_ELEMENTS_SCHEMA]
})
export class GfAdminMarketDataDetailModule {}

@ -1,5 +1,5 @@
import { GfSymbolModule } from '@ghostfolio/client/pipes/symbol/symbol.module';
import { GfActivitiesFilterModule } from '@ghostfolio/ui/activities-filter';
import { GfActivitiesFilterComponent } from '@ghostfolio/ui/activities-filter';
import { CommonModule } from '@angular/common';
import { CUSTOM_ELEMENTS_SCHEMA, NgModule } from '@angular/core';
@ -20,7 +20,7 @@ import { GfCreateAssetProfileDialogModule } from './create-asset-profile-dialog/
declarations: [AdminMarketDataComponent],
imports: [
CommonModule,
GfActivitiesFilterModule,
GfActivitiesFilterComponent,
GfAssetProfileDialogModule,
GfCreateAssetProfileDialogModule,
GfSymbolModule,

@ -2,7 +2,7 @@ import { GfAdminMarketDataDetailModule } from '@ghostfolio/client/components/adm
import { AdminMarketDataService } from '@ghostfolio/client/components/admin-market-data/admin-market-data.service';
import { GfAssetProfileIconComponent } from '@ghostfolio/client/components/asset-profile-icon/asset-profile-icon.component';
import { GfCurrencySelectorComponent } from '@ghostfolio/ui/currency-selector';
import { GfPortfolioProportionChartModule } from '@ghostfolio/ui/portfolio-proportion-chart';
import { GfPortfolioProportionChartComponent } from '@ghostfolio/ui/portfolio-proportion-chart';
import { GfValueComponent } from '@ghostfolio/ui/value';
import { TextFieldModule } from '@angular/cdk/text-field';
@ -27,7 +27,7 @@ import { AssetProfileDialog } from './asset-profile-dialog.component';
GfAdminMarketDataDetailModule,
GfAssetProfileIconComponent,
GfCurrencySelectorComponent,
GfPortfolioProportionChartModule,
GfPortfolioProportionChartComponent,
GfValueComponent,
MatButtonModule,
MatCheckboxModule,

@ -12,7 +12,7 @@ import { UserService } from '@ghostfolio/client/services/user/user.service';
import { Filter, InfoItem, User } from '@ghostfolio/common/interfaces';
import { hasPermission, permissions } from '@ghostfolio/common/permissions';
import { DateRange } from '@ghostfolio/common/types';
import { AssistantComponent } from '@ghostfolio/ui/assistant/assistant.component';
import { GfAssistantComponent } from '@ghostfolio/ui/assistant/assistant.component';
import {
ChangeDetectionStrategy,
@ -62,7 +62,7 @@ export class HeaderComponent implements OnChanges {
@Output() signOut = new EventEmitter<void>();
@ViewChild('assistant') assistantElement: AssistantComponent;
@ViewChild('assistant') assistantElement: GfAssistantComponent;
@ViewChild('assistantTrigger') assistentMenuTriggerElement: MatMenuTrigger;
public hasPermissionForSocialLogin: boolean;

@ -1,6 +1,6 @@
import { LoginWithAccessTokenDialogModule } from '@ghostfolio/client/components/login-with-access-token-dialog/login-with-access-token-dialog.module';
import { GfAssistantModule } from '@ghostfolio/ui/assistant';
import { GfLogoModule } from '@ghostfolio/ui/logo';
import { GfAssistantComponent } from '@ghostfolio/ui/assistant';
import { GfLogoComponent } from '@ghostfolio/ui/logo';
import { GfPremiumIndicatorComponent } from '@ghostfolio/ui/premium-indicator';
import { CommonModule } from '@angular/common';
@ -17,8 +17,8 @@ import { HeaderComponent } from './header.component';
exports: [HeaderComponent],
imports: [
CommonModule,
GfAssistantModule,
GfLogoModule,
GfAssistantComponent,
GfLogoComponent,
GfPremiumIndicatorComponent,
LoginWithAccessTokenDialogModule,
MatButtonModule,

@ -1,6 +1,6 @@
import { GfFearAndGreedIndexModule } from '@ghostfolio/client/components/fear-and-greed-index/fear-and-greed-index.module';
import { GfBenchmarkModule } from '@ghostfolio/ui/benchmark/benchmark.module';
import { GfLineChartModule } from '@ghostfolio/ui/line-chart';
import { GfBenchmarkComponent } from '@ghostfolio/ui/benchmark';
import { GfLineChartComponent } from '@ghostfolio/ui/line-chart';
import { CommonModule } from '@angular/common';
import { CUSTOM_ELEMENTS_SCHEMA, NgModule } from '@angular/core';
@ -13,9 +13,9 @@ import { HomeMarketComponent } from './home-market.component';
exports: [HomeMarketComponent],
imports: [
CommonModule,
GfBenchmarkModule,
GfBenchmarkComponent,
GfFearAndGreedIndexModule,
GfLineChartModule,
GfLineChartComponent,
NgxSkeletonLoaderModule
],
schemas: [CUSTOM_ELEMENTS_SCHEMA]

@ -1,5 +1,5 @@
import { GfPortfolioPerformanceModule } from '@ghostfolio/client/components/portfolio-performance/portfolio-performance.module';
import { GfLineChartModule } from '@ghostfolio/ui/line-chart';
import { GfLineChartComponent } from '@ghostfolio/ui/line-chart';
import { GfNoTransactionsInfoComponent } from '@ghostfolio/ui/no-transactions-info';
import { CommonModule } from '@angular/common';
@ -13,7 +13,7 @@ import { HomeOverviewComponent } from './home-overview.component';
declarations: [HomeOverviewComponent],
imports: [
CommonModule,
GfLineChartModule,
GfLineChartComponent,
GfNoTransactionsInfoComponent,
GfPortfolioPerformanceModule,
MatButtonModule,

@ -2,9 +2,9 @@ import { GfAccountsTableModule } from '@ghostfolio/client/components/accounts-ta
import { GfDialogFooterModule } from '@ghostfolio/client/components/dialog-footer/dialog-footer.module';
import { GfDialogHeaderModule } from '@ghostfolio/client/components/dialog-header/dialog-header.module';
import { GfActivitiesTableComponent } from '@ghostfolio/ui/activities-table';
import { GfDataProviderCreditsModule } from '@ghostfolio/ui/data-provider-credits/data-provider-credits.module';
import { GfLineChartModule } from '@ghostfolio/ui/line-chart';
import { GfPortfolioProportionChartModule } from '@ghostfolio/ui/portfolio-proportion-chart';
import { GfDataProviderCreditsComponent } from '@ghostfolio/ui/data-provider-credits';
import { GfLineChartComponent } from '@ghostfolio/ui/line-chart';
import { GfPortfolioProportionChartComponent } from '@ghostfolio/ui/portfolio-proportion-chart';
import { GfValueComponent } from '@ghostfolio/ui/value';
import { CommonModule } from '@angular/common';
@ -23,11 +23,11 @@ import { PositionDetailDialog } from './position-detail-dialog.component';
CommonModule,
GfAccountsTableModule,
GfActivitiesTableComponent,
GfDataProviderCreditsModule,
GfDataProviderCreditsComponent,
GfDialogFooterModule,
GfDialogHeaderModule,
GfLineChartModule,
GfPortfolioProportionChartModule,
GfLineChartComponent,
GfPortfolioProportionChartComponent,
GfValueComponent,
MatButtonModule,
MatChipsModule,

@ -1,4 +1,4 @@
import { GfMembershipCardModule } from '@ghostfolio/ui/membership-card';
import { GfMembershipCardComponent } from '@ghostfolio/ui/membership-card';
import { GfPremiumIndicatorComponent } from '@ghostfolio/ui/premium-indicator';
import { GfValueComponent } from '@ghostfolio/ui/value';
@ -15,7 +15,7 @@ import { UserAccountMembershipComponent } from './user-account-membership.compon
exports: [UserAccountMembershipComponent],
imports: [
CommonModule,
GfMembershipCardModule,
GfMembershipCardComponent,
GfPremiumIndicatorComponent,
GfValueComponent,
MatButtonModule,

@ -1,6 +1,6 @@
import { GfWorldMapChartModule } from '@ghostfolio/client/components/world-map-chart/world-map-chart.module';
import { GfCarouselModule } from '@ghostfolio/ui/carousel';
import { GfLogoModule } from '@ghostfolio/ui/logo';
import { GfCarouselComponent } from '@ghostfolio/ui/carousel';
import { GfLogoComponent } from '@ghostfolio/ui/logo';
import { GfValueComponent } from '@ghostfolio/ui/value';
import { CommonModule } from '@angular/common';
@ -16,8 +16,8 @@ import { LandingPageComponent } from './landing-page.component';
declarations: [LandingPageComponent],
imports: [
CommonModule,
GfCarouselModule,
GfLogoModule,
GfCarouselComponent,
GfLogoComponent,
GfValueComponent,
GfWorldMapChartModule,
LandingPageRoutingModule,

@ -1,5 +1,5 @@
import { GfWorldMapChartModule } from '@ghostfolio/client/components/world-map-chart/world-map-chart.module';
import { GfPortfolioProportionChartModule } from '@ghostfolio/ui/portfolio-proportion-chart';
import { GfPortfolioProportionChartComponent } from '@ghostfolio/ui/portfolio-proportion-chart';
import { GfPremiumIndicatorComponent } from '@ghostfolio/ui/premium-indicator';
import { GfValueComponent } from '@ghostfolio/ui/value';
@ -17,7 +17,7 @@ import { AllocationsPageComponent } from './allocations-page.component';
imports: [
AllocationsPageRoutingModule,
CommonModule,
GfPortfolioProportionChartModule,
GfPortfolioProportionChartComponent,
GfPremiumIndicatorComponent,
GfWorldMapChartModule,
GfValueComponent,

@ -1,7 +1,7 @@
import { GfBenchmarkComparatorModule } from '@ghostfolio/client/components/benchmark-comparator/benchmark-comparator.module';
import { GfInvestmentChartModule } from '@ghostfolio/client/components/investment-chart/investment-chart.module';
import { GfToggleModule } from '@ghostfolio/client/components/toggle/toggle.module';
import { GfActivitiesFilterModule } from '@ghostfolio/ui/activities-filter';
import { GfActivitiesFilterComponent } from '@ghostfolio/ui/activities-filter';
import { GfPremiumIndicatorComponent } from '@ghostfolio/ui/premium-indicator';
import { GfValueComponent } from '@ghostfolio/ui/value';
@ -18,7 +18,7 @@ import { AnalysisPageComponent } from './analysis-page.component';
imports: [
AnalysisPageRoutingModule,
CommonModule,
GfActivitiesFilterModule,
GfActivitiesFilterComponent,
GfBenchmarkComparatorModule,
GfInvestmentChartModule,
GfPremiumIndicatorComponent,

@ -1,6 +1,6 @@
import { GfWorldMapChartModule } from '@ghostfolio/client/components/world-map-chart/world-map-chart.module';
import { GfHoldingsTableComponent } from '@ghostfolio/ui/holdings-table';
import { GfPortfolioProportionChartModule } from '@ghostfolio/ui/portfolio-proportion-chart';
import { GfPortfolioProportionChartComponent } from '@ghostfolio/ui/portfolio-proportion-chart';
import { GfValueComponent } from '@ghostfolio/ui/value';
import { CommonModule } from '@angular/common';
@ -16,7 +16,7 @@ import { PublicPageComponent } from './public-page.component';
imports: [
CommonModule,
GfHoldingsTableComponent,
GfPortfolioProportionChartModule,
GfPortfolioProportionChartComponent,
GfValueComponent,
GfWorldMapChartModule,
MatButtonModule,

@ -1,4 +1,4 @@
import { GfLogoModule } from '@ghostfolio/ui/logo';
import { GfLogoComponent } from '@ghostfolio/ui/logo';
import { CommonModule } from '@angular/common';
import { CUSTOM_ELEMENTS_SCHEMA, NgModule } from '@angular/core';
@ -13,7 +13,7 @@ import { ShowAccessTokenDialogModule } from './show-access-token-dialog/show-acc
declarations: [RegisterPageComponent],
imports: [
CommonModule,
GfLogoModule,
GfLogoComponent,
MatButtonModule,
RegisterPageRoutingModule,
RouterModule,

@ -1,5 +1,5 @@
import { WebauthnPageComponent } from '@ghostfolio/client/pages/webauthn/webauthn-page.component';
import { GfLogoModule } from '@ghostfolio/ui/logo';
import { GfLogoComponent } from '@ghostfolio/ui/logo';
import { CommonModule } from '@angular/common';
import { NgModule } from '@angular/core';
@ -12,7 +12,7 @@ import { WebauthnPageRoutingModule } from './webauthn-page-routing.module';
declarations: [WebauthnPageComponent],
imports: [
CommonModule,
GfLogoModule,
GfLogoComponent,
MatButtonModule,
MatProgressSpinnerModule,
WebauthnPageRoutingModule

@ -1,7 +1,9 @@
import { getLocale } from '@ghostfolio/common/helper';
import { AccountBalancesResponse } from '@ghostfolio/common/interfaces';
import { CommonModule } from '@angular/common';
import {
CUSTOM_ELEMENTS_SCHEMA,
ChangeDetectionStrategy,
Component,
EventEmitter,
@ -12,18 +14,34 @@ import {
Output,
ViewChild
} from '@angular/core';
import { MatSort } from '@angular/material/sort';
import { MatTableDataSource } from '@angular/material/table';
import { MatButtonModule } from '@angular/material/button';
import { MatMenuModule } from '@angular/material/menu';
import { MatSort, MatSortModule } from '@angular/material/sort';
import { MatTableDataSource, MatTableModule } from '@angular/material/table';
import { get } from 'lodash';
import { Subject } from 'rxjs';
import { GfValueComponent } from '../value';
@Component({
changeDetection: ChangeDetectionStrategy.OnPush,
imports: [
CommonModule,
GfValueComponent,
MatButtonModule,
MatMenuModule,
MatSortModule,
MatTableModule
],
schemas: [CUSTOM_ELEMENTS_SCHEMA],
selector: 'gf-account-balances',
standalone: true,
styleUrls: ['./account-balances.component.scss'],
templateUrl: './account-balances.component.html'
})
export class AccountBalancesComponent implements OnChanges, OnDestroy, OnInit {
export class GfAccountBalancesComponent
implements OnChanges, OnDestroy, OnInit
{
@Input() accountBalances: AccountBalancesResponse['balances'];
@Input() accountId: string;
@Input() locale = getLocale();

@ -1,25 +0,0 @@
import { GfValueComponent } from '@ghostfolio/ui/value';
import { CommonModule } from '@angular/common';
import { CUSTOM_ELEMENTS_SCHEMA, NgModule } from '@angular/core';
import { MatButtonModule } from '@angular/material/button';
import { MatMenuModule } from '@angular/material/menu';
import { MatSortModule } from '@angular/material/sort';
import { MatTableModule } from '@angular/material/table';
import { AccountBalancesComponent } from './account-balances.component';
@NgModule({
declarations: [AccountBalancesComponent],
exports: [AccountBalancesComponent],
imports: [
CommonModule,
GfValueComponent,
MatButtonModule,
MatMenuModule,
MatSortModule,
MatTableModule
],
schemas: [CUSTOM_ELEMENTS_SCHEMA]
})
export class GfAccountBalancesModule {}

@ -1 +1 @@
export * from './account-balances.module';
export * from './account-balances.component';

@ -1,8 +1,11 @@
import { GfSymbolModule } from '@ghostfolio/client/pipes/symbol/symbol.module';
import { Filter, FilterGroup } from '@ghostfolio/common/interfaces';
import { translate } from '@ghostfolio/ui/i18n';
import { COMMA, ENTER } from '@angular/cdk/keycodes';
import { CommonModule } from '@angular/common';
import {
CUSTOM_ELEMENTS_SCHEMA,
ChangeDetectionStrategy,
Component,
ElementRef,
@ -14,23 +17,39 @@ import {
SimpleChanges,
ViewChild
} from '@angular/core';
import { FormControl } from '@angular/forms';
import { FormControl, ReactiveFormsModule } from '@angular/forms';
import {
MatAutocomplete,
MatAutocompleteModule,
MatAutocompleteSelectedEvent
} from '@angular/material/autocomplete';
import { MatChipInputEvent } from '@angular/material/chips';
import { MatButtonModule } from '@angular/material/button';
import { MatChipInputEvent, MatChipsModule } from '@angular/material/chips';
import { MatInputModule } from '@angular/material/input';
import { MatProgressSpinnerModule } from '@angular/material/progress-spinner';
import { groupBy } from 'lodash';
import { BehaviorSubject, Observable, Subject } from 'rxjs';
import { takeUntil } from 'rxjs/operators';
@Component({
changeDetection: ChangeDetectionStrategy.OnPush,
imports: [
CommonModule,
GfSymbolModule,
MatAutocompleteModule,
MatButtonModule,
MatChipsModule,
MatInputModule,
MatProgressSpinnerModule,
ReactiveFormsModule
],
schemas: [CUSTOM_ELEMENTS_SCHEMA],
selector: 'gf-activities-filter',
standalone: true,
styleUrls: ['./activities-filter.component.scss'],
templateUrl: './activities-filter.component.html'
})
export class ActivitiesFilterComponent implements OnChanges, OnDestroy {
export class GfActivitiesFilterComponent implements OnChanges, OnDestroy {
@Input() allFilters: Filter[];
@Input() isLoading: boolean;
@Input() placeholder: string;

@ -1,29 +0,0 @@
import { GfSymbolModule } from '@ghostfolio/client/pipes/symbol/symbol.module';
import { CommonModule } from '@angular/common';
import { CUSTOM_ELEMENTS_SCHEMA, NgModule } from '@angular/core';
import { ReactiveFormsModule } from '@angular/forms';
import { MatAutocompleteModule } from '@angular/material/autocomplete';
import { MatButtonModule } from '@angular/material/button';
import { MatChipsModule } from '@angular/material/chips';
import { MatInputModule } from '@angular/material/input';
import { MatProgressSpinnerModule } from '@angular/material/progress-spinner';
import { ActivitiesFilterComponent } from './activities-filter.component';
@NgModule({
declarations: [ActivitiesFilterComponent],
exports: [ActivitiesFilterComponent],
imports: [
CommonModule,
GfSymbolModule,
MatAutocompleteModule,
MatButtonModule,
MatChipsModule,
MatInputModule,
MatProgressSpinnerModule,
ReactiveFormsModule
],
schemas: [CUSTOM_ELEMENTS_SCHEMA]
})
export class GfActivitiesFilterModule {}

@ -1 +1 @@
export * from './activities-filter.module';
export * from './activities-filter.component';

@ -5,7 +5,7 @@ import { DEFAULT_PAGE_SIZE } from '@ghostfolio/common/config';
import { getDateFormatString, getLocale } from '@ghostfolio/common/helper';
import { UniqueAsset } from '@ghostfolio/common/interfaces';
import { OrderWithAccount } from '@ghostfolio/common/types';
import { GfActivityTypeModule } from '@ghostfolio/ui/activity-type';
import { GfActivityTypeComponent } from '@ghostfolio/ui/activity-type';
import { GfNoTransactionsInfoComponent } from '@ghostfolio/ui/no-transactions-info';
import { GfValueComponent } from '@ghostfolio/ui/value';
@ -50,7 +50,7 @@ import { Subject, Subscription, takeUntil } from 'rxjs';
changeDetection: ChangeDetectionStrategy.OnPush,
imports: [
CommonModule,
GfActivityTypeModule,
GfActivityTypeComponent,
GfAssetProfileIconComponent,
GfNoTransactionsInfoComponent,
GfSymbolModule,

@ -1,6 +1,8 @@
import { translate } from '@ghostfolio/ui/i18n';
import { CommonModule } from '@angular/common';
import {
CUSTOM_ELEMENTS_SCHEMA,
ChangeDetectionStrategy,
Component,
Input,
@ -10,11 +12,14 @@ import { Type as ActivityType } from '@prisma/client';
@Component({
changeDetection: ChangeDetectionStrategy.OnPush,
imports: [CommonModule],
schemas: [CUSTOM_ELEMENTS_SCHEMA],
selector: 'gf-activity-type',
standalone: true,
styleUrls: ['./activity-type.component.scss'],
templateUrl: './activity-type.component.html'
})
export class ActivityTypeComponent implements OnChanges {
export class GfActivityTypeComponent implements OnChanges {
@Input() activityType: ActivityType;
public activityTypeLabel: string;

@ -1,12 +0,0 @@
import { CommonModule } from '@angular/common';
import { CUSTOM_ELEMENTS_SCHEMA, NgModule } from '@angular/core';
import { ActivityTypeComponent } from './activity-type.component';
@NgModule({
declarations: [ActivityTypeComponent],
exports: [ActivityTypeComponent],
imports: [CommonModule],
schemas: [CUSTOM_ELEMENTS_SCHEMA]
})
export class GfActivityTypeModule {}

@ -1 +1 @@
export * from './activity-type.module';
export * from './activity-type.component';

@ -1,6 +1,8 @@
import { GfSymbolModule } from '@ghostfolio/client/pipes/symbol/symbol.module';
import { ISearchResultItem } from '@ghostfolio/ui/assistant/interfaces/interfaces';
import { FocusableOption } from '@angular/cdk/a11y';
import { CommonModule } from '@angular/common';
import {
ChangeDetectionStrategy,
ChangeDetectorRef,
@ -13,15 +15,19 @@ import {
Output,
ViewChild
} from '@angular/core';
import { Params } from '@angular/router';
import { Params, RouterModule } from '@angular/router';
@Component({
changeDetection: ChangeDetectionStrategy.OnPush,
imports: [CommonModule, GfSymbolModule, RouterModule],
selector: 'gf-assistant-list-item',
templateUrl: './assistant-list-item.html',
styleUrls: ['./assistant-list-item.scss']
standalone: true,
styleUrls: ['./assistant-list-item.scss'],
templateUrl: './assistant-list-item.html'
})
export class AssistantListItemComponent implements FocusableOption, OnChanges {
export class GfAssistantListItemComponent
implements FocusableOption, OnChanges
{
@HostBinding('attr.tabindex') tabindex = -1;
@HostBinding('class.has-focus') get getHasFocus() {
return this.hasFocus;

@ -1,14 +0,0 @@
import { GfSymbolModule } from '@ghostfolio/client/pipes/symbol/symbol.module';
import { CommonModule } from '@angular/common';
import { NgModule } from '@angular/core';
import { RouterModule } from '@angular/router';
import { AssistantListItemComponent } from './assistant-list-item.component';
@NgModule({
declarations: [AssistantListItemComponent],
exports: [AssistantListItemComponent],
imports: [CommonModule, GfSymbolModule, RouterModule]
})
export class GfAssistantListItemModule {}

@ -1,3 +1,4 @@
import { GfAssetProfileIconComponent } from '@ghostfolio/client/components/asset-profile-icon/asset-profile-icon.component';
import { AdminService } from '@ghostfolio/client/services/admin.service';
import { DataService } from '@ghostfolio/client/services/data.service';
import { Filter, User } from '@ghostfolio/common/interfaces';
@ -5,7 +6,9 @@ import { DateRange } from '@ghostfolio/common/types';
import { translate } from '@ghostfolio/ui/i18n';
import { FocusKeyManager } from '@angular/cdk/a11y';
import { CommonModule } from '@angular/common';
import {
CUSTOM_ELEMENTS_SCHEMA,
ChangeDetectionStrategy,
ChangeDetectorRef,
Component,
@ -21,10 +24,20 @@ import {
ViewChild,
ViewChildren
} from '@angular/core';
import { FormBuilder, FormControl } from '@angular/forms';
import {
FormBuilder,
FormControl,
FormsModule,
ReactiveFormsModule
} from '@angular/forms';
import { MatButtonModule } from '@angular/material/button';
import { MatFormFieldModule } from '@angular/material/form-field';
import { MatMenuTrigger } from '@angular/material/menu';
import { MatSelectModule } from '@angular/material/select';
import { RouterModule } from '@angular/router';
import { Account, AssetClass } from '@prisma/client';
import { eachYearOfInterval, format } from 'date-fns';
import { NgxSkeletonLoaderModule } from 'ngx-skeleton-loader';
import { EMPTY, Observable, Subject, lastValueFrom } from 'rxjs';
import {
catchError,
@ -35,7 +48,7 @@ import {
takeUntil
} from 'rxjs/operators';
import { AssistantListItemComponent } from './assistant-list-item/assistant-list-item.component';
import { GfAssistantListItemComponent } from './assistant-list-item/assistant-list-item.component';
import {
IDateRangeOption,
ISearchResultItem,
@ -44,11 +57,25 @@ import {
@Component({
changeDetection: ChangeDetectionStrategy.OnPush,
imports: [
CommonModule,
FormsModule,
GfAssetProfileIconComponent,
GfAssistantListItemComponent,
MatButtonModule,
MatFormFieldModule,
MatSelectModule,
NgxSkeletonLoaderModule,
ReactiveFormsModule,
RouterModule
],
schemas: [CUSTOM_ELEMENTS_SCHEMA],
selector: 'gf-assistant',
standalone: true,
styleUrls: ['./assistant.scss'],
templateUrl: './assistant.html'
})
export class AssistantComponent implements OnChanges, OnDestroy, OnInit {
export class GfAssistantComponent implements OnChanges, OnDestroy, OnInit {
@HostListener('document:keydown', ['$event']) onKeydown(
event: KeyboardEvent
) {
@ -92,8 +119,8 @@ export class AssistantComponent implements OnChanges, OnDestroy, OnInit {
@ViewChild('menuTrigger') menuTriggerElement: MatMenuTrigger;
@ViewChild('search', { static: true }) searchElement: ElementRef;
@ViewChildren(AssistantListItemComponent)
assistantListItems: QueryList<AssistantListItemComponent>;
@ViewChildren(GfAssistantListItemComponent)
assistantListItems: QueryList<GfAssistantListItemComponent>;
public static readonly SEARCH_RESULTS_DEFAULT_LIMIT = 5;
@ -117,7 +144,7 @@ export class AssistantComponent implements OnChanges, OnDestroy, OnInit {
public tags: Filter[] = [];
private filterTypes: Filter['type'][] = ['ACCOUNT', 'ASSET_CLASS', 'TAG'];
private keyManager: FocusKeyManager<AssistantListItemComponent>;
private keyManager: FocusKeyManager<GfAssistantListItemComponent>;
private unsubscribeSubject = new Subject<void>();
public constructor(
@ -334,7 +361,7 @@ export class AssistantComponent implements OnChanges, OnDestroy, OnInit {
);
assetProfiles = assetProfiles.slice(
0,
AssistantComponent.SEARCH_RESULTS_DEFAULT_LIMIT
GfAssistantComponent.SEARCH_RESULTS_DEFAULT_LIMIT
);
} catch {}
}
@ -343,7 +370,7 @@ export class AssistantComponent implements OnChanges, OnDestroy, OnInit {
holdings = await lastValueFrom(this.searchHoldings(aSearchTerm));
holdings = holdings.slice(
0,
AssistantComponent.SEARCH_RESULTS_DEFAULT_LIMIT
GfAssistantComponent.SEARCH_RESULTS_DEFAULT_LIMIT
);
} catch {}
@ -364,7 +391,7 @@ export class AssistantComponent implements OnChanges, OnDestroy, OnInit {
type: 'SEARCH_QUERY'
}
],
take: AssistantComponent.SEARCH_RESULTS_DEFAULT_LIMIT
take: GfAssistantComponent.SEARCH_RESULTS_DEFAULT_LIMIT
})
.pipe(
catchError(() => {

@ -1,32 +0,0 @@
import { GfAssetProfileIconComponent } from '@ghostfolio/client/components/asset-profile-icon/asset-profile-icon.component';
import { CommonModule } from '@angular/common';
import { CUSTOM_ELEMENTS_SCHEMA, NgModule } from '@angular/core';
import { FormsModule, ReactiveFormsModule } from '@angular/forms';
import { MatButtonModule } from '@angular/material/button';
import { MatFormFieldModule } from '@angular/material/form-field';
import { MatSelectModule } from '@angular/material/select';
import { RouterModule } from '@angular/router';
import { NgxSkeletonLoaderModule } from 'ngx-skeleton-loader';
import { GfAssistantListItemModule } from './assistant-list-item/assistant-list-item.module';
import { AssistantComponent } from './assistant.component';
@NgModule({
declarations: [AssistantComponent],
exports: [AssistantComponent],
imports: [
CommonModule,
FormsModule,
GfAssetProfileIconComponent,
GfAssistantListItemModule,
MatButtonModule,
MatFormFieldModule,
MatSelectModule,
NgxSkeletonLoaderModule,
ReactiveFormsModule,
RouterModule
],
schemas: [CUSTOM_ELEMENTS_SCHEMA]
})
export class GfAssistantModule {}

@ -1 +1 @@
export * from './assistant.module';
export * from './assistant.component';

@ -2,20 +2,36 @@ import { getLocale, resolveMarketCondition } from '@ghostfolio/common/helper';
import { Benchmark, User } from '@ghostfolio/common/interfaces';
import { translate } from '@ghostfolio/ui/i18n';
import { CommonModule } from '@angular/common';
import {
CUSTOM_ELEMENTS_SCHEMA,
ChangeDetectionStrategy,
Component,
Input,
OnChanges
} from '@angular/core';
import { MatTableModule } from '@angular/material/table';
import { NgxSkeletonLoaderModule } from 'ngx-skeleton-loader';
import { GfTrendIndicatorComponent } from '../trend-indicator';
import { GfValueComponent } from '../value';
@Component({
selector: 'gf-benchmark',
changeDetection: ChangeDetectionStrategy.OnPush,
templateUrl: './benchmark.component.html',
styleUrls: ['./benchmark.component.scss']
imports: [
CommonModule,
GfTrendIndicatorComponent,
GfValueComponent,
MatTableModule,
NgxSkeletonLoaderModule
],
schemas: [CUSTOM_ELEMENTS_SCHEMA],
selector: 'gf-benchmark',
standalone: true,
styleUrls: ['./benchmark.component.scss'],
templateUrl: './benchmark.component.html'
})
export class BenchmarkComponent implements OnChanges {
export class GfBenchmarkComponent implements OnChanges {
@Input() benchmarks: Benchmark[];
@Input() locale = getLocale();
@Input() user: User;

@ -1,22 +0,0 @@
import { CommonModule } from '@angular/common';
import { CUSTOM_ELEMENTS_SCHEMA, NgModule } from '@angular/core';
import { MatTableModule } from '@angular/material/table';
import { NgxSkeletonLoaderModule } from 'ngx-skeleton-loader';
import { GfTrendIndicatorComponent } from '../trend-indicator';
import { GfValueComponent } from '../value';
import { BenchmarkComponent } from './benchmark.component';
@NgModule({
declarations: [BenchmarkComponent],
exports: [BenchmarkComponent],
imports: [
CommonModule,
GfTrendIndicatorComponent,
GfValueComponent,
MatTableModule,
NgxSkeletonLoaderModule
],
schemas: [CUSTOM_ELEMENTS_SCHEMA]
})
export class GfBenchmarkModule {}

@ -1 +1 @@
export * from './benchmark.module';
export * from './benchmark.component';

@ -1,7 +1,9 @@
import { FocusKeyManager } from '@angular/cdk/a11y';
import { LEFT_ARROW, RIGHT_ARROW, TAB } from '@angular/cdk/keycodes';
import { CommonModule } from '@angular/common';
import {
AfterContentInit,
CUSTOM_ELEMENTS_SCHEMA,
ChangeDetectionStrategy,
Component,
ContentChildren,
@ -13,17 +15,21 @@ import {
QueryList,
ViewChild
} from '@angular/core';
import { MatButtonModule } from '@angular/material/button';
import { ANIMATION_MODULE_TYPE } from '@angular/platform-browser/animations';
import { CarouselItem } from './carousel-item.directive';
@Component({
changeDetection: ChangeDetectionStrategy.OnPush,
imports: [CommonModule, MatButtonModule],
schemas: [CUSTOM_ELEMENTS_SCHEMA],
selector: 'gf-carousel',
standalone: true,
styleUrls: ['./carousel.component.scss'],
templateUrl: './carousel.component.html'
})
export class CarouselComponent implements AfterContentInit {
export class GfCarouselComponent implements AfterContentInit {
@ContentChildren(CarouselItem) public items!: QueryList<CarouselItem>;
@HostBinding('class.animations-disabled')

@ -1,14 +0,0 @@
import { CommonModule } from '@angular/common';
import { CUSTOM_ELEMENTS_SCHEMA, NgModule } from '@angular/core';
import { MatButtonModule } from '@angular/material/button';
import { CarouselItem } from './carousel-item.directive';
import { CarouselComponent } from './carousel.component';
@NgModule({
declarations: [CarouselComponent, CarouselItem],
exports: [CarouselComponent, CarouselItem],
imports: [CommonModule, MatButtonModule],
schemas: [CUSTOM_ELEMENTS_SCHEMA]
})
export class GfCarouselModule {}

@ -1 +1 @@
export * from './carousel.module';
export * from './carousel.component';

@ -1,14 +1,23 @@
import { DataProviderInfo } from '@ghostfolio/common/interfaces';
import { ChangeDetectionStrategy, Component, Input } from '@angular/core';
import { CommonModule } from '@angular/common';
import {
CUSTOM_ELEMENTS_SCHEMA,
ChangeDetectionStrategy,
Component,
Input
} from '@angular/core';
@Component({
changeDetection: ChangeDetectionStrategy.OnPush,
imports: [CommonModule],
schemas: [CUSTOM_ELEMENTS_SCHEMA],
selector: 'gf-data-provider-credits',
standalone: true,
styleUrls: ['./data-provider-credits.component.scss'],
templateUrl: './data-provider-credits.component.html'
})
export class DataProviderCreditsComponent {
export class GfDataProviderCreditsComponent {
@Input() dataProviderInfos: DataProviderInfo[];
public constructor() {}

@ -1,12 +0,0 @@
import { CommonModule } from '@angular/common';
import { CUSTOM_ELEMENTS_SCHEMA, NgModule } from '@angular/core';
import { DataProviderCreditsComponent } from './data-provider-credits.component';
@NgModule({
declarations: [DataProviderCreditsComponent],
exports: [DataProviderCreditsComponent],
imports: [CommonModule],
schemas: [CUSTOM_ELEMENTS_SCHEMA]
})
export class GfDataProviderCreditsModule {}

@ -1 +1 @@
export * from './data-provider-credits.module';
export * from './data-provider-credits.component';

@ -1 +1 @@
export * from './line-chart.module';
export * from './line-chart.component';

@ -13,6 +13,7 @@ import {
import { LineChartItem } from '@ghostfolio/common/interfaces';
import { ColorScheme } from '@ghostfolio/common/types';
import { CommonModule } from '@angular/common';
import {
AfterViewInit,
ChangeDetectionStrategy,
@ -34,14 +35,19 @@ import {
Tooltip
} from 'chart.js';
import 'chartjs-adapter-date-fns';
import { NgxSkeletonLoaderModule } from 'ngx-skeleton-loader';
@Component({
selector: 'gf-line-chart',
changeDetection: ChangeDetectionStrategy.OnPush,
templateUrl: './line-chart.component.html',
styleUrls: ['./line-chart.component.scss']
imports: [CommonModule, NgxSkeletonLoaderModule],
selector: 'gf-line-chart',
standalone: true,
styleUrls: ['./line-chart.component.scss'],
templateUrl: './line-chart.component.html'
})
export class LineChartComponent implements AfterViewInit, OnChanges, OnDestroy {
export class GfLineChartComponent
implements AfterViewInit, OnChanges, OnDestroy
{
@Input() benchmarkDataItems: LineChartItem[] = [];
@Input() benchmarkLabel = '';
@Input() colorScheme: ColorScheme;

@ -1,12 +0,0 @@
import { CommonModule } from '@angular/common';
import { NgModule } from '@angular/core';
import { NgxSkeletonLoaderModule } from 'ngx-skeleton-loader';
import { LineChartComponent } from './line-chart.component';
@NgModule({
declarations: [LineChartComponent],
exports: [LineChartComponent],
imports: [CommonModule, NgxSkeletonLoaderModule]
})
export class GfLineChartModule {}

@ -1 +1 @@
export * from './logo.module';
export * from './logo.component';

@ -1,4 +1,6 @@
import { CommonModule } from '@angular/common';
import {
CUSTOM_ELEMENTS_SCHEMA,
ChangeDetectionStrategy,
Component,
HostBinding,
@ -6,12 +8,15 @@ import {
} from '@angular/core';
@Component({
selector: 'gf-logo',
changeDetection: ChangeDetectionStrategy.OnPush,
templateUrl: './logo.component.html',
styleUrls: ['./logo.component.scss']
imports: [CommonModule],
schemas: [CUSTOM_ELEMENTS_SCHEMA],
selector: 'gf-logo',
standalone: true,
styleUrls: ['./logo.component.scss'],
templateUrl: './logo.component.html'
})
export class LogoComponent {
export class GfLogoComponent {
@HostBinding('class') @Input() size: 'large' | 'medium' = 'medium';
@Input() label: string;
@Input() showLabel = true;

@ -1,12 +0,0 @@
import { CommonModule } from '@angular/common';
import { CUSTOM_ELEMENTS_SCHEMA, NgModule } from '@angular/core';
import { LogoComponent } from './logo.component';
@NgModule({
declarations: [LogoComponent],
exports: [LogoComponent],
imports: [CommonModule],
schemas: [CUSTOM_ELEMENTS_SCHEMA]
})
export class GfLogoModule {}

@ -1 +1 @@
export * from './membership-card.module';
export * from './membership-card.component';

@ -1,12 +1,24 @@
import { ChangeDetectionStrategy, Component, Input } from '@angular/core';
import { CommonModule } from '@angular/common';
import {
CUSTOM_ELEMENTS_SCHEMA,
ChangeDetectionStrategy,
Component,
Input
} from '@angular/core';
import { RouterModule } from '@angular/router';
import { GfLogoComponent } from '../logo';
@Component({
changeDetection: ChangeDetectionStrategy.OnPush,
imports: [CommonModule, GfLogoComponent, RouterModule],
schemas: [CUSTOM_ELEMENTS_SCHEMA],
selector: 'gf-membership-card',
standalone: true,
styleUrls: ['./membership-card.component.scss'],
templateUrl: './membership-card.component.html'
})
export class MembershipCardComponent {
export class GfMembershipCardComponent {
@Input() public expiresAt: string;
@Input() public name: string;

@ -1,15 +0,0 @@
import { GfLogoModule } from '@ghostfolio/ui/logo';
import { CommonModule } from '@angular/common';
import { CUSTOM_ELEMENTS_SCHEMA, NgModule } from '@angular/core';
import { RouterModule } from '@angular/router';
import { MembershipCardComponent } from './membership-card.component';
@NgModule({
declarations: [MembershipCardComponent],
exports: [MembershipCardComponent],
imports: [CommonModule, GfLogoModule, RouterModule],
schemas: [CUSTOM_ELEMENTS_SCHEMA]
})
export class GfMembershipCardModule {}

@ -9,11 +9,11 @@ import {
import { MatButtonModule } from '@angular/material/button';
import { RouterModule } from '@angular/router';
import { GfLogoModule } from '../logo';
import { GfLogoComponent } from '../logo';
@Component({
changeDetection: ChangeDetectionStrategy.OnPush,
imports: [CommonModule, GfLogoModule, MatButtonModule, RouterModule],
imports: [CommonModule, GfLogoComponent, MatButtonModule, RouterModule],
schemas: [CUSTOM_ELEMENTS_SCHEMA],
selector: 'gf-no-transactions-info-indicator',
standalone: true,

@ -1 +1 @@
export * from './portfolio-proportion-chart.module';
export * from './portfolio-proportion-chart.component';

@ -5,6 +5,7 @@ import { PortfolioPosition, UniqueAsset } from '@ghostfolio/common/interfaces';
import { ColorScheme } from '@ghostfolio/common/types';
import { translate } from '@ghostfolio/ui/i18n';
import { CommonModule } from '@angular/common';
import {
AfterViewInit,
ChangeDetectionStrategy,
@ -26,14 +27,17 @@ import { DoughnutController } from 'chart.js';
import { Chart } from 'chart.js';
import ChartDataLabels from 'chartjs-plugin-datalabels';
import * as Color from 'color';
import { NgxSkeletonLoaderModule } from 'ngx-skeleton-loader';
@Component({
selector: 'gf-portfolio-proportion-chart',
changeDetection: ChangeDetectionStrategy.OnPush,
templateUrl: './portfolio-proportion-chart.component.html',
styleUrls: ['./portfolio-proportion-chart.component.scss']
imports: [CommonModule, NgxSkeletonLoaderModule],
selector: 'gf-portfolio-proportion-chart',
standalone: true,
styleUrls: ['./portfolio-proportion-chart.component.scss'],
templateUrl: './portfolio-proportion-chart.component.html'
})
export class PortfolioProportionChartComponent
export class GfPortfolioProportionChartComponent
implements AfterViewInit, OnChanges, OnDestroy
{
@Input() baseCurrency: string;

@ -1,12 +0,0 @@
import { CommonModule } from '@angular/common';
import { NgModule } from '@angular/core';
import { NgxSkeletonLoaderModule } from 'ngx-skeleton-loader';
import { PortfolioProportionChartComponent } from './portfolio-proportion-chart.component';
@NgModule({
declarations: [PortfolioProportionChartComponent],
exports: [PortfolioProportionChartComponent],
imports: [CommonModule, NgxSkeletonLoaderModule]
})
export class GfPortfolioProportionChartModule {}
Loading…
Cancel
Save