Code Review: Donations

[bajwa61]

This pull request introduces a new feature: Donations, allowing users to donate to selected trusts and administrators to manage donation-related operations.

Functionality

Donation Process:

• Users can view a list of available trusts and make donations to their selected trust.
• The donation process dynamically updates the user’s account balance.

User Input Validation:

• Ensures that the donation amount is greater than zero.
• Disables the "Confirm" button if the user’s balance is insufficient for the donation.

Dynamic Balance Updates:

• Real-time updates to the user’s balance after a successful donation.

Error Handling:

• Implements proper error-handling mechanisms to handle potential issues during the donation process (e.g., insufficient balance or store dispatch errors).

[bajwa61]

Validation

The input field currently lacks validation, which allows invalid values like negative or zero amounts.

Solution

Add the min="1" attribute to the input field to enforce client-side validation and ensure only positive values are allowed.

<input
type="number"
class="form-control mt-3"
[(ngModel)]="donationAmount"
placeholder="Enter donation amount"
min="1"
/>

[bajwa61]

Memory Leak in Constructor

The constructor method subscribes to store.select without unsubscribing. This creates a potential memory leak because the subscription remains active even if the component is destroyed.

Solution

Unsubscribing ensures the subscription is terminated when the component is destroyed, freeing up resources. This approach avoids performance issues caused by lingering subscriptions and ensures proper lifecycle management.

private balanceSubscription: Subscription;

constructor(private store: Store<{ balance: any }>) {
this.balanceSubscription = this.store.select("balance").subscribe(balance => {
console.log("Initial balance loaded:", balance);
});
}

ngOnDestroy() {
if (this.balanceSubscription) {
this.balanceSubscription.unsubscribe(); // Cleanup to prevent memory leak
}
}

[bajwa61]

Lack of Error Handling

The handleConfirm method does not handle errors that may occur during the subscription or while dispatching the new balance to the store. For example:

• If the store.select("balance") call fails due to an issue in the store or state, the method will fail silently without notifying the user.
• If an error occurs during the dispatch of updateBalance, the application could become inconsistent without any feedback.

Solution

Implement proper error handling using the catchError operator from RxJS or a try-catch block inside the subscription.

try {
this.store.dispatch(updateBalance({ balance: newBalance }));
alert( "Donation of this.donationAmount successful for this.selectedTrust.name ! New Balance: newBalance");
} catch (dispatchError) {
alert("Failed to update the balance. Please contact support.");
console.error("Error in dispatching balance:", dispatchError);
}

[bajwa61]

Missing Validation for User Balance

The method does not validate whether the user's balance is sufficient for the donation. This can result in a negative balance, which is likely unintended and may cause application inconsistency or confusion for users.

Solution

Add a validation check to ensure that the donationAmount does not exceed the available balance.

if (this.donationAmount > numericBalance) {
alert("Insufficient funds for this donation. Please try a lower amount.");
return; // Prevent further execution if balance is insufficient
}

[bajwa61]

Validation

The "Confirm" button should be disabled on the UI if the donation amount is invalid (zero or negative). This prevents users from attempting invalid donations.

Solution

Use the [disabled] attribute on the "Confirm" button to conditionally disable it based on the validation rules.

<button
class="btn btn-primary"
(click)="handleConfirm()"
[disabled]="donationAmount <= 0 ">
Confirm