Fix subscription button text for different billing intervals
Fix subscription button text and enhance subscription handling
Problem:
- When a user has a monthly subscription and switches to the yearly billing interval tab, the button still shows "Manage" instead of "Subscribe" for the yearly plan, even though the user does not have a yearly subscription. If clicked, the button redirects to the Stripe checkout URL, which seems incorrect.
- The
getSubscriptionfunction retrieves data without filtering by the user.
Solution:
- Added
getUserSubscriptionsmethod insupabase/queriesto fetch user subscriptions, ordered by creation time in descending order. - Updated
Pricingcomponent to handle user subscriptions:- Show "Manage" button for subscribed products and redirect to the account management page.
- Show "Subscribe" button for unsubscribed products.
- Modified
PricingPageto fetch user and their subscriptions, and pass them to thePricingcomponent. - Adjusted
Accountpage to display the user's latest subscription and personal information. - Ensured that the button text accurately reflects the user's subscription status for the selected billing interval.
These changes improve the overall user experience by accurately reflecting the user's subscription status and providing appropriate actions based on their subscriptions.
If I have misunderstood any aspects of the problem or solution, please forgive my oversight. I look forward to your feedback and hope these changes align with the project's goals. Thank you for your understanding and support.
@skeleton1231 is attempting to deploy a commit to the Vercel Solutions Team on Vercel.
A member of the Team first needs to authorize it.
Thank for you opening a PR to make this example better.
We are sunsetting this example in favor of a newer, more modern SaaS starter example.
You can check it out here -> https://github.com/nextjs/saas-starter