From 1dc4d6c9d5c7862296f6af8eaeb7095a07d44863 Mon Sep 17 00:00:00 2001
From: David Taylor <david@taylorhq.com>
Date: Thu, 14 Nov 2024 16:23:53 +0000
Subject: [PATCH] UX: Hide all header and footer content on chat routes

---
 .../discourse/app/controllers/application.js  |  5 +++
 .../discourse/app/lib/transformer/registry.js |  1 +
 .../discourse/app/templates/application.hbs   | 44 ++++++++++++-------
 .../discourse/initializers/chat-setup.js      | 10 +++++
 .../stylesheets/common/core-extensions.scss   |  7 ---
 5 files changed, 43 insertions(+), 24 deletions(-)

diff --git a/app/assets/javascripts/discourse/app/controllers/application.js b/app/assets/javascripts/discourse/app/controllers/application.js
index 45bb0eedaf6..8f61937e09d 100644
--- a/app/assets/javascripts/discourse/app/controllers/application.js
+++ b/app/assets/javascripts/discourse/app/controllers/application.js
@@ -2,6 +2,7 @@ import Controller from "@ember/controller";
 import { action } from "@ember/object";
 import { service } from "@ember/service";
 import runAfterFramePaint from "discourse/lib/after-frame-paint";
+import { applyValueTransformer } from "discourse/lib/transformer";
 import { isTesting } from "discourse-common/config/environment";
 import discourseDebounce from "discourse-common/lib/debounce";
 import deprecated from "discourse-common/lib/deprecated";
@@ -39,6 +40,10 @@ export default class ApplicationController extends Controller {
     return this.showFooter && this.siteSettings.enable_powered_by_discourse;
   }
 
+  get showBannerContent() {
+    return applyValueTransformer("show-application-banner-content", true);
+  }
+
   @discourseComputed
   canSignUp() {
     return (
diff --git a/app/assets/javascripts/discourse/app/lib/transformer/registry.js b/app/assets/javascripts/discourse/app/lib/transformer/registry.js
index fb641495c61..50ecc15b473 100644
--- a/app/assets/javascripts/discourse/app/lib/transformer/registry.js
+++ b/app/assets/javascripts/discourse/app/lib/transformer/registry.js
@@ -13,4 +13,5 @@ export const VALUE_TRANSFORMERS = Object.freeze([
   "mentions-class",
   "more-topics-tabs",
   "post-menu-buttons",
+  "show-application-banner-content",
 ]);
diff --git a/app/assets/javascripts/discourse/app/templates/application.hbs b/app/assets/javascripts/discourse/app/templates/application.hbs
index 7dab457db2e..a8d1e7a69f5 100644
--- a/app/assets/javascripts/discourse/app/templates/application.hbs
+++ b/app/assets/javascripts/discourse/app/templates/application.hbs
@@ -47,34 +47,44 @@
 
     <LoadingSliderFallbackSpinner />
 
-    <PluginOutlet @name="before-main-outlet" />
+    {{#if this.showBannerContent}}
+      <PluginOutlet @name="before-main-outlet" />
+    {{/if}}
 
     <div id="main-outlet">
-      <PluginOutlet @name="above-main-container" @connectorTagName="div" />
+      {{#if this.showBannerContent}}
+        <PluginOutlet @name="above-main-container" @connectorTagName="div" />
+      {{/if}}
       <div class="container" id="main-container">
-        {{#if this.showTop}}
-          <CustomHtml @name="top" />
+        {{#if this.showBannerContent}}
+          {{#if this.showTop}}
+            <CustomHtml @name="top" />
+          {{/if}}
+          <NotificationConsentBanner />
+          <PwaInstallBanner />
+          <GlobalNotice />
+          <PluginOutlet
+            @name="top-notices"
+            @connectorTagName="div"
+            @outletArgs={{hash currentPath=this.router._router.currentPath}}
+          />
         {{/if}}
-        <NotificationConsentBanner />
-        <PwaInstallBanner />
-        <GlobalNotice />
-        <PluginOutlet
-          @name="top-notices"
-          @connectorTagName="div"
-          @outletArgs={{hash currentPath=this.router._router.currentPath}}
-        />
       </div>
 
       {{outlet}}
 
       <CardContainer />
-      <PluginOutlet
-        @name="main-outlet-bottom"
-        @outletArgs={{hash showFooter=this.showFooter}}
-      />
+      {{#if this.showBannerContent}}
+        <PluginOutlet
+          @name="main-outlet-bottom"
+          @outletArgs={{hash showFooter=this.showFooter}}
+        />
+      {{/if}}
     </div>
 
-    <PluginOutlet @name="after-main-outlet" />
+    {{#if this.showBannerContent}}
+      <PluginOutlet @name="after-main-outlet" />
+    {{/if}}
 
     {{#if this.showPoweredBy}}
       <PoweredByDiscourse />
diff --git a/plugins/chat/assets/javascripts/discourse/initializers/chat-setup.js b/plugins/chat/assets/javascripts/discourse/initializers/chat-setup.js
index 149954d299d..2d285e262e7 100644
--- a/plugins/chat/assets/javascripts/discourse/initializers/chat-setup.js
+++ b/plugins/chat/assets/javascripts/discourse/initializers/chat-setup.js
@@ -172,6 +172,16 @@ class ChatSetupInit {
         category: "organisms",
         id: "chat",
       });
+
+      api.registerValueTransformer(
+        "show-application-banner-content",
+        ({ value }) => {
+          if (this.router.currentRouteName.startsWith("chat.")) {
+            return false;
+          }
+          return value;
+        }
+      );
     });
   }
 
diff --git a/plugins/chat/assets/stylesheets/common/core-extensions.scss b/plugins/chat/assets/stylesheets/common/core-extensions.scss
index 89725bb9c3a..095a22b9824 100644
--- a/plugins/chat/assets/stylesheets/common/core-extensions.scss
+++ b/plugins/chat/assets/stylesheets/common/core-extensions.scss
@@ -1,10 +1,3 @@
-.has-full-page-chat {
-  .global-notice,
-  .bootstrap-mode-notice {
-    display: none;
-  }
-}
-
 .admin-plugins {
   [data-plugin-name="chat"] {
     display: none;