Add coupon redeem logic with VIGYBAG 10% discount validation#2732
Conversation
|
@Chavva-Harshita is attempting to deploy a commit to the Vivek Prajapati's projects Team on Vercel. A member of the Team first needs to authorize it. |
📝 WalkthroughWalkthroughImplements coupon redemption functionality in the dashboard cart component by adding state management for coupon input, validation logic that compares against a hardcoded code, and user feedback messages. Resolves the non-functional Redeem button by implementing the missing click handler and validation workflow. Changes
Estimated code review effort🎯 2 (Simple) | ⏱️ ~10 minutes Suggested labels
Suggested reviewers
Poem
🚥 Pre-merge checks | ✅ 5✅ Passed checks (5 passed)
✏️ Tip: You can configure your own custom pre-merge checks in the settings. ✨ Finishing touches
🧪 Generate unit tests (beta)
Tip Issue Planner is now in beta. Read the docs and try it out! Share your feedback on Discord. 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 |
There was a problem hiding this comment.
Actionable comments posted: 2
🤖 Fix all issues with AI agents
In `@src/User/pages/Dashboard/dashboard-cart.jsx`:
- Line 127: The if-statement checking the coupon value (if
(coupon.trim().toUpperCase() === "VIGYBAG")) is accidentally dedented and should
be indented to match the surrounding block (lines 122–126); update the
indentation of that line so it aligns with the other statements in the same
block (referencing the coupon.trim().toUpperCase() comparison in
dashboard-cart.jsx) to restore consistent visual alignment.
- Around line 121-134: handleRedeem announces a 10% discount but never changes
the OrderSummary total because isApplied isn't passed down and OrderSummary
still uses total = itemsTotal + shipping; fix by wiring the discount into the
pricing flow: compute a discountAmount (e.g., 10% of itemsTotal) in handleRedeem
(or derive a boolean discountApplied from setIsApplied) and pass it as a prop to
OrderSummary (or persist it to Redux if you prefer global state) so OrderSummary
recalculates total = itemsTotal - discountAmount + shipping; also correct the
indentation around the coupon check in handleRedeem and remove the hardcoded
"VIGYBAG" from client-side code—validate the coupon server-side or fetch valid
codes from a secure endpoint instead of embedding the string.
🧹 Nitpick comments (2)
src/User/pages/Dashboard/dashboard-cart.jsx (2)
127-129: Hardcoded coupon code is trivially discoverable in client-side JS.Any user can open DevTools and find
"VIGYBAG"in the bundle. The PR description acknowledges this is frontend-only and a placeholder, which is fine for a demo, but be aware this offers zero actual validation. When extending to real coupons, move validation server-side.
154-162: Feedback message rendering is clean.Minor UX suggestion: consider clearing the message when the user starts typing a new coupon code (e.g., in the
onChangehandler), so stale error/success messages don't persist while the user edits their input.Optional: clear message on input change
- onChange={(e) => setCoupon(e.target.value)} + onChange={(e) => { + setCoupon(e.target.value); + setMessage(""); + setIsApplied(false); + }}
| const handleRedeem = () => { | ||
| if (!coupon.trim()) { | ||
| setMessage("Please enter a coupon code"); | ||
| setIsApplied(false); | ||
| return; | ||
| } | ||
| if (coupon.trim().toUpperCase() === "VIGYBAG") { | ||
| setMessage("Coupon applied successfully! 🎉 10% discount added"); | ||
| setIsApplied(true); | ||
| } else { | ||
| setMessage("Invalid redeem code ❌"); | ||
| setIsApplied(false); | ||
| } | ||
| }; |
There was a problem hiding this comment.
🧩 Analysis chain
🏁 Script executed:
# First, let's look at the file structure
fd "OrderSummary" --type f 2>/dev/null | head -20Repository: codervivek5/VigyBag
Length of output: 105
🏁 Script executed:
# Check the dashboard-cart.jsx file directly for context around lines 121-134
wc -l src/User/pages/Dashboard/dashboard-cart.jsxRepository: codervivek5/VigyBag
Length of output: 110
🏁 Script executed:
# Read the actual lines mentioned in the review
sed -n '117,165p' src/User/pages/Dashboard/dashboard-cart.jsxRepository: codervivek5/VigyBag
Length of output: 1503
🏁 Script executed:
# Search for OrderSummary and Subtotal components to understand their props
fd -e jsx -e js -e ts | xargs grep -l "OrderSummary\|Subtotal" | head -10Repository: codervivek5/VigyBag
Length of output: 286
🏁 Script executed:
# Check if discount/coupon state is passed anywhere in the checkout flow
rg -n "isApplied\|discount" src/User/pages/Dashboard/dashboard-cart.jsx -A 2 -B 2Repository: codervivek5/VigyBag
Length of output: 45
🏁 Script executed:
# Read OrderSummary component to understand its props
cat -n src/User/components/Order/OrderSummary.jsxRepository: codervivek5/VigyBag
Length of output: 3535
🏁 Script executed:
# Search in dashboard-cart.jsx for how OrderSummary is used
grep -n "OrderSummary\|<Subtotal\|discount\|coupon" src/User/pages/Dashboard/dashboard-cart.jsxRepository: codervivek5/VigyBag
Length of output: 498
🏁 Script executed:
# Check if there's any discount calculation or application in the checkout process
grep -rn "discount\|coupon" src/User/pages/Order/Checkout.jsx src/User/pages/Order/Cart.jsx 2>/dev/null | head -20Repository: codervivek5/VigyBag
Length of output: 137
🏁 Script executed:
# Verify OrderSummary is called without props in dashboard-cart.jsx
sed -n '290,310p' src/User/pages/Dashboard/dashboard-cart.jsxRepository: codervivek5/VigyBag
Length of output: 449
🏁 Script executed:
# Check the exact indentation at line 127 to confirm the issue
sed -n '122,130p' src/User/pages/Dashboard/dashboard-cart.jsx | cat -ARepository: codervivek5/VigyBag
Length of output: 365
Discount is announced but never actually applied to the order total.
The isApplied state is never passed to OrderSummary, which has no parameters and always calculates total = itemsTotal + shipping without any discount deduction. Users see "10% discount added" while being charged full price.
Also, line 127 has broken indentation (missing leading spaces), and the coupon code "VIGYBAG" is hardcoded in client-side JavaScript, making it trivially discoverable.
The discount logic must be integrated with OrderSummary—either by passing the discount as a prop, storing it in Redux alongside the total, or moving the coupon validation to the backend.
🤖 Prompt for AI Agents
In `@src/User/pages/Dashboard/dashboard-cart.jsx` around lines 121 - 134,
handleRedeem announces a 10% discount but never changes the OrderSummary total
because isApplied isn't passed down and OrderSummary still uses total =
itemsTotal + shipping; fix by wiring the discount into the pricing flow: compute
a discountAmount (e.g., 10% of itemsTotal) in handleRedeem (or derive a boolean
discountApplied from setIsApplied) and pass it as a prop to OrderSummary (or
persist it to Redux if you prefer global state) so OrderSummary recalculates
total = itemsTotal - discountAmount + shipping; also correct the indentation
around the coupon check in handleRedeem and remove the hardcoded "VIGYBAG" from
client-side code—validate the coupon server-side or fetch valid codes from a
secure endpoint instead of embedding the string.
| setIsApplied(false); | ||
| return; | ||
| } | ||
| if (coupon.trim().toUpperCase() === "VIGYBAG") { |
There was a problem hiding this comment.
Indentation inconsistency.
Line 127 is missing leading whitespace, breaking the visual alignment with the surrounding if block (lines 122–126). This appears to be an accidental dedent.
Proposed fix
-if (coupon.trim().toUpperCase() === "VIGYBAG") {
+ if (coupon.trim().toUpperCase() === "VIGYBAG") {📝 Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| if (coupon.trim().toUpperCase() === "VIGYBAG") { | |
| if (coupon.trim().toUpperCase() === "VIGYBAG") { |
🤖 Prompt for AI Agents
In `@src/User/pages/Dashboard/dashboard-cart.jsx` at line 127, The if-statement
checking the coupon value (if (coupon.trim().toUpperCase() === "VIGYBAG")) is
accidentally dedented and should be indented to match the surrounding block
(lines 122–126); update the indentation of that line so it aligns with the other
statements in the same block (referencing the coupon.trim().toUpperCase()
comparison in dashboard-cart.jsx) to restore consistent visual alignment.
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
|
Congratulations, Your pull request has been successfully merged 🥳🎉 Thank you for your valuable contribution to the project 🚀 Keep contributing!! ✨ 📢 Don’t forget to share your VigyBag PR on LinkedIn and tag @VigyBag and me — we’d love to celebrate your achievement with you! 🔗💡 |
Fixes Issue
Closes #2727
Changes proposed
Implemented coupon redeem functionality in the cart checkout flow
Added validation for a sample redeem code VIGYBAG
Applied a 10% discount when the valid coupon is used
Displayed success message for valid coupon and error message for invalid codes
Ensured coupon input handling is case-insensitive and trimmed for better UX
Note to reviewers:
This implementation currently supports a single sample coupon as per requirement
Logic is kept simple and frontend-only for now
Can be easily extended later to support multiple coupons or backend validation
Summary by CodeRabbit