diff --git a/help/invite-new-users.md b/help/invite-new-users.md index d918827b15..7a75a4eff0 100644 --- a/help/invite-new-users.md +++ b/help/invite-new-users.md @@ -31,6 +31,8 @@ permission to invite users. {relative|gear|invite} +1. Click **Send an email**. + 1. Enter a list of email addresses. 1. Select when the invitation will expire. diff --git a/web/src/invite.js b/web/src/invite.js index 2687d80797..4def7e906d 100644 --- a/web/src/invite.js +++ b/web/src/invite.js @@ -269,6 +269,13 @@ function open_invite_user_modal(e) { function invite_user_modal_post_render() { $("#invite-user-modal .dialog_submit_button").prop("disabled", true); + $("#email_invite_radio").prop("checked", true); + + if (!page_params.is_admin) { + $("#generate_multiuse_invite_radio").prop("disabled", true); + $("#generate_multiuse_invite_radio_container").addClass("control-label-disabled"); + $("#generate_multiuse_invite_radio_container").addClass("disabled_setting_tooltip"); + } autosize($("#invitee_emails").trigger("focus")); @@ -288,24 +295,19 @@ function open_invite_user_modal(e) { toggle_invite_submit_button(); }); - $("#invite-user-modal").on("change", "#generate_multiuse_invite_radio", () => { - $("#invitee_emails").prop("disabled", false); + $("#invite-user-modal").on("change", "#email_invite_radio", () => { + $("#invitee_emails_container").show(); $("#invite-user-modal .dialog_submit_button").text($t({defaultMessage: "Invite"})); $("#invite-user-modal .dialog_submit_button").data( "loading-text", $t({defaultMessage: "Inviting..."}), ); - $("#multiuse_radio_section").hide(); - $("#invite-method-choice").show(); toggle_invite_submit_button(); reset_error_messages(); }); - $("#generate_multiuse_invite_button").on("click", () => { - $("#generate_multiuse_invite_radio").prop("checked", true); - $("#multiuse_radio_section").show(); - $("#invite-method-choice").hide(); - $("#invitee_emails").prop("disabled", true); + $("#invite-user-modal").on("change", "#generate_multiuse_invite_radio", () => { + $("#invitee_emails_container").hide(); $("#invite-user-modal .dialog_submit_button").text( $t({defaultMessage: "Generate invite link"}), ); diff --git a/web/src/tippyjs.js b/web/src/tippyjs.js index 4bfee8d0fd..220edaf43c 100644 --- a/web/src/tippyjs.js +++ b/web/src/tippyjs.js @@ -610,6 +610,18 @@ export function initialize() { }, }); + delegate("body", { + target: ["#generate_multiuse_invite_radio_container.disabled_setting_tooltip"], + content: $t({ + defaultMessage: + "You do not have permissions to generate invite links in this organization.", + }), + appendTo: () => document.body, + onHidden(instance) { + instance.destroy(); + }, + }); + delegate("body", { target: "#pm_tooltip_container", onShow(instance) { diff --git a/web/styles/zulip.css b/web/styles/zulip.css index 0e390b70bf..a2e0947425 100644 --- a/web/styles/zulip.css +++ b/web/styles/zulip.css @@ -2534,14 +2534,25 @@ select.invite-as { } } -#invite-method-choice { - margin-top: 2px; +.invite_type_radio_section { + margin: 2px 2px 2px 5px; + + & input[type="radio"] { + cursor: pointer; + + &:disabled { + cursor: not-allowed; + } + } + + .control-label-disabled label { + pointer-events: none; + cursor: not-allowed; + } } -#multiuse_radio_section { - margin-top: 4px; - margin-bottom: -2px; - display: none; +#generate_multiuse_invite_radio_container { + width: fit-content; } #custom-invite-expiration-time { diff --git a/web/templates/invite_user_modal.hbs b/web/templates/invite_user_modal.hbs index 1faf8aa228..8ff447e29b 100644 --- a/web/templates/invite_user_modal.hbs +++ b/web/templates/invite_user_modal.hbs @@ -3,20 +3,25 @@
{{/if}}