mirror of
https://github.com/zulip/zulip.git
synced 2025-10-23 04:52:12 +00:00
popovers: Add an x button to topic field in move topic/message modal.
Fixes #33729.
This commit is contained in:
committed by
Tim Abbott
parent
f496bd6350
commit
869e81f14c
@@ -785,6 +785,16 @@ export async function build_move_topic_to_stream_popover(
|
||||
}
|
||||
}
|
||||
|
||||
function update_clear_move_topic_button_state(): void {
|
||||
const $clear_topic_name_button = $("#clear_move_topic_new_topic_name");
|
||||
const topic_input_value = $("input#move-topic-new-topic-name").val();
|
||||
if (topic_input_value === "") {
|
||||
$clear_topic_name_button.css("visibility", "hidden");
|
||||
} else {
|
||||
$clear_topic_name_button.css("visibility", "visible");
|
||||
}
|
||||
}
|
||||
|
||||
function move_topic_post_render(): void {
|
||||
$("#move_topic_modal .dialog_submit_button").prop("disabled", true);
|
||||
$("#move_topic_modal .move_topic_warning_container").hide();
|
||||
@@ -812,6 +822,7 @@ export async function build_move_topic_to_stream_popover(
|
||||
$topic_not_mandatory_placeholder.addClass(
|
||||
"move-topic-new-topic-placeholder-visible",
|
||||
);
|
||||
$("#clear_move_topic_new_topic_name").css("visibility", "hidden");
|
||||
}
|
||||
|
||||
$topic_input.one("blur", () => {
|
||||
@@ -821,12 +832,22 @@ export async function build_move_topic_to_stream_popover(
|
||||
);
|
||||
$topic_input.attr("placeholder", empty_string_topic_display_name);
|
||||
$topic_input.addClass("empty-topic-display");
|
||||
$("#clear_move_topic_new_topic_name").css("visibility", "visible");
|
||||
}
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
setup_resize_observer($topic_input);
|
||||
update_clear_move_topic_button_state();
|
||||
|
||||
$("#clear_move_topic_new_topic_name").on("click", (e) => {
|
||||
e.stopPropagation();
|
||||
const $topic_input = $("#move-topic-new-topic-name").expectOne();
|
||||
$topic_input.val("");
|
||||
$topic_input.trigger("input").trigger("focus");
|
||||
move_topic_to_stream_topic_typeahead?.hide();
|
||||
});
|
||||
|
||||
if (only_topic_edit) {
|
||||
// Set select_stream_id to current_stream_id since we user is not allowed
|
||||
@@ -838,6 +859,7 @@ export async function build_move_topic_to_stream_popover(
|
||||
const topic_input_value = $topic_input.val();
|
||||
assert(topic_input_value !== undefined);
|
||||
update_topic_input_placeholder_visibility(topic_input_value);
|
||||
update_clear_move_topic_button_state();
|
||||
});
|
||||
return;
|
||||
}
|
||||
@@ -871,6 +893,7 @@ export async function build_move_topic_to_stream_popover(
|
||||
const topic_input_value = $topic_input.val();
|
||||
assert(topic_input_value !== undefined);
|
||||
update_topic_input_placeholder_visibility(topic_input_value);
|
||||
update_clear_move_topic_button_state();
|
||||
});
|
||||
|
||||
if (!args.from_message_actions_popover) {
|
||||
|
@@ -859,19 +859,28 @@ ul.popover-group-menu-member-list {
|
||||
}
|
||||
}
|
||||
|
||||
.move_messages_edit_topic {
|
||||
margin-bottom: unset;
|
||||
box-sizing: border-box;
|
||||
width: 100%;
|
||||
height: auto;
|
||||
|
||||
&.empty-topic-display::placeholder {
|
||||
color: inherit;
|
||||
}
|
||||
}
|
||||
|
||||
#move-topic-new-topic-input-wrapper {
|
||||
position: relative;
|
||||
display: grid;
|
||||
/* 30px at 16px/1em */
|
||||
grid-template:
|
||||
"move-topic-input clear-topic" auto / minmax(0, 1fr)
|
||||
1.875em;
|
||||
|
||||
& input.move_messages_edit_topic {
|
||||
grid-column: move-topic-input-start / clear-topic-end;
|
||||
grid-row: move-topic-input;
|
||||
/* 30px at 16px/1em */
|
||||
padding-right: 1.875em;
|
||||
margin-bottom: unset;
|
||||
box-sizing: border-box;
|
||||
width: 100%;
|
||||
height: auto;
|
||||
|
||||
&.empty-topic-display::placeholder {
|
||||
color: inherit;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.move-topic-new-topic-placeholder {
|
||||
|
@@ -14,6 +14,11 @@
|
||||
<span class="move-topic-new-topic-placeholder placeholder">
|
||||
{{> topic_not_mandatory_placeholder_text empty_string_topic_display_name=empty_string_topic_display_name}}
|
||||
</span>
|
||||
{{#unless disable_topic_input}}
|
||||
<button type="button" id="clear_move_topic_new_topic_name" class="clear_search_button">
|
||||
<i class="zulip-icon zulip-icon-close"></i>
|
||||
</button>
|
||||
{{/unless}}
|
||||
</div>
|
||||
</div>
|
||||
<input name="old_topic_name" type="hidden" value="{{topic_name}}" />
|
||||
|
Reference in New Issue
Block a user