MNTOR-949 - subscription platform integration for nextjs app (#3098)

* MNTOR-949 - subscription platform integration for nextjs app

---------

Co-authored-by: Vincent <Vinnl@users.noreply.github.com>

.env-dist

@@ -116,3 +116,8 @@ GA4_MEASUREMENT_ID=test
 E2E_TEST_BASE_URL=
 E2E_TEST_ACCOUNT_EMAIL=
 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=

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

@@ -157,6 +157,11 @@ export default async function UserBreaches() {
       <Script type="module" src="/nextjs_migration/client/js/breaches.js" />
       <Script type="module" src="/nextjs_migration/client/js/dialog.js" />
       <main data-partial="breaches">
+        <section>
+          {(process.env.PREMIUM_ENABLED === "true" && !session?.user.fxa?.subscriptions?.includes("monitor")) ?
+            <a className="button primary" href={process.env.SUBSCRIBE_PREMIUM_URL}>Subscribe to Premium</a>
+            : ''}
+        </section>
         <section>
           <header className="breaches-header">
             <h1

src/app/api/auth/[...nextauth]/route.ts

@@ -38,6 +38,7 @@ interface FxaProfile {
   /** URL to an avatar image for the current user */
   avatar: string;
   avatarDefault: boolean;
+  subscriptions?: Array<string>;
 }
 
 export const authOptions: AuthOptions = {
@@ -103,6 +104,7 @@ export const authOptions: AuthOptions = {
           metricsEnabled: profile.metricsEnabled,
           avatar: profile.avatar,
           avatarDefault: profile.avatarDefault,
+          subscriptions: profile.subscriptions,
         };
       }
       if (account && typeof profile?.email === "string") {
@@ -183,6 +185,7 @@ export const authOptions: AuthOptions = {
           metricsEnabled: token.fxa.metricsEnabled,
           avatar: token.fxa.avatar,
           avatarDefault: token.fxa.avatarDefault,
+          subscriptions: token.fxa.subscriptions,
         };
       }
       if (token.subscriber) {

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

@@ -0,0 +1,29 @@
+/* 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/. */
+
+import { NextResponse } from "next/server";
+import type { NextRequest } from "next/server";
+
+export async function GET(req: NextRequest) {
+  try {
+    // NOTE: the email address passed here cannot
+    // be trusted, we must also check that the
+    // `subscriptions` claim on the FxA token contains
+    // "monitor".
+
+    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`, 302);
+  } catch (e) {
+    return NextResponse.json({ success: false }, { status: 500 });
+  }
+}

src/next-auth.d.ts

@@ -17,6 +17,7 @@ declare module "next-auth" {
     /** URL to an avatar image for the current user */
     avatar: string;
     avatarDefault: boolean;
+    subscriptions: Array<string>;
   }
 
   /** Session data available after deserialising the JWT */
@@ -30,6 +31,7 @@ declare module "next-auth" {
         /** URL to an avatar image for the current user */
         avatar: string;
         avatarDefault: boolean;
+        subscriptions: Array<string>;
       };
       subscriber?: Subscriber;
     } & DefaultSession["user"];
@@ -47,6 +49,7 @@ declare module "next-auth/jwt" {
       /** URL to an avatar image for the current user */
       avatar: string;
       avatarDefault: boolean;
+      subscriptions: Array<string>;
     };
     subscriber?: Subscriber;
   }