From 35184807c02f7e95c77e05966ad8806aa3bb76e3 Mon Sep 17 00:00:00 2001 From: csimonis Date: Wed, 23 Apr 2025 12:26:41 +0200 Subject: [PATCH] feat(transactions): add pagination support for user transactions --- .../szut/casino/deposit/TransactionRepository.java | 3 +++ .../user/transaction/GetTransactionService.java | 14 +++++++------- .../user/transaction/TransactionController.java | 7 ++++--- .../user/transaction/dto/UserTransactionsDto.java | 12 ++++++++++++ frontend/src/app/feature/home/home.component.html | 2 +- frontend/src/app/feature/home/home.component.ts | 6 +++--- .../transaction-history.component.css | 5 ++--- .../transaction-history.component.html | 6 +++--- .../transaction-history.component.ts | 7 ++++--- frontend/src/app/model/TransactionData.ts | 6 ++++++ frontend/src/app/service/transaction.service.ts | 3 ++- 11 files changed, 47 insertions(+), 24 deletions(-) create mode 100644 backend/src/main/java/de/szut/casino/user/transaction/dto/UserTransactionsDto.java create mode 100644 frontend/src/app/model/TransactionData.ts diff --git a/backend/src/main/java/de/szut/casino/deposit/TransactionRepository.java b/backend/src/main/java/de/szut/casino/deposit/TransactionRepository.java index c5a98c6..5a16f0d 100644 --- a/backend/src/main/java/de/szut/casino/deposit/TransactionRepository.java +++ b/backend/src/main/java/de/szut/casino/deposit/TransactionRepository.java @@ -18,4 +18,7 @@ public interface TransactionRepository extends JpaRepository findByUserIdWithLimit(UserEntity userEntity, Integer limit, Integer offset); + + @Query("SELECT COUNT(t) > ?2 + ?3 FROM TransactionEntity t WHERE t.user = ?1") + Boolean hasMore(UserEntity userEntity, Integer limit, Integer offset); } diff --git a/backend/src/main/java/de/szut/casino/user/transaction/GetTransactionService.java b/backend/src/main/java/de/szut/casino/user/transaction/GetTransactionService.java index 6a83aa7..831c438 100644 --- a/backend/src/main/java/de/szut/casino/user/transaction/GetTransactionService.java +++ b/backend/src/main/java/de/szut/casino/user/transaction/GetTransactionService.java @@ -5,6 +5,7 @@ import de.szut.casino.deposit.TransactionRepository; import de.szut.casino.user.UserEntity; import de.szut.casino.user.UserService; import de.szut.casino.user.transaction.dto.GetTransactionDto; +import de.szut.casino.user.transaction.dto.UserTransactionsDto; import org.springframework.beans.factory.annotation.Autowired; import org.springframework.stereotype.Service; @@ -20,17 +21,16 @@ public class GetTransactionService { @Autowired private TransactionRepository transactionRepository; - public List getUserTransactions(String authToken, Integer limit, Integer offset) { + public UserTransactionsDto getUserTransactionsDto(String authToken, Integer limit, Integer offset) { Optional user = this.userService.getCurrentUser(authToken); if (user.isPresent()) { - if (limit != null && limit > 0) { - return this.transactionRepository.findByUserIdWithLimit(user.get(), limit, offset); - } else { - return this.transactionRepository.findAllByUserId(user.get()); - } + List transactionEntities = this.transactionRepository.findByUserIdWithLimit(user.get(), limit, offset); + Boolean hasMore = this.transactionRepository.hasMore(user.get(), limit, offset); + + return new UserTransactionsDto(mapTransactionsToDtos(transactionEntities), hasMore); } - return List.of(); + return new UserTransactionsDto(List.of(), false); } public List mapTransactionsToDtos(List transactions) { diff --git a/backend/src/main/java/de/szut/casino/user/transaction/TransactionController.java b/backend/src/main/java/de/szut/casino/user/transaction/TransactionController.java index 3beb492..61805b0 100644 --- a/backend/src/main/java/de/szut/casino/user/transaction/TransactionController.java +++ b/backend/src/main/java/de/szut/casino/user/transaction/TransactionController.java @@ -2,6 +2,7 @@ package de.szut.casino.user.transaction; import de.szut.casino.deposit.TransactionEntity; import de.szut.casino.user.transaction.dto.GetTransactionDto; +import de.szut.casino.user.transaction.dto.UserTransactionsDto; import org.springframework.beans.factory.annotation.Autowired; import org.springframework.http.ResponseEntity; import org.springframework.web.bind.annotation.GetMapping; @@ -18,14 +19,14 @@ public class TransactionController { private GetTransactionService transactionService; @GetMapping("/user/transactions") - public ResponseEntity> getUserTransactions( + public ResponseEntity getUserTransactions( @RequestHeader("Authorization") String authToken, @RequestParam(value = "limit", required = false) Integer limit, @RequestParam(value = "offset", required = false) Integer offset ) { - List transactionEntities = this.transactionService.getUserTransactions(authToken, limit, offset); + UserTransactionsDto transactionEntities = this.transactionService.getUserTransactionsDto(authToken, limit, offset); - return ResponseEntity.ok(this.transactionService.mapTransactionsToDtos(transactionEntities)); + return ResponseEntity.ok(transactionEntities); } } diff --git a/backend/src/main/java/de/szut/casino/user/transaction/dto/UserTransactionsDto.java b/backend/src/main/java/de/szut/casino/user/transaction/dto/UserTransactionsDto.java new file mode 100644 index 0000000..54e116b --- /dev/null +++ b/backend/src/main/java/de/szut/casino/user/transaction/dto/UserTransactionsDto.java @@ -0,0 +1,12 @@ +package de.szut.casino.user.transaction.dto; + +import lombok.AllArgsConstructor; + +import java.util.List; + +@AllArgsConstructor +public class UserTransactionsDto { + public List transactions; + public Boolean hasMore; +} + diff --git a/frontend/src/app/feature/home/home.component.html b/frontend/src/app/feature/home/home.component.html index c6014cf..7495823 100644 --- a/frontend/src/app/feature/home/home.component.html +++ b/frontend/src/app/feature/home/home.component.html @@ -101,7 +101,7 @@

{{ transaction.status }}

diff --git a/frontend/src/app/feature/home/home.component.ts b/frontend/src/app/feature/home/home.component.ts index af4c712..487bd73 100644 --- a/frontend/src/app/feature/home/home.component.ts +++ b/frontend/src/app/feature/home/home.component.ts @@ -3,13 +3,13 @@ import { AsyncPipe, CurrencyPipe, DatePipe, NgFor } from '@angular/common'; import { DepositComponent } from '../deposit/deposit.component'; import { ActivatedRoute, Router } from '@angular/router'; import { ConfirmationComponent } from '@shared/components/confirmation/confirmation.component'; -import { Transaction } from 'app/model/Transaction'; import { NavbarComponent } from '@shared/components/navbar/navbar.component'; import { Game } from 'app/model/Game'; -import { Observable, of } from 'rxjs'; +import { Observable } from 'rxjs'; import { TransactionService } from '@service/transaction.service'; import format from 'ajv/dist/vocabularies/format'; import { TransactionHistoryComponent } from '../transaction-history/transaction-history.component'; +import { TransactionData } from '../../model/TransactionData'; @Component({ selector: 'app-homepage', @@ -80,7 +80,7 @@ export default class HomeComponent implements OnInit { allGames: Game[] = [...this.featuredGames]; - recentTransactions: Observable = inject(TransactionService).getUsersTransactions(5); + recentTransactionData: Observable = inject(TransactionService).getUsersTransactions(5); openDepositModal() { this.isDepositModalOpen = true; diff --git a/frontend/src/app/feature/transaction-history/transaction-history.component.css b/frontend/src/app/feature/transaction-history/transaction-history.component.css index c3fdef2..c68e294 100644 --- a/frontend/src/app/feature/transaction-history/transaction-history.component.css +++ b/frontend/src/app/feature/transaction-history/transaction-history.component.css @@ -1,9 +1,8 @@ button[disabled] { cursor: not-allowed; - background-color: #ccc; + background-color: #077b58; box-shadow: none; } - button[disabled]:hover { - background-color: #ccc; + background-color: #077b58; } diff --git a/frontend/src/app/feature/transaction-history/transaction-history.component.html b/frontend/src/app/feature/transaction-history/transaction-history.component.html index 5d26590..57d3b0b 100644 --- a/frontend/src/app/feature/transaction-history/transaction-history.component.html +++ b/frontend/src/app/feature/transaction-history/transaction-history.component.html @@ -8,7 +8,7 @@

Transaktionen

Hier siehst du alle vergangenen Einzahlungen

- @for (transaction of transactions$ | async; track null) { + @for (transaction of (transactionData$ | async)?.transactions; track null) {

{{ transaction.status }}

@@ -25,11 +25,11 @@
} -
+
-
diff --git a/frontend/src/app/feature/transaction-history/transaction-history.component.ts b/frontend/src/app/feature/transaction-history/transaction-history.component.ts index 30b9102..cc0a9ed 100644 --- a/frontend/src/app/feature/transaction-history/transaction-history.component.ts +++ b/frontend/src/app/feature/transaction-history/transaction-history.component.ts @@ -4,6 +4,7 @@ import { Observable } from 'rxjs'; import { Transaction } from '../../model/Transaction'; import { AsyncPipe, CurrencyPipe, DatePipe, NgForOf, NgIf } from '@angular/common'; import { AnimatedNumberComponent } from '@blackjack/components/animated-number/animated-number.component'; +import { TransactionData } from '../../model/TransactionData'; const PER_PAGE = 5 @@ -31,7 +32,7 @@ export class TransactionHistoryComponent { protected offset: number = 0; private transactionService: TransactionService = inject(TransactionService); - transactions$: Observable = this.loadTransactions(); + transactionData$: Observable = this.loadTransactions(); closeDialog() { this.isOpen = false; @@ -40,12 +41,12 @@ export class TransactionHistoryComponent { forward() { this.offset++; - this.transactions$ = this.loadTransactions(); + this.transactionData$ = this.loadTransactions(); } back() { this.offset--; - this.transactions$ = this.loadTransactions(); + this.transactionData$ = this.loadTransactions(); } loadTransactions() { diff --git a/frontend/src/app/model/TransactionData.ts b/frontend/src/app/model/TransactionData.ts new file mode 100644 index 0000000..2da39bb --- /dev/null +++ b/frontend/src/app/model/TransactionData.ts @@ -0,0 +1,6 @@ +import { Transaction } from './Transaction'; + +export interface TransactionData { + transactions: Transaction[]; + hasMore: boolean; +} diff --git a/frontend/src/app/service/transaction.service.ts b/frontend/src/app/service/transaction.service.ts index 7fcb659..82b0e41 100644 --- a/frontend/src/app/service/transaction.service.ts +++ b/frontend/src/app/service/transaction.service.ts @@ -1,5 +1,6 @@ import { inject, Injectable } from '@angular/core'; import { HttpClient } from '@angular/common/http'; +import { TransactionData } from '../model/TransactionData'; @Injectable({ providedIn: 'root', @@ -18,6 +19,6 @@ export class TransactionService { baseUrl.searchParams.append('offset', offset.toString()); } - return this.http.get(`${baseUrl}`); + return this.http.get(`${baseUrl}`); } }