From 46ecde5d63cd6460f5a295ea0f6121edb81f5c19 Mon Sep 17 00:00:00 2001
From: Jared Snider <116684653+JaredSnider-Bitwarden@users.noreply.github.com>
Date: Fri, 9 Aug 2024 10:09:40 -0400
Subject: [PATCH] PM-9603 - AnonLayout Dynamic Content Support - Add ability to
 avoid translating subtitle as we have designs where a user's email needs to
 go in the subtitle slot. (#10459)

---
 .../extension-anon-layout-wrapper.component.ts  | 10 +++++++++-
 .../anon-layout-wrapper.component.ts            | 17 +++++++++++++++--
 .../anon-layout/anon-layout-wrapper.stories.ts  |  5 ++++-
 3 files changed, 28 insertions(+), 4 deletions(-)

diff --git a/apps/browser/src/auth/popup/extension-anon-layout-wrapper/extension-anon-layout-wrapper.component.ts b/apps/browser/src/auth/popup/extension-anon-layout-wrapper/extension-anon-layout-wrapper.component.ts
index df6e313342..a16ca5862c 100644
--- a/apps/browser/src/auth/popup/extension-anon-layout-wrapper/extension-anon-layout-wrapper.component.ts
+++ b/apps/browser/src/auth/popup/extension-anon-layout-wrapper/extension-anon-layout-wrapper.component.ts
@@ -149,7 +149,15 @@ export class ExtensionAnonLayoutWrapperComponent implements OnInit, OnDestroy {
     }
 
     if (data.pageSubtitle) {
-      this.pageSubtitle = this.i18nService.t(data.pageSubtitle);
+      // If you pass just a string, we translate it by default
+      if (typeof data.pageSubtitle === "string") {
+        this.pageSubtitle = this.i18nService.t(data.pageSubtitle);
+      } else {
+        // if you pass an object, you can specify if you want to translate it or not
+        this.pageSubtitle = data.pageSubtitle.translate
+          ? this.i18nService.t(data.pageSubtitle.subtitle)
+          : data.pageSubtitle.subtitle;
+      }
     }
 
     if (data.pageIcon) {
diff --git a/libs/auth/src/angular/anon-layout/anon-layout-wrapper.component.ts b/libs/auth/src/angular/anon-layout/anon-layout-wrapper.component.ts
index 1c082323b1..a71f9101c9 100644
--- a/libs/auth/src/angular/anon-layout/anon-layout-wrapper.component.ts
+++ b/libs/auth/src/angular/anon-layout/anon-layout-wrapper.component.ts
@@ -10,7 +10,12 @@ import { AnonLayoutWrapperDataService } from "./anon-layout-wrapper-data.service
 
 export interface AnonLayoutWrapperData {
   pageTitle?: string;
-  pageSubtitle?: string;
+  pageSubtitle?:
+    | string
+    | {
+        subtitle: string;
+        translate: boolean;
+      };
   pageIcon?: Icon;
   showReadonlyHostname?: boolean;
   maxWidth?: "md" | "3xl";
@@ -99,7 +104,15 @@ export class AnonLayoutWrapperComponent implements OnInit, OnDestroy {
     }
 
     if (data.pageSubtitle) {
-      this.pageSubtitle = this.i18nService.t(data.pageSubtitle);
+      // If you pass just a string, we translate it by default
+      if (typeof data.pageSubtitle === "string") {
+        this.pageSubtitle = this.i18nService.t(data.pageSubtitle);
+      } else {
+        // if you pass an object, you can specify if you want to translate it or not
+        this.pageSubtitle = data.pageSubtitle.translate
+          ? this.i18nService.t(data.pageSubtitle.subtitle)
+          : data.pageSubtitle.subtitle;
+      }
     }
 
     if (data.pageIcon) {
diff --git a/libs/auth/src/angular/anon-layout/anon-layout-wrapper.stories.ts b/libs/auth/src/angular/anon-layout/anon-layout-wrapper.stories.ts
index 80fabe4061..7e6fda54a8 100644
--- a/libs/auth/src/angular/anon-layout/anon-layout-wrapper.stories.ts
+++ b/libs/auth/src/angular/anon-layout/anon-layout-wrapper.stories.ts
@@ -177,7 +177,10 @@ const initialData: AnonLayoutWrapperData = {
 
 const changedData: AnonLayoutWrapperData = {
   pageTitle: "enterpriseSingleSignOn",
-  pageSubtitle: "checkYourEmail",
+  pageSubtitle: {
+    subtitle: "user@email.com (non-translated)",
+    translate: false,
+  },
   pageIcon: RegistrationCheckEmailIcon,
 };