Add FE tracking to subscription management pages
### Problem Currently we are tracking clicks on subscription card buttons. This shows a general interest on features but doesn't reflect that user wants to actually do this action. The main goal of this iteration is to be get funnel data (Click on a link on the card -> Click on a purchase confirmation -> Transaction success/fail) ### Proposal Update the existing tracking for subscription card buttons and add tracking to the actual pages. Attention: some tracking is already implemented, we would just need to update the event labels & actions. #### Renew subscription For all the tracking events set `event_label` as `renew_subscription_sm` / `renew_subscription_saas` | FE/BE | Page | Description | Event category | Event action | | ------ | ------ | ------ | ------ | ------ | |FE| `/subscriptions/` | ![Screenshot_2022-11-15_at_22.01.05](/uploads/995602032ea176e4f743d7831c7f314e/Screenshot_2022-11-15_at_22.01.05.png) <br> User clicks `Renew` button <br> | Webstore | `click_card` | |FE| `subscriptions/A-S000XXX/renew` | ![Screenshot_2022-11-15_at_22.00.21](/uploads/baaead067a1721d4e733f0c8d687c74f/Screenshot_2022-11-15_at_22.00.21.png) <br> User clicks `Renew subscription` button <br> | Webstore | `click_renew` | |BE| - | Transaction is successful | SubscriptionsController | `transaction_successful` | |BE| - | Transaction has failed | SubscriptionsController | `transaction_failed` | #### Add seats For all the tracking events set `event_label` as `add_seats_sm` / `add_seats_saas` | FE/BE | Page | Description | Event category | Event action | | ------ | ------ | ------ | ------ | ------ | |FE| `/subscriptions/` | ![Screenshot_2022-11-10_at_17.09.54](/uploads/0ac421625c7358b1308ea18167bac616/Screenshot_2022-11-10_at_17.09.54.png) <br> User clicks `Add seats` button <br> | Webstore | `click_card` | |FE| `/subscriptions/A-S000XXX/edit?transaction=extra_seats` | ![Screenshot_2022-11-10_at_13.49.05](/uploads/7eed989c7b353d28ff42dae5d66073fe/Screenshot_2022-11-10_at_13.49.05.png) <br> User clicks `Purchase seats` button <br> | Webstore | `click_purchase` | |BE| - | Transaction is successful | SubscriptionsController | `transaction_successful` | |BE| - | Transaction has failed | SubscriptionsController | `transaction_failed` | #### Upgrade subscription For all the tracking events set `event_label` as `upgrade_subscription_sm` / `upgrade_subscription_saas` | FE/BE | Page | Description | Event category | Event action | | ------ | ------ | ------ | ------ | ------ | |FE| `/subscriptions/` | ![Screenshot_2022-11-15_at_21.47.33](/uploads/58f3598186f9f6e2760242de8e591a92/Screenshot_2022-11-15_at_21.47.33.png) <br> User clicks `Upgrade plan` button <br> | Webstore | `click_card` | |FE| `subscriptions/A-S000XXX/upgrade/new` | ![Screenshot_2022-11-15_at_21.48.54](/uploads/f83fa6c412d9cc40cf025607aa66196b/Screenshot_2022-11-15_at_21.48.54.png) <br> User clicks `Upgrade subscription` button <br> | Webstore | `click_upgrade` | |BE| - | Transaction is successful | SubscriptionUpgradesController | `transaction_successful` | |BE| - | Transaction has failed | SubscriptionUpgradesController | `transaction_failed` | #### Change linked namespace For all the tracking events set `event_label` as `change_namespace` (as this is only possible for SaaS) | FE/BE | Page | Description | Event category | Event action | | ------ | ------ | ------ | ------ | ------ | |FE| `/subscriptions/` | ![Screenshot_2022-11-15_at_21.52.22](/uploads/1a3cabc49e9f3c85a7cf1a543bd3e7a1/Screenshot_2022-11-15_at_21.52.22.png) <br> User clicks `Change linked namespace` button <br> | Webstore | `click_card` | |FE| `subscriptions/A-S000XXX/edit?transaction=change_gitlab_group` | ![Screenshot_2022-11-15_at_21.53.19](/uploads/cae62d964c89492c56b2a9adaa4895d1/Screenshot_2022-11-15_at_21.53.19.png) <br> User clicks `Confirm changes` button <br> | Webstore | `click_change` | |BE| - | Transaction is successful | SubscriptionsController | `transaction_successful` | |BE| - | Transaction has failed | SubscriptionsController | `transaction_failed` | #### Cancel subscription For all the tracking events set `event_label` as `cancel_subscription_sm` / `cancel_subscription_saas` **Attention:** The modal only exists for SaaS users | FE/BE | Page | Description | Event category | Event action | | ------ | ------ | ------ | ------ | ------ | |FE| `/subscriptions/` | ![Screenshot_2022-11-15_at_21.55.26](/uploads/393a8923df5a19f1facaf05cf0c00948/Screenshot_2022-11-15_at_21.55.26.png) <br> User clicks `Cancel subscription` button <br> | Webstore | `click_card` | |FE| `subscriptions/` | ![Screenshot_2022-11-15_at_21.56.18](/uploads/90a9cff43dae4da6c27a1eb660f64d1c/Screenshot_2022-11-15_at_21.56.18.png) <br> In the modal that appears user clicks `Cancel subscription` button <br> | Webstore | `click_modal` | |BE| - | Transaction is successful | SubscriptionsController | `transaction_successful` | |BE| - | Transaction has failed **Note:** we don't have a try/catch around this action, we might need to add it to catch this failure | SubscriptionsController | `transaction_failed` | #### Resume subscription For all the tracking events set `event_label` as `resume_subscription_sm` / `resume_subscription_saas` **Attention:** There is extra confirmation, the click on the button on the card is the only FE event | FE/BE | Page | Description | Event category | Event action | | ------ | ------ | ------ | ------ | ------ | |FE| `/subscriptions/` | ![Screenshot_2022-11-15_at_22.02.20](/uploads/9dfa9866efcdcce7b25870b3807af512/Screenshot_2022-11-15_at_22.02.20.png) <br> User clicks `Resume subscription` button <br> | Webstore | `click_card` | |BE| - | Transaction is successful | SubscriptionsController | `transaction_successful` | |BE| - | Transaction has failed | SubscriptionsController | `transaction_failed` | ### Result ### Next steps (if any) - [x] Update dashboard: https://gitlab.com/gitlab-data/product-analytics/-/issues/1063+ ### How will we measure success?
epic