test: improve history box

[fmorency]

Fixes #103

Summary by CodeRabbit

• New Features

  • Enhanced accessibility of the HistoryBox component with an updated loading skeleton that includes an aria-label.
  • Introduced new tests to verify loading states and specific transaction types within the HistoryBox component.

• Bug Fixes

  • Improved test assertions for better accuracy in checking the presence of transaction history and types.

• Tests

  • Updated mock data to include a wider range of transaction scenarios, enhancing test coverage.

[coderabbitai]

Walkthrough

The pull request introduces enhancements to the HistoryBox component's test suite, improving the specificity and coverage of assertions related to transaction types. It updates the mock data to include a wider variety of transaction scenarios and modifies the component to improve accessibility. The changes focus on refining the testing approach and ensuring that the mock transactions reflect a comprehensive range of types, while the core functionality of the component remains unchanged.

Changes

File Path	Change Summary
components/bank/components/tests/historyBox.test.tsx	Updated assertions for transaction history tests, added new assertions for transaction types, and introduced a loading state test. Removed previous checks for sent/received transactions.
components/bank/components/historyBox.tsx	Added aria-label to loading skeleton for accessibility; no changes to core logic or functionality.
tests/mock.ts	Modified mockTransactions to increase amounts and add new transaction types (MINT, BURN, PAYOUT) for testing purposes.

Assessment against linked issues

Objective	Addressed	Explanation
Add unit tests for all transaction types in mock data (#103)	✅

Possibly related issues

• Add unit tests for transaction helper functions #101: The changes in this PR enhance the mock data structure, which may support the need for unit tests for transaction helper functions by providing a more comprehensive range of transaction scenarios.

Possibly related PRs

• feat: better history #98: This PR modifies the test suite for the HistoryBox component and updates the mocked hook, which is directly related to the changes in this PR.

Suggested reviewers

• chalabi2

🐰 In the land of code, where rabbits hop,
Changes are made, and we never stop!
Tests are refined, and mocks are anew,
Accessibility shines, with a clearer view.
Hooray for the updates, let’s give a cheer,
For a smoother journey, we hold so dear! 🐇✨

---

📜 Recent review details

Configuration used: CodeRabbit UI
Review profile: CHILL

📥 Commits

Reviewing files that changed from the base of the PR and between ef7e6ef and 9235370.

📒 Files selected for processing (3)

• components/bank/components/__tests__/historyBox.test.tsx (4 hunks)
• components/bank/components/historyBox.tsx (1 hunks)
• tests/mock.ts (3 hunks)

✅ Files skipped from review due to trivial changes (1)

• components/bank/components/historyBox.tsx

🔇 Additional comments (6)

components/bank/components/__tests__/historyBox.test.tsx (5)

6-8: LGTM! Good improvement in test assertions.

Adding @testing-library/jest-dom/matchers enhances the test suite with more semantic matchers like toBeInTheDocument().

---

28-28: LGTM! Improved test data coverage.

Updating totalPages to 2 better tests pagination scenarios.

---

47-54: Great addition of comprehensive transaction type testing.

The test now properly verifies multiple transaction types (Minted, Burned) with specific count assertions, which aligns well with the PR objective to test all transaction types.

---

70-79: Excellent coverage of amount formatting across transaction types.

The test now verifies amount formatting for all transaction types:

• Send/Receive transactions
• Mint/Burn transactions
• Payout transactions
• Burn held balance transactions

This comprehensively addresses the PR objective to test all transaction types.

---

82-84: Good addition of loading state test.

Testing the loading state with skeleton loader improves the component's test coverage.

tests/mock.ts (1)

Line range hint 198-315: Excellent enhancement of mock transaction data.

The mock data improvements significantly enhance test coverage:

1. Includes all required transaction types: Send, Receive, Mint, Burn, Payout, BurnHeldBalance
2. Uses realistic transaction amounts with proper denomination
3. Maintains chronological order with consistent date progression
4. Provides unique transaction hashes

This perfectly aligns with the PR objective to "Add unit tests for all transaction types in mock data."

---

Thank you for using CodeRabbit. We offer it for free to the OSS community and would appreciate your support in helping us grow. If you find it useful, would you consider giving us a shout-out on your favorite social media?

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

🪧 Tips

Chat

There are 3 ways to chat with CodeRabbit:

• Review comments: Directly reply to a review comment made by CodeRabbit. Example:
  • I pushed a fix in commit <commit_id>, please review it.
  • Generate unit testing code for this file.
  • Open a follow-up GitHub issue for this discussion.
• Files and specific lines of code (under the "Files changed" tab): Tag @coderabbitai in a new review comment at the desired location with your query. Examples:
  • @coderabbitai generate unit testing code for this file.
  • @coderabbitai modularize this function.
• PR comments: Tag @coderabbitai in a new PR comment to ask questions about the PR branch. For the best results, please provide a very specific query, as very limited context is provided in this mode. Examples:
  • @coderabbitai gather interesting stats about this repository and render them as a table. Additionally, render a pie chart showing the language distribution in the codebase.
  • @coderabbitai read src/utils.ts and generate unit testing code.
  • @coderabbitai read the files in the src/scheduler package and generate a class diagram using mermaid and a README in the markdown format.
  • @coderabbitai help me debug CodeRabbit configuration file.

Note: Be mindful of the bot's finite context window. It's strongly recommended to break down tasks such as reading entire modules into smaller chunks. For a focused discussion, use review comments to chat about specific files and their changes, instead of using the PR comments.

CodeRabbit Commands (Invoked using PR comments)

• @coderabbitai pause to pause the reviews on a PR.
• @coderabbitai resume to resume the paused reviews.
• @coderabbitai review to trigger an incremental review. This is useful when automatic reviews are disabled for the repository.
• @coderabbitai full review to do a full review from scratch and review all the files again.
• @coderabbitai summary to regenerate the summary of the PR.
• @coderabbitai resolve resolve all the CodeRabbit review comments.
• @coderabbitai configuration to show the current CodeRabbit configuration for the repository.
• @coderabbitai help to get help.

Other keywords and placeholders

• Add @coderabbitai ignore anywhere in the PR description to prevent this PR from being reviewed.
• Add @coderabbitai summary to generate the high-level summary at a specific location in the PR description.
• Add @coderabbitai anywhere in the PR title to generate the title automatically.

CodeRabbit Configuration File (.coderabbit.yaml)

• You can programmatically configure CodeRabbit by adding a .coderabbit.yaml file to the root of your repository.
• Please see the configuration documentation for more information.
• If your editor has YAML language server enabled, you can add the path at the top of this file to enable auto-completion and validation: # yaml-language-server: $schema=https://coderabbit.ai/integrations/schema.v2.json

Documentation and Community

• Visit our Documentation for detailed information on how to use CodeRabbit.
• Join our Discord Community to get help, request features, and share feedback.
• Follow us on X/Twitter for updates and announcements.

[codecov]

Codecov Report

All modified and coverable lines are covered by tests ✅

Project coverage is 60.20%. Comparing base (ef7e6ef) to head (9235370).
Report is 1 commits behind head on main.

Additional details and impacted files

@@            Coverage Diff             @@
##             main     #107      +/-   ##
==========================================
+ Coverage   59.39%   60.20%   +0.80%     
==========================================
  Files         146      146              
  Lines       14389    14473      +84     
==========================================
+ Hits         8546     8713     +167     
+ Misses       5843     5760      -83     

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.