When the user is on free plan, the button in the basic plan card will stay disabled.
Upon clicking the subscribe button on the pro plan card, the Lemon squeezy pop up will open up
Upon successfully paying up, the user should see the toast that their subscription has been started.
If the user is currently subscribed, they should see the cancel button on the pro card (instead of Subscribe).
Upon clicking the Cancel subscription button, the user should first see a confirmation dialog. If the user confirms, then the subscriptions should be cancelled via Lemon Squeezy API call (refer to CourseLit Subscription app for the endpoint details)
If the subscription has been cancelled but it hasn't expired, then the pro plan should show Resume subscription button. Upon clicking the resume subscription button, the subscription should be resumed on Lemon squeezy.
The new billing screen will enable to the user to manage their subscription.
There will be two plans
For the pro plan, the user needs to subscribe.
Design https://www.figma.com/file/PC6z6qS8DiSK12fcRR3UbG/MediaLit?type=design&node-id=0%3A1&mode=design&t=BIx3Y3MNLqmafLqb-1
Behavior of UI
subscribebutton on the pro plan card, the Lemon squeezy pop up will open upSubscribe).Cancel subscriptionbutton, the user should first see a confirmation dialog. If the user confirms, then the subscriptions should be cancelled via Lemon Squeezy API call (refer to CourseLit Subscription app for the endpoint details)Resume subscriptionbutton. Upon clicking the resume subscription button, the subscription should be resumed on Lemon squeezy.