From 98bacbd2c6b9fe57167cd32af5eb4839b4a5d1f6 Mon Sep 17 00:00:00 2001
From: David Taylor <david@taylorhq.com>
Date: Thu, 21 Jul 2022 19:38:07 +0100
Subject: [PATCH] DEV: Use `RenderGlimmer` for experimental user menu (#17597)

`RenderGlimmer` means we can now drop the classic-component wrapper. The old `didInsertElement` hook is reimplemented via the `did-insert` modifier.
---
 .../discourse/app/components/user-menu-wrapper.js    | 12 ------------
 .../discourse/app/components/user-menu/menu.hbs      |  2 +-
 .../discourse/app/components/user-menu/menu.js       |  5 +++++
 .../app/templates/components/user-menu-wrapper.hbs   |  1 -
 .../javascripts/discourse/app/widgets/header.js      | 11 +++++++----
 5 files changed, 13 insertions(+), 18 deletions(-)
 delete mode 100644 app/assets/javascripts/discourse/app/components/user-menu-wrapper.js
 delete mode 100644 app/assets/javascripts/discourse/app/templates/components/user-menu-wrapper.hbs

diff --git a/app/assets/javascripts/discourse/app/components/user-menu-wrapper.js b/app/assets/javascripts/discourse/app/components/user-menu-wrapper.js
deleted file mode 100644
index c1d2b574dbc..00000000000
--- a/app/assets/javascripts/discourse/app/components/user-menu-wrapper.js
+++ /dev/null
@@ -1,12 +0,0 @@
-import Component from "@ember/component";
-import layout from "discourse/templates/components/user-menu-wrapper";
-
-export default Component.extend({
-  layout,
-  tagName: "",
-
-  didInsertElement() {
-    this._super(...arguments);
-    this.appEvents.trigger("user-menu:rendered");
-  },
-});
diff --git a/app/assets/javascripts/discourse/app/components/user-menu/menu.hbs b/app/assets/javascripts/discourse/app/components/user-menu/menu.hbs
index 3ca2d7fd30e..da8b762cdd7 100644
--- a/app/assets/javascripts/discourse/app/components/user-menu/menu.hbs
+++ b/app/assets/javascripts/discourse/app/components/user-menu/menu.hbs
@@ -1,4 +1,4 @@
-<div class="user-menu revamped menu-panel drop-down" data-max-width="320">
+<div class="user-menu revamped menu-panel drop-down" data-max-width="320" {{did-insert this.triggerRenderedAppEvent}}>
   <div class="panel-body">
     <div class="panel-body-contents">
       <div
diff --git a/app/assets/javascripts/discourse/app/components/user-menu/menu.js b/app/assets/javascripts/discourse/app/components/user-menu/menu.js
index 9a2dc9149c5..1d50097c087 100644
--- a/app/assets/javascripts/discourse/app/components/user-menu/menu.js
+++ b/app/assets/javascripts/discourse/app/components/user-menu/menu.js
@@ -52,4 +52,9 @@ export default class UserMenu extends GlimmerComponent {
       this.currentPanelComponent = tab.panelComponent;
     }
   }
+
+  @action
+  triggerRenderedAppEvent() {
+    this.appEvents.trigger("user-menu:rendered");
+  }
 }
diff --git a/app/assets/javascripts/discourse/app/templates/components/user-menu-wrapper.hbs b/app/assets/javascripts/discourse/app/templates/components/user-menu-wrapper.hbs
deleted file mode 100644
index 0258c0d0fbc..00000000000
--- a/app/assets/javascripts/discourse/app/templates/components/user-menu-wrapper.hbs
+++ /dev/null
@@ -1 +0,0 @@
-<UserMenu::Menu/>
diff --git a/app/assets/javascripts/discourse/app/widgets/header.js b/app/assets/javascripts/discourse/app/widgets/header.js
index aaacaaf7391..38ed0a69957 100644
--- a/app/assets/javascripts/discourse/app/widgets/header.js
+++ b/app/assets/javascripts/discourse/app/widgets/header.js
@@ -11,7 +11,8 @@ import { schedule } from "@ember/runloop";
 import { scrollTop } from "discourse/mixins/scroll-top";
 import { wantsNewWindow } from "discourse/lib/intercept-click";
 import { logSearchLinkClick } from "discourse/lib/search";
-import ComponentConnector from "discourse/widgets/component-connector";
+import RenderGlimmer from "discourse/widgets/render-glimmer";
+import { hbs } from "ember-cli-htmlbars";
 
 const _extraHeaderIcons = [];
 
@@ -338,9 +339,11 @@ createWidget("revamped-user-menu-wrapper", {
 
   html() {
     return [
-      new ComponentConnector(this, "user-menu-wrapper", {}, [], {
-        applyStyle: false,
-      }),
+      new RenderGlimmer(
+        this,
+        "div.widget-component-connector",
+        hbs`<UserMenu::Menu />`
+      ),
     ];
   },