Skip to content

feat: add skeleton loading components and frontend unit tests#225

Merged
Fatimasanusi merged 3 commits into
Trust-Analysis:mainfrom
Shalom-margort:issue-105-115
Jun 29, 2026
Merged

feat: add skeleton loading components and frontend unit tests#225
Fatimasanusi merged 3 commits into
Trust-Analysis:mainfrom
Shalom-margort:issue-105-115

Conversation

@Shalom-margort

Copy link
Copy Markdown
Contributor

Description:

Closes #105
Closes #115

Changes

#105 — Skeleton loading components

  • Add AssetCardSkeleton component matching AssetCard layout (image, type badge, title, location, valuation, footer)
  • Add TextSkeleton and ImageSkeleton convenience wrappers
  • Update AssetGrid to use AssetCardSkeleton for loading state

#115 — Frontend unit tests (Vitest + React Testing Library)

  • Install and configure Vitest with jsdom environment
  • 23 unit tests covering:
    • App initial render
    • Wallet connect (success + error) and disconnect
    • Buy shares validation (amount < 1)
    • Error display (Alert, AssetGrid error state)
    • Metadata display (AssetCard, AssetGrid, useAssetStore)
    • All Skeleton components
  • Add test and test:watch scripts to package.json

Tested

All 23 tests pass (npm test → 23 passed, 0 failed)

- Add AssetCardSkeleton matching AssetCard layout (image, assetType, title, location, valuation, footer)
- Add TextSkeleton and ImageSkeleton convenience wrappers in Skeleton/index.js
- Update AssetGrid to use AssetCardSkeleton instead of raw Skeleton blocks
- Skeleton coverage: AssetGrid, App metadata card, share balance, PortfolioPage rows
- Install vitest, @testing-library/react, @testing-library/jest-dom, jsdom
- Configure vitest in vite.config.js with jsdom environment
- Add test setup file with jest-dom matchers
- Write 23 unit tests covering:
  - App initial render
  - Wallet connect (success + error) and disconnect
  - Buy shares validation (amount < 1)
  - Error display (Alert component, AssetGrid error state)
  - Metadata display (AssetCard, AssetGrid, useAssetStore)
  - Skeleton components (Skeleton, AssetCardSkeleton, TextSkeleton, ImageSkeleton)
- Add 'test' and 'test:watch' scripts to package.json
- Fix Skeleton/index.js -> index.jsx (JSX in .js caused rollup parse error)
@drips-wave

drips-wave Bot commented Jun 29, 2026

Copy link
Copy Markdown

@Shalom-margort Great news! 🎉 Based on an automated assessment of this PR, the linked Wave issue(s) no longer count against your application limits.

You can now already apply to more issues while waiting for a review of this PR. Keep up the great work! 🚀

Learn more about application limits

@Fatimasanusi
Fatimasanusi merged commit 8009939 into Trust-Analysis:main Jun 29, 2026
2 of 3 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Add frontend unit tests with Vitest + React Testing Library Add skeleton loading components for all async data

2 participants