Finish the frontend design but not yet optimized #22
Conversation
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
Boxuan-Matty-Lin
added
documentation
Coverage Report
File Coverage
|
||||||||||||||||||||||||||||||||||||||||||||
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.
This pull request introduces a major refactor and feature enhancement to the currency converter app, focusing on modularizing the codebase, improving user experience, and adding a new interactive historical chart feature for currency rates. The sidebar is now fully controlled by the parent component, and the main page manages all data fetching, error handling, and UI state. The historical chart is displayed responsively, either inline or in a modal, and is accessible via the currency sidebar. Several new reusable chart components have been added with improved accessibility and UI polish.
Key changes:
Feature: Historical Chart Integration & Modal Display
ChartWithInfo,HistoricalChart, andInfoCollapsiblecomponents, showing 2-week exchange rate trends for the selected currency. The chart appears inline on desktop and in a modal on mobile, with responsive design and accessibility improvements. (app/page.tsx,components/charts/ChartWithInfo.tsx,components/charts/HistoricalChart.tsx,components/charts/InfoCollapsible.tsx) [1] [2] [3] [4] [5]Refactor: Sidebar and Data Flow
CurrencySidebarto be a pure, controlled component, moving all data fetching, error handling, and selected state management to the parent (app/page.tsx). The sidebar now receives props for rates, amount, loading, error, and selected currency, as well as all relevant event handlers. (components/sidebar/CurrencySidebar.tsx,app/page.tsx) [1] [2] [3] [4] [5] [6]Enhancement: Currency Card Accessibility & Interactivity
CurrencyCardto support keyboard navigation, selection state, and ARIA attributes, making the currency selection accessible and visually distinct when selected. (components/sidebar/CurrencyCard.tsx) [1] [2] [3]API & Type Improvements
TARGET_CODESandCURRENCY_META, and exported types for better type safety and reusability across components. (components/sidebar/CurrencySidebar.tsx)These changes significantly improve the modularity, accessibility, and user experience of the currency converter app, while laying the groundwork for further feature enhancements.