I have fixed the UI of view button in the featured circuit page #331
Conversation
WalkthroughThis update introduces modifications to two UI components. The primary button now accepts an optional text style parameter and offers a new factory constructor for creating a smaller button variant. In addition, the featured project card has updated image preview logic that checks for an image URL and displays either a network-loaded image or a placeholder when necessary. New helper methods handle placeholder creation and image URL construction, and the footer now utilizes the small button variant. Changes
Possibly related issues
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. 🪧 TipsChatThere are 3 ways to chat with CodeRabbit:
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)
Other keywords and placeholders
CodeRabbit Configuration File (
|
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 0
🧹 Nitpick comments (1)
lib/ui/views/projects/components/featured_project_card.dart (1)
84-90: Consider making the URL construction more robust.The substring operation assumes the API base URL ends with a specific 7-character pattern ("/api/v1/"). This could be fragile if the base URL format changes in the future.
String _getImageUrl() { - return EnvironmentConfig.CV_API_BASE_URL.substring( - 0, - EnvironmentConfig.CV_API_BASE_URL.length - 7, - ) + - widget.project.attributes.imagePreview.url; + // Remove API path component more reliably + String baseUrl = EnvironmentConfig.CV_API_BASE_URL; + if (baseUrl.endsWith('/api/v1/')) { + baseUrl = baseUrl.substring(0, baseUrl.length - 8); + } else if (baseUrl.endsWith('/api/v1')) { + baseUrl = baseUrl.substring(0, baseUrl.length - 7); + } + return baseUrl + widget.project.attributes.imagePreview.url; }
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (2)
lib/ui/components/cv_primary_button.dart(3 hunks)lib/ui/views/projects/components/featured_project_card.dart(3 hunks)
⏰ Context from checks skipped due to timeout of 90000ms (3)
- GitHub Check: build (ubuntu-latest)
- GitHub Check: build (macos-latest)
- GitHub Check: build (windows-latest)
🔇 Additional comments (9)
lib/ui/components/cv_primary_button.dart (4)
11-11: Good addition of a customizable text style parameter.Adding an optional
textStyleparameter allows for more flexibility in button appearance customization, which aligns with the PR objective of improving UI styling.
20-20: Appropriate class variable declaration.The
textStylevariable is correctly defined as optional (TextStyle?) to match the constructor parameter.
22-39: Well-designed small button variant.The factory constructor provides a good pre-configured variant with appropriate padding and text styling. The horizontal padding (12) being greater than vertical padding (6) creates a better visual balance, and the font weight of 500 ensures good readability at the smaller size.
53-54: Proper implementation of text style fallback.The null coalescing operator (
??) correctly uses the providedtextStyleif available, otherwise falls back to the existing logic. This maintains backward compatibility while adding new functionality.lib/ui/views/projects/components/featured_project_card.dart (5)
24-25: Good practice for conditional image handling.Adding a Boolean check for empty image URLs is a clean approach to determine the appropriate rendering path.
41-51: Improved image loading with fallback.The conditional rendering using FadeInImage with a proper error handler is a robust approach to image display. This ensures a good user experience even when images fail to load.
57-82: Well-designed placeholder implementation.The placeholder has a thoughtful design with appropriate colors, icon, and text that maintains visual consistency with the app's theme. The subtle color variations using
Color.lerpare a nice touch.
94-94: Improved padding for better content spacing.The symmetric padding provides consistent spacing around the footer content, aligning with the PR objective of better padding and spacing.
115-116: Enhanced button presentation.Adding a spacing of 10 between the text and button improves visual separation, and using the new
CVPrimaryButton.smallvariant creates a more professional appearance with appropriate sizing and padding.
|
@hardik17771 I have made the required changes to uplift the UI of View button in Featured Circuits. Please review. |
Pull Request Test Coverage Report for Build 14253409765Details
💛 - Coveralls |
|
🎉 This PR is included in version 1.1.0 🎉 The release is available on:
Your semantic-release bot 📦🚀 |
3 participants
Fixes #
A button which is not touching the borders, and is of perfect size as per the Material3. Solving the issue number : #330
Describe the changes you have made in this PR -
Before Fix:
After Fix:
Files Modified
lib/ui/components/cv_primary_button.dartlib/ui/views/projects/components/featured_project_card.dartScreenshots of the changes (If any) -
Before:
After:
Note: Please check Allow edits from maintainers. if you would like us to assist in the PR.
Summary by CodeRabbit