From 99558fec44b49a9d350542c5146c54ac4677366f Mon Sep 17 00:00:00 2001
From: ksyasuda <ksyasuda@umich.edu>
Date: Fri, 9 Aug 2024 02:15:24 -0700
Subject: [PATCH] Fix pagination

Fix items on pages after the 1st resetting index to 1
---
 .../portfolio/analysis/analysis-page.html     | 100 +++++++++---------
 1 file changed, 50 insertions(+), 50 deletions(-)

diff --git a/apps/client/src/app/pages/portfolio/analysis/analysis-page.html b/apps/client/src/app/pages/portfolio/analysis/analysis-page.html
index 66f8bf8a..a5ddee0f 100644
--- a/apps/client/src/app/pages/portfolio/analysis/analysis-page.html
+++ b/apps/client/src/app/pages/portfolio/analysis/analysis-page.html
@@ -169,30 +169,30 @@
         <mat-card-content>
           <ol class="mb-0 ml-1 pl-3">
             <div *ngFor="let holding of (showAllTop ?  positions.slice(pageIndexTop * pageSize, (pageIndexTop + 1) * pageSize) : positions | slice:0:5); track holding">
-              <li class="py-1">
-                <a
-                  class="d-flex"
-                  [queryParams]="{
-                    dataSource: holding.dataSource,
-                    holdingDetailDialog: true,
-                    symbol: holding.symbol
-                  }"
-                  [routerLink]="[]"
-                >
-                  <div class="flex-grow-1 mr-2">{{ holding.name }}</div>
-                  <div class="d-flex justify-content-end">
-                    <gf-value
-                      class="justify-content-end"
-                      position="end"
-                      [colorizeSign]="true"
-                      [isPercent]="true"
-                      [locale]="user?.settings?.locale"
-                      [value]="holding.netPerformancePercentWithCurrencyEffect"
-                    />
-                  </div>
-                </a>
+				<li class="py-1" value="{{pageSize * pageIndexTop + i + 1}}">
+				<a
+				  class="d-flex"
+				  [queryParams]="{
+					dataSource: holding.dataSource,
+					holdingDetailDialog: true,
+					symbol: holding.symbol
+				  }"
+				  [routerLink]="[]"
+				>
+				  <div class="flex-grow-1 mr-2">{{ holding.name }}</div>
+				  <div class="d-flex justify-content-end">
+					<gf-value
+					  class="justify-content-end"
+					  position="end"
+					  [colorizeSign]="true"
+					  [isPercent]="true"
+					  [locale]="user?.settings?.locale"
+					  [value]="holding.netPerformancePercentWithCurrencyEffect"
+					/>
+				  </div>
+				</a>
               </li>
-            </div>
+			</div>
           </ol>
           <div>
             @if (!topx) {
@@ -232,33 +232,33 @@
           >
         </mat-card-header>
         <mat-card-content>
-          <ol class="mb-0 ml-1 pl-3">
-            <div *ngFor="let holding of (showAllBottom ?  positionsReversed.slice(pageIndexBottom * pageSize, (pageIndexBottom + 1) * pageSize) : positionsReversed | slice:0:5); track holding">
-              <li class="py-1">
-                <a
-                  class="d-flex"
-                  [queryParams]="{
-                    dataSource: holding.dataSource,
-                    holdingDetailDialog: true,
-                    symbol: holding.symbol
-                  }"
-                  [routerLink]="[]"
-                >
-                  <div class="flex-grow-1 mr-2">{{ holding.name }}</div>
-                  <div class="d-flex justify-content-end">
-                    <gf-value
-                      class="justify-content-end"
-                      position="end"
-                      [colorizeSign]="true"
-                      [isPercent]="true"
-                      [locale]="user?.settings?.locale"
-                      [value]="holding.netPerformancePercentWithCurrencyEffect"
-                    />
-                  </div>
-                </a>
-              </li>
-            </div>
-          </ol>
+		<ol class="mb-0 ml-1 pl-3">
+			<div *ngFor="let holding of (showAllBottom ?  positionsReversed.slice(pageIndexBottom * pageSize, (pageIndexBottom + 1) * pageSize) : positionsReversed | slice:0:5); index as i">
+				<li class="py-1" value="{{pageSize * pageIndexBottom + i + 1}}">
+					<a
+						class="d-flex"
+						[queryParams]="{
+							dataSource: holding.dataSource,
+							holdingDetailDialog: true,
+							symbol: holding.symbol
+						}"
+						[routerLink]="[]"
+					>
+						<div class="flex-grow-1 mr-2">{{ holding.name }}</div>
+						<div class="d-flex justify-content-end">
+							<gf-value
+								class="justify-content-end"
+								position="end"
+								[colorizeSign]="true"
+								[isPercent]="true"
+								[locale]="user?.settings?.locale"
+								[value]="holding.netPerformancePercentWithCurrencyEffect"
+							/>
+						</div>
+					</a>
+				</li>
+			</div>
+		</ol>
           <div>
             @if (!bottomx) {
               <ngx-skeleton-loader