diff --git a/apps/client/src/app/pages/public/public-page.module.ts b/apps/client/src/app/pages/public/public-page.module.ts
index 352bb6180..cf43b1bc0 100644
--- a/apps/client/src/app/pages/public/public-page.module.ts
+++ b/apps/client/src/app/pages/public/public-page.module.ts
@@ -2,7 +2,7 @@ import { CommonModule } from '@angular/common';
import { CUSTOM_ELEMENTS_SCHEMA, NgModule } from '@angular/core';
import { MatButtonModule } from '@angular/material/button';
import { MatCardModule } from '@angular/material/card';
-import { GfPositionsTableModule } from '@ghostfolio/client/components/positions-table/positions-table.module';
+import { GfHoldingsTableModule } from '@ghostfolio/ui/holdings-table/holdings-table.module';
import { GfWorldMapChartModule } from '@ghostfolio/client/components/world-map-chart/world-map-chart.module';
import { GfPortfolioProportionChartModule } from '@ghostfolio/ui/portfolio-proportion-chart/portfolio-proportion-chart.module';
import { GfValueModule } from '@ghostfolio/ui/value';
@@ -14,8 +14,8 @@ import { PublicPageComponent } from './public-page.component';
declarations: [PublicPageComponent],
imports: [
CommonModule,
+ GfHoldingsTableModule,
GfPortfolioProportionChartModule,
- GfPositionsTableModule,
GfValueModule,
GfWorldMapChartModule,
MatButtonModule,
diff --git a/libs/ui/src/lib/holdings-table/holdings-table.component.html b/libs/ui/src/lib/holdings-table/holdings-table.component.html
new file mode 100644
index 000000000..cc76cd687
--- /dev/null
+++ b/libs/ui/src/lib/holdings-table/holdings-table.component.html
@@ -0,0 +1,184 @@
+
+
+
+ |
+
+
+ |
+
+
+
+
+ Name
+ |
+
+
+ {{ element.name }}
+
+
+ {{ element.symbol }}
+
+ |
+
+
+
+
+ First Activity
+ |
+
+
+
+
+ |
+
+
+
+
+ Value
+ |
+
+
+
+
+ |
+
+
+
+
+ Allocation
+ |
+
+
+
+
+ |
+
+
+
+
+ Performance
+ |
+
+
+
+
+ |
+
+
+ |
+ |
+
+
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/libs/ui/src/lib/holdings-table/holdings-table.component.scss b/libs/ui/src/lib/holdings-table/holdings-table.component.scss
new file mode 100644
index 000000000..f0da6525f
--- /dev/null
+++ b/libs/ui/src/lib/holdings-table/holdings-table.component.scss
@@ -0,0 +1,25 @@
+@import '~apps/client/src/styles/ghostfolio-style';
+
+:host {
+ display: block;
+
+ .holdings {
+ overflow-x: auto;
+
+ .mat-table {
+ th {
+ ::ng-deep {
+ .mat-sort-header-container {
+ justify-content: inherit;
+ }
+ }
+ }
+
+ .mat-row {
+ &.cursor-pointer {
+ cursor: pointer;
+ }
+ }
+ }
+ }
+}
diff --git a/apps/client/src/app/components/positions-table/positions-table.component.ts b/libs/ui/src/lib/holdings-table/holdings-table.component.ts
similarity index 90%
rename from apps/client/src/app/components/positions-table/positions-table.component.ts
rename to libs/ui/src/lib/holdings-table/holdings-table.component.ts
index c14c20bce..6a56a9565 100644
--- a/apps/client/src/app/components/positions-table/positions-table.component.ts
+++ b/libs/ui/src/lib/holdings-table/holdings-table.component.ts
@@ -19,12 +19,12 @@ import { AssetClass, Order as OrderModel } from '@prisma/client';
import { Subject, Subscription } from 'rxjs';
@Component({
- selector: 'gf-positions-table',
changeDetection: ChangeDetectionStrategy.OnPush,
- templateUrl: './positions-table.component.html',
- styleUrls: ['./positions-table.component.scss']
+ selector: 'gf-holdings-table',
+ styleUrls: ['./holdings-table.component.scss'],
+ templateUrl: './holdings-table.component.html'
})
-export class PositionsTableComponent implements OnChanges, OnDestroy, OnInit {
+export class HoldingsTableComponent implements OnChanges, OnDestroy, OnInit {
@Input() baseCurrency: string;
@Input() deviceType: string;
@Input() hasPermissionToCreateActivity: boolean;
@@ -56,7 +56,7 @@ export class PositionsTableComponent implements OnChanges, OnDestroy, OnInit {
public ngOnInit() {}
public ngOnChanges() {
- this.displayedColumns = ['icon', 'symbol', 'name', 'dateOfFirstActivity'];
+ this.displayedColumns = ['icon', 'nameWithSymbol', 'dateOfFirstActivity'];
if (this.hasPermissionToShowValues) {
this.displayedColumns.push('value');
diff --git a/apps/client/src/app/components/positions-table/positions-table.module.ts b/libs/ui/src/lib/holdings-table/holdings-table.module.ts
similarity index 82%
rename from apps/client/src/app/components/positions-table/positions-table.module.ts
rename to libs/ui/src/lib/holdings-table/holdings-table.module.ts
index e9be0932e..0986bd1d0 100644
--- a/apps/client/src/app/components/positions-table/positions-table.module.ts
+++ b/libs/ui/src/lib/holdings-table/holdings-table.module.ts
@@ -8,17 +8,17 @@ import { MatSortModule } from '@angular/material/sort';
import { MatTableModule } from '@angular/material/table';
import { RouterModule } from '@angular/router';
import { GfPositionDetailDialogModule } from '@ghostfolio/client/components/position/position-detail-dialog/position-detail-dialog.module';
+import { GfSymbolIconModule } from '@ghostfolio/client/components/symbol-icon/symbol-icon.module';
import { GfSymbolModule } from '@ghostfolio/client/pipes/symbol/symbol.module';
import { GfNoTransactionsInfoModule } from '@ghostfolio/ui/no-transactions-info';
import { GfValueModule } from '@ghostfolio/ui/value';
import { NgxSkeletonLoaderModule } from 'ngx-skeleton-loader';
-import { GfSymbolIconModule } from '../symbol-icon/symbol-icon.module';
-import { PositionsTableComponent } from './positions-table.component';
+import { HoldingsTableComponent } from './holdings-table.component';
@NgModule({
- declarations: [PositionsTableComponent],
- exports: [PositionsTableComponent],
+ declarations: [HoldingsTableComponent],
+ exports: [HoldingsTableComponent],
imports: [
CommonModule,
GfNoTransactionsInfoModule,
@@ -37,4 +37,4 @@ import { PositionsTableComponent } from './positions-table.component';
],
schemas: [CUSTOM_ELEMENTS_SCHEMA]
})
-export class GfPositionsTableModule {}
+export class GfHoldingsTableModule {}