From 3be633224e81fe2a16debaa51da1863a8778fc02 Mon Sep 17 00:00:00 2001
From: Maneesh Shukla <shuklamaneesh24@gmail.com>
Date: Sun, 3 Nov 2024 19:31:18 +0530
Subject: [PATCH] compose: Add tooltip over compose-reply button.

This commit adds the tooltip content for disabled stream reply button.

Fixes part of #28410.

Co-authored-by: Kunal Sharma <v.shm.kunal@gmail.com>
---
 web/src/compose_tooltips.ts         | 24 ++++++++++++++++++------
 web/templates/tooltip_templates.hbs |  3 +++
 2 files changed, 21 insertions(+), 6 deletions(-)

diff --git a/web/src/compose_tooltips.ts b/web/src/compose_tooltips.ts
index 6abfa2e9f7..ae2ef84c36 100644
--- a/web/src/compose_tooltips.ts
+++ b/web/src/compose_tooltips.ts
@@ -51,6 +51,12 @@ export function initialize(): void {
                     instance.setContent(pick_empty_narrow_banner().title);
                     return;
                 }
+                case "stream_disabled": {
+                    instance.setContent(
+                        $("#compose_disable_stream_reply_button_tooltip_template").html(),
+                    );
+                    return;
+                }
                 case "selected_message": {
                     instance.setContent(
                         parse_html($("#compose_reply_message_button_tooltip_template").html()),
@@ -79,7 +85,7 @@ export function initialize(): void {
     });
 
     tippy.delegate("body", {
-        target: "#new_conversation_button",
+        target: "#compose_buttons .compose_new_conversation_button",
         delay: EXTRA_LONG_HOVER_DELAY,
         // Only show on mouseenter since for spectators, clicking on these
         // buttons opens login modal, and Micromodal returns focus to the
@@ -87,12 +93,18 @@ export function initialize(): void {
         trigger: "mouseenter",
         appendTo: () => document.body,
         onShow(instance) {
-            const $elem = $(instance.reference);
-            const conversation_type = $elem.attr("data-conversation-type");
+            const $new_conversation_button = $("#new_conversation_button");
+            const conversation_type = $new_conversation_button.attr("data-conversation-type");
             if (conversation_type === "stream") {
-                instance.setContent(
-                    parse_html($("#new_topic_message_button_tooltip_template").html()),
-                );
+                if ($new_conversation_button.prop("disabled")) {
+                    instance.setContent(
+                        $("#compose_disable_stream_reply_button_tooltip_template").html(),
+                    );
+                } else {
+                    instance.setContent(
+                        parse_html($("#new_topic_message_button_tooltip_template").html()),
+                    );
+                }
                 return undefined;
             }
             // Use new_stream_message_button_tooltip_template when the
diff --git a/web/templates/tooltip_templates.hbs b/web/templates/tooltip_templates.hbs
index 23275fccc8..faccb613e3 100644
--- a/web/templates/tooltip_templates.hbs
+++ b/web/templates/tooltip_templates.hbs
@@ -10,6 +10,9 @@
     {{t 'Scroll to bottom' }}
     {{tooltip_hotkey_hints "End"}}
 </template>
+<template id="compose_disable_stream_reply_button_tooltip_template">
+    {{t 'You do not have permission to post in this channel.' }}
+</template>
 <template id="compose_reply_message_button_tooltip_template">
     {{t 'Reply to selected message' }}
     {{tooltip_hotkey_hints "R"}}