user_profile: Add a reset subscribe widget function.

This commit adds a reset function for the subscribe widget so that
whenever someone subscribes to a stream from the dropdown, after
the subscription, the dropdown will return to its initial state
with no stream selected. Additionally, it will display a label with
the subscribe button disabled and a tooltip.
This commit is contained in:
palashb01 2023-09-08 20:05:13 +05:30 committed by Tim Abbott
parent daf3d9ee74
commit 656494d73b
2 changed files with 14 additions and 6 deletions

View File

@ -99,6 +99,17 @@ function change_state_of_subscribe_button(event, dropdown) {
$subscribe_button.prop("disabled", false); $subscribe_button.prop("disabled", false);
} }
function reset_subscribe_widget() {
$("#user-profile-modal .add-subscription-button").prop("disabled", true);
stream_ui_updates.initialize_disable_btn_hint_popover(
$("#user-profile-modal .add-subscription-button-wrapper"),
$t({defaultMessage: "Select a stream to subscribe"}),
);
$("#user_profile_subscribe_widget .dropdown_widget_value").text(
$t({defaultMessage: "Select a stream"}),
);
}
export function get_user_unsub_streams() { export function get_user_unsub_streams() {
const target_user_id = Number.parseInt($("#user-profile-modal").attr("data-user-id"), 10); const target_user_id = Number.parseInt($("#user-profile-modal").attr("data-user-id"), 10);
return stream_data return stream_data
@ -342,11 +353,7 @@ export function show_user_profile(user, default_tab_key = "profile-tab") {
$elem.addClass("large allow-overflow"); $elem.addClass("large allow-overflow");
$("#tab-toggle").append($elem); $("#tab-toggle").append($elem);
if (show_user_subscribe_widget) { if (show_user_subscribe_widget) {
$("#user-profile-modal .add-subscription-button").prop("disabled", true); reset_subscribe_widget();
stream_ui_updates.initialize_disable_btn_hint_popover(
$("#user-profile-modal .add-subscription-button-wrapper"),
$t({defaultMessage: "Select a stream to subscribe"}),
);
} }
} }
@ -381,6 +388,7 @@ export function register_click_handlers() {
const $alert_box = $("#user-profile-streams-tab .stream_list_info"); const $alert_box = $("#user-profile-streams-tab .stream_list_info");
function addition_success(data) { function addition_success(data) {
if (Object.keys(data.subscribed).length > 0) { if (Object.keys(data.subscribed).length > 0) {
reset_subscribe_widget();
ui_report.success( ui_report.success(
$t_html({defaultMessage: "Subscribed successfully!"}), $t_html({defaultMessage: "Subscribed successfully!"}),
$alert_box, $alert_box,

View File

@ -1,5 +1,5 @@
<div class="user_profile_subscribe_widget"> <div class="user_profile_subscribe_widget">
{{> dropdown_widget widget_name="user_profile_subscribe" default_text=(t 'Select a stream')}} {{> dropdown_widget widget_name="user_profile_subscribe"}}
<div class="add-subscription-button-wrapper"> <div class="add-subscription-button-wrapper">
<button type="button" name="subscribe" class="add-subscription-button button small rounded btn-success"> <button type="button" name="subscribe" class="add-subscription-button button small rounded btn-success">
{{t 'Subscribe' }} {{t 'Subscribe' }}