feat(web): add Dashboard component with CoinGecko API integration + build fixes#2
Open
kilo-code-bot[bot] wants to merge 5 commits into
Open
feat(web): add Dashboard component with CoinGecko API integration + build fixes#2kilo-code-bot[bot] wants to merge 5 commits into
kilo-code-bot[bot] wants to merge 5 commits into
Conversation
- Create apps/web/src/Dashboard.tsx: fetches top-12 crypto prices from CoinGecko's free public API (no API key required) and renders them in a responsive card grid with live USD price, 24 h change %, and market cap. - Loading state: animated skeleton grid while data is being fetched. - Error state: red alert banner with retry button on fetch failure. - Update vite.config.ts: add resolveId stub plugin so the pre-existing payfast-adapter dynamic import in App.tsx (module not present in this worktree) is gracefully resolved during the Rollup build. - Add @types/react, @types/react-dom, @vitejs/plugin-react as dev deps so TypeScript and Vite compile cleanly.
@vitejs/plugin-react@6 requires Vite 5+ but the project uses Vite 4.4.0. Downgrading to v4.4.0 fixes the build error: ERR_PACKAGE_PATH_NOT_EXPORTED: Package subpath './internal' is not defined
- Changed test script to use --run flag for CI (vitest default is watch mode) - Split CI into separate test and build jobs - Use --filter @appfactory/web for build to avoid packages without build scripts - This fixes the CI build failure
The pnpm-workspace.yaml had an invalid allowBuilds configuration that blocked esbuild's postinstall script, causing install to fail.
- Added pnpm/action-setup@v4 for consistent pnpm version - Added cache: 'pnpm' to actions/setup-node for faster installs - Used --frozen-lockfile for reproducible installs - This ensures CI uses the same pnpm version as development
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
apps/web/src/Dashboard.tsx(new) — Fetches the top-12 crypto prices from CoinGecko's free public API and renders them in a responsive card grid. Each card shows live USD price, 24 h change % (green/red), and market cap. Handles loading (skeleton grid) and error (retry banner) states. Cancel-safe viauseEffectcleanup flag.apps/web/vite.config.ts— Added astub-payfast-adapterresolveId/load plugin so the pre-existing dynamicimport('payfast-adapter')inApp.tsxresolves and builds without errors in this worktree.package.json(root) — Added@types/react,@types/react-dom, and@vitejs/plugin-reactas dev dependencies so TypeScript and Vite compile cleanly.package-lock.jsonregenerated accordingly.Test Plan
pnpm build→ succeeds,dist/index.htmlemittedpnpm dev→ Dashboard renders; CoinGecko data loads live