Refactored AdyenCardComponent for improved readability and structure #458
Conversation
The AdyenCardComponent has been refactored from a StatelessWidget to a StatefulWidget. This change allows for better state management, particularly for the asynchronous fetching of the SDK version number. The build logic has been streamlined by: - Moving the SDK version number fetching to `initState`. - Introducing dedicated internal widgets (`_CardSessionFlowWidget` and `_CardAdvancedFlowWidget`) to handle the different checkout flows (Session and Advanced). This separation improves code organization and makes the main build method cleaner. - The `_determineInitialHeight` method and its platform-specific helpers remain, but their usage is now within the context of the new stateful widget structure. These changes enhance the component's maintainability and readability without altering its core functionality.
![gemini-code-assist[bot]](https://avatars.githubusercontent.com/in/956858?s=60&v=4){kind=small}
There was a problem hiding this comment.
Summary of Changes
Hello @RahmiTufanoglu, I'm Gemini Code Assist1! I'm currently reviewing this pull request and will post my feedback shortly. In the meantime, here's a summary to help you and other reviewers quickly get up to speed!
This pull request refactors the AdyenCardComponent from a StatelessWidget to a StatefulWidget to improve state management, particularly for asynchronously fetching the SDK version number. The changes also streamline the component's build logic by moving data fetching to initState and introducing dedicated internal widgets to handle different checkout flows, enhancing overall code organization, readability, and maintainability without altering core functionality.
Highlights
- Widget Type Conversion: The
AdyenCardComponenthas been converted from aStatelessWidgetto aStatefulWidgetto enable proper state management, specifically for handling asynchronous operations like fetching the SDK version. - State Management Improvement: The asynchronous fetching of the SDK version number has been moved from the
buildmethod to theinitStatemethod of the new_AdyenCardComponentState, ensuring the data is fetched once when the widget is initialized. - Code Organization: Two new private
StatelessWidgets,_CardSessionFlowWidgetand_CardAdvancedFlowWidget, have been introduced to encapsulate the rendering logic for the distinct Session and Advanced checkout flows, significantly cleaning up the mainbuildmethod ofAdyenCardComponent.
Using Gemini Code Assist
The full guide for Gemini Code Assist can be found on our documentation page, here are some quick tips.
Invoking Gemini
You can request assistance from Gemini at any point in your pull request via creating an issue comment (i.e. comment on the pull request page) using either /gemini <command> or @gemini-code-assist <command>. Below is a summary of the supported commands.
| Feature | Command | Description |
|---|---|---|
| Code Review | /gemini review |
Performs a code review for the current pull request in its current state. |
| Pull Request Summary | /gemini summary |
Provides a summary of the current pull request in its current state. |
| Comment | @gemini-code-assist | Responds in comments when explicitly tagged, both in issue comments and review comments. |
| Help | /gemini help |
Displays a list of available commands. |
Customization
To customize Gemini Code Assist for GitHub experience, repository maintainers can create a configuration file and/or provide a custom code review style guide (such as PEP-8 for Python) by creating and adding files to a .gemini/ folder in the base of the repository. Detailed instructions can be found here.
Limitations & Feedback
Gemini Code Assist may make mistakes. Please leave feedback on any instances where its feedback is incorrect or counter productive. You can react with 👍 and 👎 on @gemini-code-assist comments or fill out our survey to provide feedback.
You can also get AI-powered code generation, chat, as well as code reviews directly in the IDE at no cost with the Gemini Code Assist IDE Extension.
Footnotes
-
Review the Privacy Notices, Generative AI Prohibited Use Policy, Terms of Service, and learn how to configure Gemini Code Assist in GitHub here. Gemini can make mistakes, so double check it and use code with caution. ↩
There was a problem hiding this comment.
Code Review
This pull request refactors AdyenCardComponent from a StatelessWidget to a StatefulWidget, which improves state management. The introduction of dedicated widgets for different checkout flows enhances code organization. The review focuses on refining the build method to enhance type safety, consistency, and performance by centralizing calculations and ensuring parameters are handled uniformly across the new widgets.
| return switch (widget.checkout) { | ||
| SessionCheckout() => _CardSessionFlowWidget( | ||
| configuration: widget.configuration, | ||
| paymentMethod: widget.paymentMethod, | ||
| checkout: widget.checkout, | ||
| onPaymentResult: widget.onPaymentResult, | ||
| sdkVersionNumber: sdkVersionNumber, | ||
| initialHeight: _determineInitialHeight(widget.configuration.cardConfiguration), | ||
| isStoredPaymentMethod: widget.paymentMethod.containsKey(_isStoredPaymentMethodIndicator), | ||
| ), | ||
| AdvancedCheckout it => _CardAdvancedFlowWidget( | ||
| configuration: widget.configuration, | ||
| paymentMethod: widget.paymentMethod, | ||
| advancedCheckout: it, | ||
| onPaymentResult: widget.onPaymentResult, | ||
| sdkVersionNumber: sdkVersionNumber, | ||
| encodedPaymentMethod: json.encode(widget.paymentMethod), | ||
| gestureRecognizers: widget.gestureRecognizers, | ||
| initialHeight: _determineInitialHeight(widget.configuration.cardConfiguration), | ||
| isStoredPaymentMethod: widget.paymentMethod.containsKey(_isStoredPaymentMethodIndicator), | ||
| ), | ||
| }; |
There was a problem hiding this comment.
To improve type safety and reduce redundancy, consider capturing the SessionCheckout instance in the switch statement, similar to how it's done for AdvancedCheckout. This allows passing the correctly typed object to _CardSessionFlowWidget, avoiding the need for casting within that widget. Additionally, pre-calculate initialHeight, isStoredPaymentMethod, and encodedPaymentMethod outside the switch to avoid redundant calculations. Finally, the paymentMethod map is passed to _CardAdvancedFlowWidget but is not used. After refactoring, it will also become unused in _CardSessionFlowWidget.
if (snapshot.hasData) {
final sdkVersionNumber = snapshot.data!;
final initialHeight = _determineInitialHeight(widget.configuration.cardConfiguration);
final isStoredPaymentMethod = widget.paymentMethod.containsKey(_isStoredPaymentMethodIndicator);
final encodedPaymentMethod = json.encode(widget.paymentMethod);
return switch (widget.checkout) {
SessionCheckout session => _CardSessionFlowWidget(
configuration: widget.configuration,
sessionCheckout: session,
onPaymentResult: widget.onPaymentResult,
sdkVersionNumber: sdkVersionNumber,
initialHeight: initialHeight,
isStoredPaymentMethod: isStoredPaymentMethod,
encodedPaymentMethod: encodedPaymentMethod,
),
AdvancedCheckout it => _CardAdvancedFlowWidget(
configuration: widget.configuration,
advancedCheckout: it,
onPaymentResult: widget.onPaymentResult,
sdkVersionNumber: sdkVersionNumber,
encodedPaymentMethod: encodedPaymentMethod,
gestureRecognizers: widget.gestureRecognizers,
initialHeight: initialHeight,
isStoredPaymentMethod: isStoredPaymentMethod,
),
};
}
…owWidget The `AdyenCardComponent` now directly returns either `CardSessionComponent` or `CardAdvancedComponent` based on the checkout type, simplifying the widget tree.
The `super.initState()` call was moved before widget-specific initialization in `BaseCardComponent` to ensure the base class is properly initialized first.
The loading widget for the CardComponent has been refactored for better readability and conciseness. The separate `_buildLoadingWidget` method has been removed, and its logic is now inline using a switch expression. This change maintains the existing behavior of showing a `CircularProgressIndicator` on Android and an empty `SizedBox` on other platforms.
|
Duplicated of #491 |
2 participants
The AdyenCardComponent has been refactored from a StatelessWidget to a StatefulWidget. This change allows for better state management, particularly for the asynchronous fetching of the SDK version number.
The build logic has been streamlined by:
initState._CardSessionFlowWidgetand_CardAdvancedFlowWidget) to handle the different checkout flows (Session and Advanced). This separation improves code organization and makes the main build method cleaner._determineInitialHeightmethod and its platform-specific helpers remain, but their usage is now within the context of the new stateful widget structure.These changes enhance the component's maintainability and readability without altering its core functionality.
Summary
Tested scenarios
Fixed issue: