make deposit button env configurabliable#1171
Conversation
WalkthroughThis change introduces a DEPOSIT_BUTTON_ENABLED flag that flows from environment → Rails config → view data attributes → frontend JS → Vue component to conditionally render the "Geld inleggen" button on the order screen. Changes
Sequence Diagram(s)mermaid Estimated code review effort🎯 2 (Simple) | ⏱️ ~12 minutes
Poem
Pre-merge checks and finishing touches❌ Failed checks (1 inconclusive)
✅ Passed checks (2 passed)
✨ Finishing touches
🧪 Generate unit tests (beta)
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. Comment |
Codecov Report✅ All modified and coverable lines are covered by tests. Additional details and impacted files@@ Coverage Diff @@
## staging #1171 +/- ##
========================================
Coverage 77.68% 77.68%
========================================
Files 54 54
Lines 1340 1340
========================================
Hits 1041 1041
Misses 299 299 ☔ View full report in Codecov by Sentry. 🚀 New features to boost your workflow:
|
There was a problem hiding this comment.
Pull request overview
This PR makes the deposit button ("Geld inleggen") on the order screen configurable through the DEPOSIT_BUTTON_ENABLED environment variable. This allows deployments to disable the deposit functionality if needed.
Key changes:
- Added
DEPOSIT_BUTTON_ENABLEDenvironment variable configuration that defaults totrue - Passed the configuration through the Rails view layer to the Vue.js component
- Made the deposit button conditionally render based on the configuration
Reviewed changes
Copilot reviewed 6 out of 6 changed files in this pull request and generated no comments.
Show a summary per file
| File | Description |
|---|---|
| config/application.rb | Added deposit_button_enabled configuration that reads from DEPOSIT_BUTTON_ENABLED env var |
| app/views/activities/order_screen.html.erb | Passed deposit_button_enabled config to the order screen Vue component via data attributes |
| app/javascript/order_screen.js | Parsed the depositButtonEnabled data attribute and added it to Vue component data |
| app/javascript/components/orderscreen/UserSelection.vue | Added depositButtonEnabled prop with default value true and made button render conditionally with v-if |
| .env.example | Added example DEPOSIT_BUTTON_ENABLED=true environment variable |
| app/views/users/show.html.erb | Changed condition from amber_api_url to amber_api_host (unrelated bug fix) |
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
|
@coderabbitai full review |
✅ Actions performedFull review triggered. |
![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)
.env.example (1)
52-52: Consider reordering for consistency.The static analysis tool suggests placing
DEPOSIT_BUTTON_ENABLEDbeforeMIN_PAYMENT_AMOUNTto maintain alphabetical ordering. While not critical, consistent ordering improves maintainability.
📜 Review details
Configuration used: defaults
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (6)
.env.example(1 hunks)app/javascript/components/orderscreen/UserSelection.vue(2 hunks)app/javascript/order_screen.js(2 hunks)app/views/activities/order_screen.html.erb(2 hunks)app/views/users/show.html.erb(1 hunks)config/application.rb(1 hunks)
🧰 Additional context used
🪛 dotenv-linter (4.0.0)
.env.example
[warning] 52-52: [UnorderedKey] The DEPOSIT_BUTTON_ENABLED key should go before the MIN_PAYMENT_AMOUNT key
(UnorderedKey)
🔇 Additional comments (8)
app/views/users/show.html.erb (1)
155-155: Verify this change is intentional and related to the PR scope.This line changes the config key from
amber_api_url.present?toamber_api_host.present?. While both checks should be functionally equivalent (since both are derived from the same credentials source), this change appears unrelated to making the deposit button configurable.Is this an intentional refactor, or should it be part of a separate PR?
config/application.rb (1)
78-78: LGTM!The configuration is correctly implemented with a sensible default of
true, maintaining backward compatibility. The string-to-boolean conversion pattern is appropriate and consistent with Rails conventions.app/javascript/order_screen.js (2)
22-22: LGTM!The dataset attribute is correctly read and converted to a boolean. This follows the existing pattern used for other data attributes in this file.
46-46: LGTM!The
depositButtonEnabledflag is correctly added to the Vue instance data and will be accessible to all child components.app/javascript/components/orderscreen/UserSelection.vue (2)
107-110: LGTM!The prop is correctly declared with appropriate type and default value. The default of
trueensures backward compatibility if the prop is not provided.
26-29: LGTM!The "Geld inleggen" button is now conditionally rendered based on the
depositButtonEnabledprop. This correctly implements the feature requirement to make the deposit button configurable.app/views/activities/order_screen.html.erb (2)
6-6: LGTM!The
deposit_button_enabledconfig value is correctly added to the data attributes, enabling the frontend to access this configuration.
59-59: LGTM!The
depositButtonEnabledprop is correctly passed to theuser-selectioncomponent, completing the data flow from Rails config to Vue component. The kebab-case attribute name correctly maps to the camelCase prop in the Vue component.
Makes the "geld inleggen" button on the order screen configerable through a env variable
Summary by CodeRabbit
New Features
Bug Fixes
✏️ Tip: You can customize this high-level summary in your review settings.