MNTOR-949/check subscriptions on dashboard (#3147)

* MNTOR-949 - check subscriptions on dashboard page

While we're figuring out with the subplat team what the ideal intended
flow here is, this change explcitly checks the subscription status
using the available API before showing or hiding the "Subscribe" button.

* config: sentry complains about missing config

* restore commit 5dec4c02c0 for subscription scope

.env-dist

@@ -38,12 +38,15 @@ SES_NOTIFICATION_LOG_ONLY=
 # leave FXA_ENABLED empty to disable FXA
 FXA_ENABLED=
 FXA_SETTINGS_URL=https://accounts.stage.mozaws.net/settings
+FXA_SUBSCRIPTIONS_URL=https://accounts.stage.mozaws.net/subscriptions
+
 OAUTH_CLIENT_ID=edd29a80019d61a1
 OAUTH_CLIENT_SECRET=get-this-from-groovecoder-or-fxmonitor-engineering
 OAUTH_AUTHORIZATION_URI=https://oauth.stage.mozaws.net/v1/authorization
 OAUTH_PROFILE_URI=https://profile.stage.mozaws.net/v1/profile
 OAUTH_TOKEN_URI=https://oauth.stage.mozaws.net/v1/token
 OAUTH_ACCOUNT_URI = "https://oauth.accounts.firefox.com/v1"
+OAUTH_API_URI="https://api-accounts.stage.mozaws.net/v1"
 
 # HIBP API for breach data
 # How many seconds to wait before refreshing upstream breach data from HIBP
@@ -120,4 +123,5 @@ E2E_TEST_ACCOUNT_PASSWORD=
 # Monitor Premium features
 PREMIUM_ENABLED=
 # Link to start user on the subscription process. PREMIUM_ENABLED must be set to `true`.
-SUBSCRIBE_PREMIUM_URL=
+PREMIUM_PRODUCT_ID=prod_NErZh679W62lai
+PREMIUM_PLAN_ID_US=price_1MUNq0Kb9q6OnNsL4BoJgepf

sentry.edge.config.ts

@@ -0,0 +1,4 @@
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+

src/app/(nextjs_migration)/(authenticated)/user/breaches/page.tsx

@@ -71,6 +71,50 @@ export default async function UserBreaches() {
     user: session!.user as any,
   });
 
+  type FxaSubscriptionResponse = {
+    subscriptions: Array<{
+      product_id: string;
+      plan_id: string;
+      status: "active";
+    }>;
+  };
+
+  // Fetch list of subscriptions.
+  let subscriptions;
+  const bearerToken = session?.user.subscriber?.fxa_access_token;
+  if (bearerToken) {
+    const result = await fetch(
+      `${process.env.OAUTH_API_URI}/oauth/mozilla-subscriptions/customer/billing-and-subscriptions`,
+      {
+        headers: {
+          "Content-Type": "application/json",
+          authorization: `Bearer ${bearerToken}`,
+        },
+      }
+    );
+    if (result.ok) {
+      subscriptions = await result.json();
+    }
+  } else {
+    console.error("User has no bearer token");
+  }
+
+  const isUserSubscribed = (subscriptions: FxaSubscriptionResponse) => {
+    if (!subscriptions) {
+      return false;
+    }
+    for (const subscription of subscriptions.subscriptions) {
+      if (
+        subscription.product_id === process.env.PREMIUM_PRODUCT_ID &&
+        subscription.plan_id === process.env.PREMIUM_PLAN_ID_US &&
+        subscription.status === "active"
+      ) {
+        return true;
+      }
+    }
+    return false;
+  };
+
   return (
     <>
       {/* These scripts predate the use of React and thus shouldn’t wait for
@@ -96,11 +140,11 @@ export default async function UserBreaches() {
 
       <main data-partial="breaches">
         {process.env.PREMIUM_ENABLED === "true" &&
-        !session?.user.fxa?.subscriptions?.includes("monitor") ? (
+        !isUserSubscribed(subscriptions) ? (
           <section>
             <a
               className="button primary"
-              href={process.env.SUBSCRIBE_PREMIUM_URL}
+              href={`${process.env.FXA_SUBSCRIPTIONS_URL}/products/${process.env.PREMIUM_PRODUCT_ID}?plan=${process.env.PREMIUM_PLAN_ID_US}`}
             >
               Subscribe to Premium
             </a>

src/app/api/utils/auth.ts

@@ -57,7 +57,7 @@ export const authOptions: AuthOptions = {
       authorization: {
         url: AppConstants.OAUTH_AUTHORIZATION_URI,
         params: {
-          scope: "profile",
+          scope: "profile https://identity.mozilla.com/account/subscriptions",
           access_type: "offline",
           action: "email",
           prompt: "login",

src/app/api/v1/premium/route.ts

@@ -10,20 +10,13 @@ export async function GET(req: NextRequest) {
     // NOTE: the email address passed here cannot
     // be trusted, we must also check that the
     // `subscriptions` claim on the FxA token contains
-    // "monitor".
+    // "monitor", or call the auth server API to confirm.
 
     const { searchParams } = new URL(req.url);
     const _email = searchParams.get("email");
 
-    // TODO: The user either needs to be signed in again, or the
-    // JWT from FxA refreshed, in order to read the latest
-    // subscriptions.
-    //
-    // For now, redirect to the built-in sign-out, which will then
-    // send the user to the dashboard.
-
     return NextResponse.redirect(
-      `${process.env.SERVER_URL}/api/auth/signout?callbackUrl=/user/breaches`,
+      `${process.env.SERVER_URL}/user/breaches`,
       302
     );
   } catch (e) {