Bug 1878700 part 2 - show DLP icon in toolbar when content analysis is active r=handyman,desktop-theme-reviewers,fluent-reviewers,emilio,bolsson,Gijs

This also opens SUMO when the icon is clicked on. (the real page will be made as a part of bug 1882595)

Differential Revision: https://phabricator.services.mozilla.com/D203686

browser/base/content/appmenu-viewcache.inc.xhtml

@@ -772,5 +772,20 @@
     </vbox>
   </panelview>
 
+  <panelview id="content-analysis-panel" class="PanelUI-subView" role="document" mainview-with-header="true">
+    <vbox id="content-analysis-panel-container" role="alertdialog" aria-labelledby="content-analysis-header">
+      <hbox class="panel-header">
+        <html:h1 id="content-analysis-header" data-l10n-id="content-analysis-panel-title"/>
+      </hbox>
+      <description id="content-analysis-panel-description">
+        <!-- Real SUMO link will be put in for bug 1882595 -->
+        <html:a is="moz-support-link"
+                data-l10n-name="info"
+                class="learnMore"
+                support-page="drm-content"/>
+      </description>
+    </vbox>
+  </panelview>
+
 #include ../../components/reportbrokensite/content/reportBrokenSitePanel.inc.xhtml
 </html:template>

browser/base/content/browser.js

@@ -1869,7 +1869,7 @@ var gBrowserInit = {
     BrowserOffline.init();
     CanvasPermissionPromptHelper.init();
     WebAuthnPromptHelper.init();
-    ContentAnalysis.initialize();
+    ContentAnalysis.initialize(document);
 
     // Initialize the full zoom setting.
     // We do this before the session restore service gets initialized so we can

browser/base/content/navigator-toolbox.inc.xhtml

@@ -101,9 +101,8 @@
         <label data-l10n-id="private-browsing-indicator-label"></label>
       </hbox>
       <toolbarbutton id="content-analysis-indicator"
-                     class="toolbarbutton-1">
-        <image class="content-analysis-indicator-icon"/>
-      </toolbarbutton>
+                     oncommand="ContentAnalysis.showPanel(this, PanelUI);"
+                     class="toolbarbutton-1 content-analysis-indicator-icon"/>
 
 #include titlebar-items.inc.xhtml
 

browser/components/contentanalysis/content/ContentAnalysis.sys.mjs

@@ -25,6 +25,7 @@ XPCOMUtils.defineLazyServiceGetter(
 
 ChromeUtils.defineESModuleGetters(lazy, {
   clearTimeout: "resource://gre/modules/Timer.sys.mjs",
+  PanelMultiView: "resource:///modules/PanelMultiView.sys.mjs",
   setTimeout: "resource://gre/modules/Timer.sys.mjs",
 });
 
@@ -211,7 +212,7 @@ export const ContentAnalysis = {
    * Registers for various messages/events that will indicate the
    * need for communicating something to the user.
    */
-  initialize() {
+  initialize(doc) {
     if (!this.isInitialized) {
       this.isInitialized = true;
       this.initializeDownloadCA();
@@ -223,6 +224,17 @@ export const ContentAnalysis = {
         );
       });
     }
+
+    // Do this even if initialized so the icon shows up on new windows, not just the
+    // first one.
+    if (lazy.gContentAnalysis.isActive) {
+      doc.l10n.setAttributes(
+        doc.getElementById("content-analysis-indicator"),
+        "content-analysis-indicator-tooltip",
+        { agentName: lazy.agentName }
+      );
+      doc.documentElement.setAttribute("contentanalysisactive", "true");
+    }
   },
 
   async uninitialize() {
@@ -390,6 +402,19 @@ export const ContentAnalysis = {
     }
   },
 
+  async showPanel(element, panelUI) {
+    element.ownerGlobal.ensureCustomElements("moz-support-link");
+    await element.ownerDocument.l10n.setAttributes(
+      lazy.PanelMultiView.getViewNode(
+        element.ownerDocument,
+        "content-analysis-panel-description"
+      ),
+      "content-analysis-panel-text",
+      { agentName: lazy.agentName }
+    );
+    panelUI.showSubView("content-analysis-panel", element);
+  },
+
   _showAnotherPendingDialog(aBrowsingContext) {
     const otherBrowsingContext =
       this.dlpBusyViewsByTopBrowsingContext.getBrowsingContextWithPendingNotification(

browser/locales/en-US/browser/browser.ftl

@@ -970,6 +970,16 @@ data-reporting-notification-button =
 # Label for the indicator shown in the private browsing window titlebar.
 private-browsing-indicator-label = Private browsing
 
+# Tooltip for the indicator shown in the window titlebar when content analysis is active.
+# Variables:
+#   $agentName (String): The name of the DLP agent that is connected
+content-analysis-indicator-tooltip =
+    .tooltiptext = Data loss prevention (DLP) by { $agentName }. Click for more info.
+content-analysis-panel-title = Data protection
+# Variables:
+#   $agentName (String): The name of the DLP agent that is connected
+content-analysis-panel-text = Your organization uses { $agentName } to protect against data loss. <a data-l10n-name="info">Learn more</a>
+
 ## Unified extensions (toolbar) button
 
 unified-extensions-button =

browser/themes/shared/customizableui/panelUI-shared.css

@@ -2180,3 +2180,9 @@ panelview {
   padding: var(--space-xxlarge) 0 var(--space-medium);
   gap: var(--space-small);
 }
+
+/* ----- Content Analysis indicator panel ----- */
+
+#content-analysis-panel-container {
+  padding: 8px;
+}