UX: Adjustments to topic admin menu on mobile (#9945)

UX: Adjustments to topic admin menu on mobile (#9945)

diff --git a/app/assets/javascripts/discourse/app/components/topic-admin-menu-button.js b/app/assets/javascripts/discourse/app/components/topic-admin-menu-button.js
index 95dbceb..3d5ad4d 100644
--- a/app/assets/javascripts/discourse/app/components/topic-admin-menu-button.js
+++ b/app/assets/javascripts/discourse/app/components/topic-admin-menu-button.js
@@ -6,6 +6,6 @@ export default MountWidget.extend({
   widget: "topic-admin-menu-button",
 
   buildArgs() {
-    return this.getProperties("topic", "fixed", "openUpwards", "rightSide");
+    return this.getProperties("topic", "openUpwards", "rightSide");
   }
 });
diff --git a/app/assets/javascripts/discourse/app/components/topic-navigation.js b/app/assets/javascripts/discourse/app/components/topic-navigation.js
index 0f42060..4ffa6ce 100644
--- a/app/assets/javascripts/discourse/app/components/topic-navigation.js
+++ b/app/assets/javascripts/discourse/app/components/topic-navigation.js
@@ -30,10 +30,7 @@ export default Component.extend(PanEvents, {
     let info = this.info;
 
     if (info.get("topicProgressExpanded")) {
-      info.setProperties({
-        renderTimeline: true,
-        renderAdminMenuButton: true
-      });
+      info.set("renderTimeline", true);
     } else {
       let renderTimeline = !this.site.mobileView;
 
@@ -51,10 +48,7 @@ export default Component.extend(PanEvents, {
         }
       }
 
-      info.setProperties({
-        renderTimeline,
-        renderAdminMenuButton: !renderTimeline
-      });
+      info.set("renderTimeline", renderTimeline);
     }
   },
 
diff --git a/app/assets/javascripts/discourse/app/templates/topic.hbs b/app/assets/javascripts/discourse/app/templates/topic.hbs
index d5e22f5..e6968f1 100644
--- a/app/assets/javascripts/discourse/app/templates/topic.hbs
+++ b/app/assets/javascripts/discourse/app/templates/topic.hbs
@@ -127,24 +127,6 @@
 
       {{#topic-navigation topic=model jumpToDate=(action "jumpToDate") jumpToIndex=(action "jumpToIndex") as |info|}}
         {{#if info.renderTimeline}}
-          {{#if info.renderAdminMenuButton}}
-            {{topic-admin-menu-button
-              topic=model
-              fixed="true"
-              toggleMultiSelect=(action "toggleMultiSelect")
-              deleteTopic=(action "deleteTopic")
-              recoverTopic=(action "recoverTopic")
-              toggleClosed=(action "toggleClosed")
-              toggleArchived=(action "toggleArchived")
-              toggleVisibility=(action "toggleVisibility")
-              showTopicStatusUpdate=(route-action "showTopicStatusUpdate")
-              showFeatureTopic=(route-action "showFeatureTopic")
-              showChangeTimestamp=(route-action "showChangeTimestamp")
-              resetBumpDate=(action "resetBumpDate")
-              convertToPublicTopic=(action "convertToPublicTopic")
-              convertToPrivateMessage=(action "convertToPrivateMessage")}}
-          {{/if}}
-
           {{topic-timeline
             topic=model
             notificationLevel=model.details.notification_level
@@ -178,24 +160,22 @@
             expanded=info.topicProgressExpanded
             jumpToPost=(action "jumpToPost")}}
             {{plugin-outlet name="before-topic-progress" args=(hash model=model jumpToPost=(action "jumpToPost"))}}
-            {{#if info.renderAdminMenuButton}}
-              {{topic-admin-menu-button
-                topic=model
-                openUpwards="true"
-                rightSide="true"
-                toggleMultiSelect=(action "toggleMultiSelect")
-                deleteTopic=(action "deleteTopic")
-                recoverTopic=(action "recoverTopic")
-                toggleClosed=(action "toggleClosed")
-                toggleArchived=(action "toggleArchived")
-                toggleVisibility=(action "toggleVisibility")
-                showTopicStatusUpdate=(route-action "showTopicStatusUpdate")
-                showFeatureTopic=(route-action "showFeatureTopic")
-                showChangeTimestamp=(route-action "showChangeTimestamp")
-                resetBumpDate=(action "resetBumpDate")
-                convertToPublicTopic=(action "convertToPublicTopic")
-                convertToPrivateMessage=(action "convertToPrivateMessage")}}
-            {{/if}}
+            {{topic-admin-menu-button
+              topic=model
+              openUpwards="true"
+              rightSide="true"
+              toggleMultiSelect=(action "toggleMultiSelect")
+              deleteTopic=(action "deleteTopic")
+              recoverTopic=(action "recoverTopic")
+              toggleClosed=(action "toggleClosed")
+              toggleArchived=(action "toggleArchived")
+              toggleVisibility=(action "toggleVisibility")
+              showTopicStatusUpdate=(route-action "showTopicStatusUpdate")
+              showFeatureTopic=(route-action "showFeatureTopic")
+              showChangeTimestamp=(route-action "showChangeTimestamp")
+              resetBumpDate=(action "resetBumpDate")
+              convertToPublicTopic=(action "convertToPublicTopic")
+              convertToPrivateMessage=(action "convertToPrivateMessage")}}
           {{/topic-progress}}
         {{/if}}
       {{/topic-navigation}}
diff --git a/app/assets/javascripts/discourse/app/widgets/topic-admin-menu.js b/app/assets/javascripts/discourse/app/widgets/topic-admin-menu.js
index 2ba85da..7c96830 100644
--- a/app/assets/javascripts/discourse/app/widgets/topic-admin-menu.js
+++ b/app/assets/javascripts/discourse/app/widgets/topic-admin-menu.js
@@ -38,7 +38,6 @@ createWidget("topic-admin-menu-button", {
 
     const menu = this.attach("topic-admin-menu", {
       position: state.position,
-      fixed: attrs.fixed,
       topic: attrs.topic,
       openUpwards: attrs.openUpwards,
       rightSide: !this.site.mobileView && attrs.rightSide,
@@ -54,7 +53,6 @@ createWidget("topic-admin-menu-button", {
         this.attach("button", {
           className:
             "popup-menu-button toggle-admin-menu" +
-            (attrs.fixed ? " show-topic-admin" : "") +
             (attrs.addKeyboardTargetClass ? " keyboard-target-admin-menu" : ""),
           title: "topic_admin_menu",
           icon: "wrench",
@@ -74,10 +72,6 @@ createWidget("topic-admin-menu-button", {
   hideAdminMenu() {
     this.state.expanded = false;
     this.state.position = null;
-
-    if (this.site.mobileView && !this.attrs.rightSide) {
-      $(".header-cloak").css("display", "");
-    }
   },
 
   showAdminMenu(e) {
@@ -101,10 +95,6 @@ createWidget("topic-admin-menu-button", {
       position.left -= MENU_WIDTH - $button.outerWidth();
     }
 
-    if (this.attrs.fixed) {
-      position.left += $button.width() - 203;
-    }
-
     if (this.attrs.openUpwards) {
       if (rtl) {
         position.left -= $button[0].offsetWidth + SPACING;
@@ -115,11 +105,6 @@ createWidget("topic-admin-menu-button", {
       position.top += $button[0].offsetHeight + SPACING;
     }
 
-    if (this.site.mobileView && !this.attrs.rightSide) {
-      const headerCloak = document.querySelector(".header-cloak");
-      if (headerCloak) headerCloak.style.display = "block";
-    }
-
     this.state.position = position;
   },
 
@@ -273,7 +258,7 @@ export default createWidget("topic-admin-menu", {
 
   buildAttributes(attrs) {
     let { top, left, outerHeight } = attrs.position;
-    const position = attrs.fixed || this.site.mobileView ? "fixed" : "absolute";
+    const position = this.site.mobileView ? "fixed" : "absolute";
 
     if (attrs.rightSide) {
       return;
@@ -289,7 +274,7 @@ export default createWidget("topic-admin-menu", {
       }
 
       if (this.site.mobileView) {
-        bottom = 0;
+        bottom = 50;
         left = 0;
       }
 
diff --git a/app/assets/javascripts/discourse/app/widgets/topic-timeline.js b/app/assets/javascripts/discourse/app/widgets/topic-timeline.js
index cc3785a..32f9aa2 100644
--- a/app/assets/javascripts/discourse/app/widgets/topic-timeline.js

[... diff too long, it was truncated ...]

GitHub sha: c2abf88a

This commit appears in #9945 which was merged by pmusaraj.