v231212-dashboard-stripe

[sync-by-unito]

capture-cam, capture-iframe, Visual Workspace for Innovation (miro.com)

https://miro.com/app/board/o9J_knEiIYo=/?moveToWidget=3458764534151525217&cot=14

Miro for Stipe pricing table subscription

https://miro.com/app/board/o9J_knEiIYo=/?moveToWidget=3458764572789500590&cot=14

https://miro.com/app/board/o9J_knEiIYo=/?moveToWidget=3458764572789500590&cot=14

﹍Product code:﹍

﹍Release milestone:﹍

﹍Testing level:﹍

﹍Release note:﹍

﹍Expectation:﹍

﹍Known Issue:﹍

﹍Limitation:﹍

Users need to input the emails used to register Capture account manually.

﹍Test Link﹍:

https://dashboard.captureapp.xyz/version-test/main

﹍Note:﹍

﹍Testing Results (add this after QA test)﹍:

﹍Testing Plan (add this after QA test):﹍

Testing Levels:

• A. Full test + backward compatibility
• B. Full test, no backward compatibility
• C. Feature test
• D. Issue fix retest
• E. Growth

┆Issue is synchronized with this Asana Milestone by Unito
┆Created By: James Chien

[sync-by-unito]

➤ James Chien commented:

Tammy Yang as Sherry Chung suggested, I might need your help and advice on where should I start the task, what's already done and what's yet to be done on the dashboard side.

[sync-by-unito]

➤ James Chien commented:

Bofu Chen I (and Olga) also need your help for the Stripe account

[sync-by-unito]

➤ Bofu Chen commented:

James ChienOlga shared the Stripe info on Signal DMs

[sync-by-unito]

➤ James Chien commented:

Tammy Yang need your help on the information on starting this task. Do we currently have a WIP page for dashboard stripe subscription or I have to start the pages from scratch?

The dashboard figma ( https://www.figma.com/file/IWaGVbic6exBvzRJersgh0/Capture-Dashboard?type=design&node-id=17-41&mode=design ) only has no subscription page, so the subscription page does not have a figma. The goal is show clear information on the pricing plan as the Capture website and allow user to choose one, is that correct?

I'm currently working on Capture Eye task, but I want to breakdown this task first and avoid duplicate effort if anything has already been done.

[sync-by-unito]

➤ James Chien commented:

Bofu Chen Please let me know when you can receive the 2FA code of Stripe account for me

[sync-by-unito]

➤ Sherry Chung commented:

Huddle summary: Dashboard Stripe Subscriptions

• Using pricing page design ( https://captureapp.xyz/pricing ) for Show Subscription Options first (see screenshot) to avoid blocking for the implementation.

• Implementing subscription with stripe flow for design in Bump @capacitor/cli from 2.2.1 to 2.3.0 #1.
• Task for Noir: Update Figma for subscription plan design.

@tammy ( https://dt42-numbers.slack.com/team/U046CC276 ), let me know your thoughts or any additional suggestions!

[sync-by-unito]

➤ Bofu Chen commented:

James Chien I can do 2FA freely before 5:20pm

[sync-by-unito]

➤ Bofu Chen commented:

To be clear, I've created the Stripe products for the basic and advanced plans. I also have created a Stripe subscription table.

If we want to change the UX to that user clicks the "CHOOSE PLAN" button and show the subscription page directly, we only need to change the hyperlink and do not need to implement anything new.

[sync-by-unito]

➤ James Chien commented:

Bofu Chen Sign-in code sent on 16:06

[sync-by-unito]

➤ Bofu Chen commented:

James Chien choose 2FA instead of sending SMS because the phone number is Vera's

[sync-by-unito]

➤ Bofu Chen commented:

James Chien I had a short conversation with Sherry, and you do not need to create anything new on Stripe. You can see my previous comment for the details.

[sync-by-unito]

➤ James Chien commented:

Bofu Chen Please let me know when you can receive 2FA code for Stripe to create live mode API key, or you could create the key for me. Need only read permissions

[sync-by-unito]

➤ Bofu Chen commented:

James Chien Sent a read-only key on Signal DM

[sync-by-unito]

➤ Bofu Chen commented:

James Chien You can feel free to add Stripe 2FA for yourself. If it's not doable (e.g., only one device can use 2FA), I will do 2FA for you in the future.

[sync-by-unito]

➤ Tammy Yang commented:

Kenny HungScott Yan testing version release. Please note, the subscription is connected with the testing webhook, but the other part is connected with production backend. Therefore, you may need to use API to check if the subscription status is updated . (I am not sure whether James Chien submit the testing webhook to qa site or the production site)

[sync-by-unito]

➤ Olga commented:

From his claap, it appears to be the product site.

[sync-by-unito]

➤ James Chien commented:

All connected to production backend, for testing simplicity.

[sync-by-unito]

➤ James Chien commented:

Live mode webhook deployed. When using live mode pricing tables, it should update backend subscriptions.

[sync-by-unito]

➤ Scott Yan commented:

qa test There are two questions

1. when user click the plan. it leads to payment page . can auoto fill in the email .This prevents users from filling in non-capture account email
2. after pay done , can we redricter to dashboard account page ( better to have not to block the test results )

[sync-by-unito]

➤ James Chien commented:

Pre-fill email can be achieved by adding a customer-email property to the pricing table element. Tammy Yang Can you help adding this property?

<script async src="https://js.stripe.com/v3/pricing-table.js ( https://js.stripe.com/v3/pricing-table.js )"></script>

<stripe-pricing-table pricing-table-id="prctbl_1OM67sLz2IywdOP2LDvDpJzE"

publishable-key="pk_test_51MqvIdLz2IywdOP27AHWn5JBsOs9S7TZlZ3F5phG9SlsAoTQK7JdnC0oG6Qr7mx31pIVzMOxBTRpsn5dVICtLZ5I001DEaibmF"

customer-email="{{CUSTOMER_EMAIL}}">

</stripe-pricing-table>

For redirection after payment, I've setup it to redirect back to Capture dashboard home page in Stripe dashboard.

[sync-by-unito]

➤ Scott Yan commented:

James Chien For redirection qa test it will redirect back to Capture dashboard home page ( https://dashboard.captureapp.xyz/main )

[sync-by-unito]

➤ Tammy Yang commented:

Back to dashboard home page is good I think?

[sync-by-unito]

➤ Scott Yan commented:

Tammy Yang

1. back to dashboard wallet page I think it's more in line with expectations . ( From my personal point of view )
2. when user click the plan. it leads to payment page . can auoto fill in the email .This prevents users from filling in non-capture account email . from James Chien feedback can we add this?

[sync-by-unito]

➤ Tammy Yang commented:

The widget does not allow me (dashboard) to input the email. Need James' feedback.

[sync-by-unito]

➤ Scott Yan commented:

James Chien ^^

[sync-by-unito]

➤ Scott Yan commented:

If it really doesn't work, can you add some text to let users know that they need to use the same email as their account number?

[sync-by-unito]

➤ Scott Yan commented:

Sherry ChungKenny Hung this is strip flow viedo also can help to look it ^^

[sync-by-unito]

➤ Tammy Yang commented:

According to the huddle

1. Medium for now
2. Arrange the task as High priority in Jan

[sync-by-unito]

➤ James Chien commented:

Tammy Yang Did you try the code snippet in my comment ( https://app.asana.com/0/0/1206089738135066/1206147770796504/f )? It works on my end, not sure if dashboard could dynamically pass email to the attribute though

[sync-by-unito]

➤ Sherry Chung commented:

Scott YanJames Chien According to the discuss with Tammy, We're ok with current limitation (user need to input the same email as Capture account in Stripe payment dialog)

We'll put this as known issue and fix it in the future

[sync-by-unito]

➤ Tammy Yang commented:

Limitation is resolved by adding customer-email="" , thank James Chien

[sync-by-unito]

➤ Bofu Chen commented:

The customizable fields: https://stripe.com/docs/payments/checkout/pricing-table#track-subscriptions ( https://stripe.com/docs/payments/checkout/pricing-table#track-subscriptions )

Just a note that we might need them in the future.

[sync-by-unito]

➤ James Chien commented:

Tammy YangKenny HungBofu Chen

Just asked on Stripe dev-help channel and got response that it's not possible to make the pricing table upgrade/downgrade plans.

My suggestion is:

Dashboard detect user's subscription status.

1. If freemium, show pricing table
2. If subscribed, show customer portal ( https://dt42-numbers.slack.com/archives/C05UCBW1CE4/p1702629878851359 ) where user can update/cancel subscription

Also worth mentioning Stripe's dev-help channel answers questions lightning fast. Could be very helpful Discord ( https://discord.com/invite/RuJnSBXrQn )

======

1. James
   — 今天 17:59
   Hi, I use pricing table embed script and present multiple subscription plans to users.
   If the user subscribed to plan A first, then later want to switch to plan B, doing the subscription in the pricing table again will result in subscribing both plan A and B and being charged with both plan.
   However in customer portal user can upgrade or downgrade the plan without any issue.
   Is there any way to modify the pricing table behavior to allow it to let user update their plans? Or redirect user to customer portal when user has already subscribed?
2. Dingbot 已將 soma 加入到討論串。 — 今天 18:00
3. soma — 今天 18:00
   hi there!
4. [18:01]
   the Pricing Table is used only to create new Subscriptions. if you want users to udpate an existing Subscription, then you should use the Customer Portal yes

[sync-by-unito]

➤ Tammy Yang commented:

Ok, let's fix this in the next sprint