Extracted by tabbott from the original pull request, with additional
changes to document the surprising margin-top in our current
implementation and avoid a bit of unnecessary CSS.
On our Markdown help docs, ordered lists that aren't encapsulated
in tabs don't have custom CSS that tells them how to display
themselves with proper indentation. An example of a doc that has
this issue is /help/saml-authentication. This commit adds some CSS
that targets such ordered lists.
This will be used to check if the narrow being requested by
spectator requires authentication without requesting the server.
Having this check locally, makes this process look snappy to
the user and doesn't result in 404s in the browser log.
For spectators, without sending any request to the server,
check locally if the hash requires authentication or which
shows a feature that requires authentication;
if it does, we show login_to_access modal to the user.
We will use this modal for any narrow / hash or other UI element that
requires an actual account to use, to provide something reasonable to
occur when a user clicks on those things.
We ideally will also add a /help/ page explaining these with an
example, but it seems appropriate to make the labels frame it around
what sort of emails we actually intend to send (newsletters with
updates about Zulip, not a "drip campaign").
It’s not helpful for the browser to substitute another font for the
icon font while it’s loading.
This suppresses a warning from the Lighthouse performance analyzer.
Signed-off-by: Anders Kaseorg <anders@zulip.com>
We rename class of notification settings except checkboxes
by prefixing them with 'setting_' for clarity.
We do not change class of checkboxes because settings_checkbox
is used by other templates also and if we only change class
of those using notification_settings_checkboxes then live
update code will break and will need to add separate condition
for differentiating between which partial template is used.
This is a prep commit for adding UI for realm-level defaults
of user settings.
This commit renames notification-sound-audio element to
user-notification-sound-audio because we will be adding similar
element for realm-level default of user settings also.
We also change the child elements to have current id as their
class for the same reason.
This commit adds prefix paramter with value "user_" to the
settings_checkbox and notification_settings_checkboxes references
in notification_settings.hbs such that ids are unique when we use
notification_settings.hbs for realm-level settings UI.
This commit creates a new template user_notification_settings.hbs
for user notification settings and notification_settings.hbs will
be used as a common template for user-level and realm-level
settings.
This is a prep commit for adding UI for realm-level default
of user settings. We refactor the code to use classes
instead of ids such that we can use the common code for the
new settings.
This commit refactors change_display_setting function to accept
url as a paramter instead of directly using '/json/settings'
such that we can use the same function for realm-level settings.
This commit refactors change_display_setting function to
accept container element as a paramter and then determine
the correct status element from it. This is the prep commit
for adding realm-level default settings UI.
We add a prefix to id of default_language_modal.hbs
such that we can use the same code for user settings
and realm-level settings.
We also add a class "default_language_modal" to the
modal div to avoid duplicate css.
This commit adds prefix paramter with value "user_" to the
settings_checkbox references in display_settings.hbs such
that ids are unique when we use display_settings.hbs for
realm-level settings UI.
This commit creates a new template user_display_settings.hbs
for user display settings and display_settings.hbs will be
used as a common template for user-level and realm-level
settings.
This is a prep commit for adding UI for realm-level
default of user settings. We refactor the code to use
classes instead of ids such that we can use the common
code for the new settings.
We were using incorrect element as we changed the input from
select to radio buttons in 439bc2920a.
This code was originally added in 6cb03ea78e (though in a
different file) and was removed from sometime and then added
again in e7311cdf5d. But in the meantime the input was
changed to radio, which resulted in incorrect code.
We were using emojiset_spinner element in destroy_indicator, but
there is no such element and emoji-settings-status element is used
in make_indicator, so destroy_indicator should also use the same
element.
This was added originally in 6cb03ea78e (though in a different
file) and was removed for sometime and then readded in e7311cdf5d.
But between these two commits, the setting was changed to be a
radio element and thus the spinner elements were also changed.
On mobile, when the sidebar is toggled, the following three issues
are encountered:
- When none of the sidebar menus are expanded, the sidebar has no
scrollbar, which is expected. But if you scroll, the background
content scrolls, which is a bug.
- When some of the sidebar menus are expanded such that the content
overflows and is "scrollable", once you get to the end of the
sidebar content, the background content keeps scrolling in a weird
way.
- If the mobile screen is wide enough, if you scroll the sidebar
content, it scrolls as expected. But if you move the pointer to
the side of the background content that is still visible, you
can scroll the background content even though it should be fixed.
This commit fixes all of the above issues.
This commit updates both the stream-level and realm-level message
retention setting to use 'unlimited' instead of 'forever' to set
message retention setting to "retain messages forever".
Earlier copy to the link present above the composebox (which
appears when a message is sent outside the current narrow), it
used to provide the link to the home page which is fixed now.
Now, copy to the link gives the link of the narrow where message
is sent.
When one resizes the window and tries to switch to the vertical
sidebar menu, the CSS transition flickers in and out. This is
less than ideal.
This commit implements a solution to this problem. The solution is
inspired by the following helpful article:
https://ishadeed.com/article/layout-flickering/
We found a bug in our top-level nav on certain Samsung phones where
tapping on the dropdowns didn't do anything. As it turns out, trying
to figure out whether touch is enabled on a device using CSS media
queries such as `(hover: none)` is very tricky business! While it
may work on some devices, it may break spectacularly on others.
This commit presents a potential solution to this. Media queries
about widths are a lot more device-independent than hover media
queries. So, this is what we do now:
- We fire click events regardless of whether the top-level nav is in
the vertical sidebar orientation or the horizontal orientation.
Since we are no longer dependent on hover media queries for click
events, this fixes the mobile bug mentioned above because taps or
clicks will always work regardless of device.
- The mouseover/mouseout events are only fired when the header is
in the horizontal orientation and the primary input mechanism
supports hovering over elements. This allows us to support hovering
over menus on desktop. However, since mouseout/mouseover events are
irrelevant for mobile, we are fine on that front since clicks/taps
will still work.
NOTE that the above approach also takes care of weird edge cases where
you have a horizontal orientation on a device such as the iPad Pro that
is flipped in the horizontal position. Since clicks work anyway, these
edge cases are largely taken care of.
Right now, some of our horizontally spaced out top-level dropdowns
(such as "Solutions") get truncated on screen widths less than
1024 px. We switch to the vertical sidebar menu at widths less than
686px.
Looking at a lot of mainstream websites, a few of them switch to a
vertical sidebar menu on much wider widths than we do. Plus,
switching to a vertical orientation is a much cleaner way to fix
this issue than playing around with legacy Bootstrap code. Therefore,
we should toggle on the sidebar menu at width <= 1024px.
Commit 9049fb3bd4 (#19176) broke these
by changing {page_params} to {...page_params}. We could change it
back, but it’s better to be explicit about which items we use from
page_params.
Signed-off-by: Anders Kaseorg <anders@zulip.com>
This commit makes the compose.update_fade as an exported
function and adds the listener to update the fade manually
as deleting the pill was not calling this functions.
Fixes#18865
We want to avoid passing opaque messages around to
low-level functions that only need certain fields.
This sets us up to handle mark-as-unread messages
that aren't necessarily full messages.
We only care about ~8 fields from a Zulip message
when we're tracking unread counts. For example, we
don't care about the "content" field. This also sets
us up to pull up the "display_recipient" logic in an
upcoming commit.
We rework the landing page for companies in the same way we've
recently revamped the landing pages for other use cases.
This implementation unfortunately duplicates a lot of content from
/plans; we should clean that up at some point.
This reverts commit 1965584eec.
This syntax has a bad interaction with table syntax and needs to be
rethought.
Signed-off-by: Anders Kaseorg <anders@zulip.com>
The call-to-action ("Experience Zulip today!") section on our
landing page has a lot of superfluous margin around it that takes
up a lot of space. This commit decreases that margin as a part of
our efforts to restructure the bottom nav in general.
We recently added a lot of new pages to our top navigation and
restructured top-navigation in general. This commit updates the
footer to reflect the recent changes to our top navigation.
'corporate_enabled', 'realm_push_notifications_enabled'
and 'realm_digest_emails_enabled' settings are part of
page_params and not user_settings.
This was introduced in 998d710275.
Fixes#19198
We set blue outline color in day mode and light gray outline colour
in night mode. This removes the different outline colours users
in different platforms / desktop app.
The reason for this was we were not loading extra
parameters while storing the status emoji object.
For this we also need the emoji module to be initialized
early because the right sidebar would need it to display
the status emoji.
The issue was with the typeahead `click` event where it
didn't activate the current target and called the `select`
method, which selected the element which was last
focused.
This was debugged by Anders Kaseorg.
We now use the newly added "user_settings" event in the frontend
code instead of previous "update_global_notifications" and
"update_display_settings" events which are now depreceated.
- Remove essay portion and link to /for/communities instead.
- Copy over relevant quotes from /for/communities.
- Move "Join the hundreds of open-source projects we sponsor."
This reverts commit 5e97ec9ad9.
This change has been pretty confusing for users, and so we need to do
something more in order to make the UI acceptable to change this
default.
This commit moves the warn_if_private_stream_is_linked,
needs_subscribe_warning, and warn_if_mentioning_unsubscribed_user
to compose_validate.js from compose.js.
These warning functions are very naturally part of the compose box
validation system, though they're a bit different in being called from
the typeahead codebase.
Part of splitting compose.js into more natural modules.
Previously, once the user opens the "Set user status" UI,
the focus isn't automatically set to the input bar.
This is so because the input field isn't visible at
the time when UI is loaded because of the bootstrap
fade property which delays the event.
Added a fix to trigger the focus event on input bar
only when the modal is completely shown.
Fixes#19417.
This commit enhances our Multiselect dropdown list widget by
displaying a tippy tooltip over the dropdown button once it's
text changes to `n selected` where n is the number of items
selected by user which exceeds the limit passed.
It essentially helps the user to identify the dropdown items they
have selected by just hovering over the dropdown toggle button.
This commit adds the support to select multiple dropdown items by inheriting
dropdown list widget and overriding some of it's properties.
The parameters that can be passed along with it are-
- widget_name: The desired name of the widget.
- data: The data that needs to be populated as dropdown items.
- default_text: The default text to be rendered when none of the items is selected.
- on_update: Function to trigger once the filter button is pressed.
- on_close: Function to trigger once the dropdown is successfully closed after filtering.
- value: The default value that is initially selected by user.
- limit: The maximum number of dropdown items to display on button text.
This widget can later be implemented in recent topic view to replace the
several ellipses filter button and also within the organisation user's page
to quickly sort the users list according to their org role.
Previously, our dropdown list widget was lacking several
keyUp/keyDown keyboard focus events due to which the user
couldn't shift the focus from the dropdown item to it's
search input.
This commit essentially binds several additional keyboard events
by defining a `dropdown_focus_events` function which helps
in enhancing our keyboard focus events.
Due to the above changes, it removes the custom event binded
to dropdown list widget because of which we fallback to our
deprecated keydown event handler functions present in /third/bootstrap.
This is a prep commit for adding the support of Multiselect
dropdown list widget by prototypal inheritance.
The following change actually revamps the dropdown list widget
into a constructor function, due to which the widget is now to
be initialized with the `new` keyword (which adds a property
to __proto__ object that links to the constructor function's
prototype object).
Example-
const foo = new DropdownListWidget({....});
Due to the above change, this commit also modifies the declaration
of dropdown_list_widget across all our instances.
A recent commit (5a94bfcb88)
introduced a couple of regressions:
* The part of help.js that highlights the active page in the
sidebar raised an exception on /help and /api since there
was nothing to highlight for the doc roots in the sidebar
anymore.
* Moving the doc root links to the header after the logo made
it such that on narrow mobile widths, there was no way to get
to the doc root since the links in the header were truncated.
With a CSS change by tabbott to avoid awkward vertical spacing.
In this case, for TypeScript narrowing to work correctly, we need
a if statement that check that both of the type are same. The one
condition we had that checked that both have the same type doesn't
work with TypeScript narrowing yet.
We use a Symbol for unassigned_value_sentinel and explictly assign
the compute_value property instead of using Object.assign. Both of
these are needed to type annotate it easily.
I'm not entirely sure what broken this, but both the unread message
pills and the \vdots menu were not centered vertically.
Fix for the unread message pills should be general and complete, since
it just declares center alignment, but the \vdots menu is a hack;
further cleanup of that element's CSS is needed to end up with
something good.
In this commit, we update the UI to:
* Display emoji on the buddy list (right side sidebar).
* Display the emoji picker on the set status overlay.
It also updates the `z-index` of
`#set_user_status_modal`, which was changed from 105
to 1050 in 166bfa4cf8. We change it back to 105, so
emoji-popover can be visible on top of the
`#set_user_status_modal`.
We also remove the `tabindex` property from the
`#set_user_status_modal` so it can allow keyboard
events for emoji popover.
In this commit, we only update the existing architecture
to support the status emoji feature:
* We add the `user_status_emoji_info` map so we can
keep track of the users' staus emoji.
* Listen to the server event to update/set the
`user_status_emoji_info` map.
* Add `status_emoji_info` field, when getting user's data.
This commit replaces boolean field add_emoji_by_admins_only with an
integer field add_custom_emoji_policy as we would also add full members
and moderators option for this setting in further commits.
This removes a bunch of non-functional duplicate JavaScript, HTML, and
CSS that was interfering with maintenance on the functional originals,
because it was never clear how to update the duplicates or how to
check that you’d updated the duplicates correctly.
Signed-off-by: Anders Kaseorg <anders@zulip.com>
As explained in the commit 3a35a0b72c9b2c46ed0afa6456d4a5a80a2c12f9:
`nextFocus` is set on a keydown event to indicate where
we should focus on keyup. We can't focus at the time of
keydown because we need to wait for typeahead. And we
can't compute where to focus at the time of keyup because
only the keydown has reliable information about whether it
was a Tab or a Shift+Tab.
Though the previous configuration didn't show any bug but we should
follow the same logic here also.
This commit moves "enter_sends" setting to property_types dict.
With this change, changing enter_sends setting also sends an
event of type "update_display_settings" and thus enables us
to live-update the UI.
We only disable the dropdown and keep the label as it is when
disabling a dropdown input, but for a check-box we need to
change label style also while disabling it.
Till now disable_sub_settings_on_change was used only for
dropdown but will be used for a check-box in the next commit.
91b83cf09f migrated delete_topic modal
to confirm_dialog. confirm_dialog closes the modal after clicking on
the Confirm button. So manually closing the modal is redundant.
On mobile, when you go to our /help pages, you cannot scroll the
sidebar content. As for testing, the bug can be reproduced by
using a mobile display in Chrome inspector. One caveat of this
bug is that if you go to /help with a mobile display toggled,
the scrollbar won't work. However, if you switch between
different mobile displays, it starts working.
This commit adds some JS that sets the right CSS properties
when the hamburger is clicked.
Cross realm bots will soon stop being a thing. This param is responsible
for displaying "System Bot" in the user info popover - so this rename is the
right way to handle the situation.
We will likely want to rename the `cross_realm_bots` section as well,
but that is a more involved API migration.
This fixes the following flow being broken:
* You start on
http://zulipdev.com:9991/accounts/go/?next=/upgrade%23sponsorship
(which we link to from e.g. /plans/)
* The form on that page has
`action=/accounts/go/?next=%2Fupgrade%23sponsorship`, i.e. it has correctly
URL-encoded the `next `value.
* You enter a realm name and hit submit.
* That redirects you to
`http://realm-26.zulipdev.com:9991/upgrade#sponsorship`, would is
correct if you are already logged in.
* However, if you're not logged in, `/upgrade` will serve a redirect
to the login page, landing you at
`http://realm-26.zulipdev.com:9991/devlogin/?next=/upgrade/#sponsorship`.
This page works. But in production, it would instead be:
`http://realm-26.zulipdev.com:9991/login/?next=/upgrade/#sponsorship`.
On this page, password login works but social login does not.
Note that the `next=` value is no longer URL-encoded, and thus is
parsed by the browser as `?next=/upgrade` + a hash of
`#sponsorship`.
* If you now login with Google auth, you find yourself on
`http://realm-26.zulipdev.com:9991/#sponsorship` (no /upgrade).
The root cause was that we have a bit of JavaScript in signup.js and
dev-login.js that is intended to handle this; but it was broken for
the social login case for unknown legacy reasons.
This bug appears to date from the original
b62bdde303 which introduced `next`
support for social backends in the first place.
This commit adds more specific screenshots to our events and
research pages. The newer screenshots are properly sized such that
they fit well in a 400px width.
We also move a quote to improve the visual design.
The screenshots we have currently don't really fit into the width
available and the font looks too small. This commit adds newer
screenshots that have been scaled to fit a width of 400px such that
the font is readable with a small amount of content.
This is a prep commit to add the status emoji feature.
This function will add missing/extra parameters to the
emoji info object, that would need by the template to
render an emoji.
Co-authored-by: Yash Rathore <33805964+YashRE42@users.noreply.github.com>
This is a prep commit to add the status emoji feature.
We update the templates associated with the emoji
picker to add class `status_emoji` to `emoji` in the
popover. So we can later add the events when the user
selects the emoji.
We also update the functions in `emoji_picker.js` to
support opening emoji picker popover in the 'set_status_
overlay`.
We also increase the `z-index` of the `popover-flex`
class (This class is only added to popover-emoji content
if the view is mobile), so in the mobile view the emoji
popover doesn't go behind the '#set_user_status_modal'.
We rely on calling eventually_render_bots from the event handling
code path for bot events to both updating the list and switching
the tab.
Now we decouple the logic and make render_bots take care of
rendering the list of bots only and switch the tab upon calling
the success handler of creating the bot.
Fixes: zulip#17743
As it turns out, anchor links on headings only worked on our /help and
/api pages but were broken everywhere else. This commit adds the
required JS to scroll properly when an anchor link on any of our
various landing pages is clicked. We already have similar code to
accomplish this in help.js.
We verified with console logging, browser Sources inspection, and
checking source files that help.js and landing-page.js are never
included in the same page, but we add comments to make this
architecture clear.
Fixes#19349.
The distance of compose-box from the top is hardcoded in the existing
code as `50px`, which only considers the height of the `.header`, plus the
padding-bottom of the header. This results in a bug where the top bar of
compose-box gets hidden behind the header if navbar_alerts is also present
in the view.
This commit calculates the top distance of the compose-box dynamically,
whenever the compose-box is opened and set the `top` property of the
compose-box accordingly.
Tested on my Ubuntu development environment.
Fixes: #19249.
For spectators (logged view), we send user_id=0 via page_params.
The people module does not know about this user ID, and so throws the
exception. Earlier `people.get_by_user_id` was not called on page load,
but only when determining settings permissions with `settings_data.user_has_permission`.
But 231c536cad made it so that that function
is always called, so we need to handle the spectator case explicitly.
Co-authored-by: Gaurav Pandey <gauravguitarrocks@gmail.com>
The CSS properties used to make the `#compose-textarea` full-size
were missing for the `#preview_message_area`, thus, it was just
getting to the height as specified in the `max-height` property
of `#preview_compose_box`.
Adding the missing CSS properties resolved the problem, but only
for not-too-long messages. For very-long messages, the preview
message area was overflowing the parent container (attaining the
maximum height possible according to the content, due to the absence
of max-height), which led to the controls below compose-box to
disappear.
Adding an additional property of `height: 1.5em` solved this problem,
as if a height lower than min-height is set to an element, it attains
its min-height.
Tested manually on my Ubuntu Development environment.
Fixes: #19243.
This commit adds the support to toggle `send_notification`
checkbox by clicking over its corresponding label as well.
It is a similar case as the checkboxes within organization
settings.
This commit adds the support to toggle `send_notification`
checkbox by clicking over its corresponding label as well.
It is a similar case as the checkboxes within organization
settings.
These descriptions are both more accurate (there were embarrassingly a
few errors in the previous text about what was actually included in
what plan), as well as making clear that Zulip's free self-hostable
version includes essentially all the non-services features of
enterprise editions of competing products.
This commits replaces the custom `send_notification` message_edit
checkboxes with our `settings_checkbox` partial.
The main intention is to also support the feature of selecting a
checkbox by clicking over its corresponding label as we have
in the case of the organization settings checkboxes.
Due to above change, this commit also removes the redundant
`break-row` HTML class along with it styles.
All the inputs of form has 'width: 100%' property but then
also the width of inputs were different because of box-sizing
property. The select input had 'box-sizing: border-box' style
but the others did not, so this commit adds this style to
the other inputs - text type input and the textarea input,
to fix the alignment.
Adding 'box-sizing: border-box' changes the actual height of
the normal text type input because the default input height
of 20px set by bootstrap now includes padding and border also,
so we add 'height: 30px' style to make its height same as the
select input.
Fixes#19332.
These modern landing pages cover use cases previously not detailed on
our website. Technically, we had a /for/research page before, but it
wasn't finished or linked everywhere.
Removed "function-url-quotes" stylelint rule
since I need to use quotes in url to use an
svg as list bullet point. There are spacing issues
using it as an image. Also, using quotes in url
is actually the recommended way to do it otherwise
there could be issue with escaping.
This is a prep commit for the Stripe checkout migration.
create_ajax_request function used to create an ajax request to our
billing API and on completion redirect to one of the URLs in our
website. The stripe migration requires the ajax request function to
execute Stripe javascript code post the request completion to redirect
to Stripe checkout page. So this commit updates the function to accept a
callback function which gets executed post the request completion.
Our logic for filtering subscribed users in stream setting was
buggy and gave irrelevant filters based on email matching.
We correct it by using same logic as we use for filtering in
buddy list.
A recent PR introduced a bug where navigation dropdowns on the
landing page would not open for tablet/mobile screens. This
commit fixes that issue by using the proper media query to
differentiate between touch and mouse-based devices.
We have merged the '/settings/display' and 'settings/notifications'
endpoints to '/settings' in backend. This commit updates the frontend
code to '/settings' endpoint for updating notification settings
instead of '/settings/notifications' endpoint.
We have merged the '/settings/display' and 'settings/notifications'
endpoints to '/settings' in backend. This commit updates the
frontend code to '/settings' endpoint for updating display settings
instead of '/settings/display' endpoint.
We move templates related to listing streams in left pannel of
stream settings overlay to stream_settings folder by making
following changes:
* Rename `subscriptions.hbs` to `browse_streams_list.hbs`.
* Move `settings_stream_list.hbs` to stream_settings folder.
* Rename `subscription.hbs` to `browse_streams_list_item.hbs`.
* Move `settings_stream_list_item.hbs` to stream_settings folder.
We do following changes to two small independet templates used
in stream_settings area:
* Move subscription_setting_icon.hbs to stream settings folder
to have a consistent folder structure for stream settings templates.
* Rename `subscription_count.hbs` to `subscriber_count.hbs`.
* Move `subscriber_count.hbs` to `stream_settings` folder.
Following changes are done to subscription_table_body.hbs:
* Rename subscription_table_body.hbs to stream_settings_overlay.hbs,
to have a uniform naming pattern for stream settings templates.
* Move it to stream_settings folder.
The timestamp in edit history ui also has .message_time.
We had a tippy hover event attached to .message_time
whose code assumes it to belong to an actual message
which caused an error on hovering the message timestamp
in edit history.
This commit fixes it by making the selector more specific.
Because the right_sidebar initialization calls user_has_permission, in
organizations that has a waiting period before users become full
members, and only full members can send invitations, Zulip will throw
an exception on startup.
This makes several changes:
* Fixes a bug where the help text explaining our policies was not displayed.
* No help text was defined for many organization types.
* Copy-edits the help text somewhat.
* Offers all of the organization type options.
* Removes the 100% coverage requirement because it's annoying to test
the e.currentTarget click handler.
We rename loader.svg to loader-white.svg as this svg contains
white rectangles for clarity as we have also added loader-black.svg
which is same but with black rectangles instead of white.
We use img tag for showing the loading spinner in message edit form
and dialog-widget submit button, instead of object tag because using
object tag gives the following error- "Refused to display
'https://chat.zulip.org/' in a frame because it set 'X-Frame-Options'
to 'deny'." in the browser console.
As mentioned by Anders in czo, this is probably because we’re loading
the SVG using an <object> tag as if it’s totally-not-an-IE3-ActiveX-
control.
We also need to add a new svg file similar to loader.svg with the
change that the retangles are filled with black color. This needs
to be done because we cannot get access to the svg document if we
use img tag and so we cannot change the color of rectangles using
jquery as we were doing before to show the spinner depending on
day/night mode. So, now we just set the src attribute of img tag
to the correct svg file depending on day/night mode.
Discussed in #issues > loading tail-spin.svg denied by X-Frame-Options.
We use img tag for showing the loading spinner in image_upload_widget
instead of object tag because using object tag gives the following
error "Refused to display 'https://chat.zulip.org/' in a frame because
it set 'X-Frame-Options' to 'deny'." in console.
As mentioned by Anders in czo, this is probably because we’re loading
the SVG using an <object> tag as if it’s totally-not-an-IE3-ActiveX-
control.
Discussed in #issues > loading tail-spin.svg denied by X-Frame-Options.
We do following changes in this commit to have a uniform file
structure for stream setting templates.
* Move change_stream_info_modal.hbs to stream_settings folder.
* Rename subscription_stream_privacy_modal.hbs to
stream_privacy_setting_modal.hbs.
* Move stream_privacy_setting_modal.hbs to stream_settings folder.
This commmit does following two changes to subscription_settings.hbs:
* Rename subscription_settings to stream_settings to have a uniform
naming pattern for stream settings.
* Move it to stream_settings folder.
This commit does following two changes:
* Rename subscription_privacy template to stream_privacy_icon so
that its purpose is clear from its name.
* Move it stream_settings folder.
We handled tooltips for failed message action buttons separately
through our default tippy-zulip-tooltip class because of
a diffrent html structure for these buttons. But as we refactored
html for those buttons to have same structure as for other buttons
in message action this extra check is no more needed.
We had tooltips bound to failed message action icons, because of
slightly different html structure for these action buttons as
compared to other message action buttons. There were some minor
problems due to this. First there was difference of delay
in which we show other normal action button tooltips. Second
we had to add extra checks to handle tooltip content for these
buttons in tippyjs module.
This is fixed by having same html structure for failed message
buttons as for other message action buttons.
Earlier, the `stream_header_colorblock` wasn't properly styled
with the dropdown toggle button from a UI perspective. This was so
because they had a few space between them due to inconsistencies
in their border radius.
This commit adds an border-radius property to the move topic
dropdown toggle button to eliminate the above issue and
improve it's overall look.
Earlier, the `stream_header_colorblock` wasn't properly styled
with the dropdown toggle button from a UI perspective. This was so
because they had a few space between them due to inconsistencies
in their border radius.
This commit adds an border-radius property to the message_edit
dropdown toggle button to eliminate the above issue and
improve it's overall look.
Previously, the message edit `stream_header_colorblock` used
to incorrectly extend down till the textarea which caused
the UI to be buggy.
Fixed this by adding a `margin-bottom` property similar to
what we did in case of Move topic dropdown.
This minor change accidentally was missed within commit
7c25bd1aa8.
Previously, Everytime the user triggers the Stream create UI
by pressing the `Create stream` button, the
`create_handlers_for_users` function would reinitialize which
created duplicate event handlers for its elements.
This could lead to multiple click events being triggered over the
same element.
One such example was filed as #19255, where the click event was
triggering twice and hence the "Copy from stream" dropdown
would remain folded (closed).
Fixed this by - Initializing the `create_handlers_for_users` function
within the main `set_up_handlers` function, which is triggered only
once upon the opening of Stream create UI.
Fixes#19255.
This commit fixes the bug of showing custom email to admin in
the user-info form even when email_address_visibility is set
to admins only.
This commit fixes it to show the correct email according to
email_address_visibility values.
This commit restructures the top-level navigation on our landing
page using dropdowns in a manner that allows us to advertise some
important pages to our visitors:
- Use cases for companies, open source projects, and communities.
- Miscellaneous pages about the product are now accessible from the
"Product" dropdown.
- "Resources" are a few key resources our users may want to consult
if they need help or support.
Implemented dropdown_list_widget in message_edit UI
which enables the functionality to search for streams
while moving a particular message across streams.
This matches the UI we have in the "move topic" widget.
Fixes#18416.
Previously, non-admin emoji authors were allowed to
delete the emoji only if add_emoji_by_admins_only
was false. But, as add_emoji_by_admins_only setting
is for who can add emoji and not delete emojis, it
should not affect the behavior of deleting emojis
and users should always be allowed to delete the
emojis which. they added themselves
This commit changes the behavior to show the tip, explaining
which user roles are allowed to edit user groups, to user
with all roles because it is better to show the user which
other roles are allowed to edit. Previously the tip was shown
to non-admin users only.
This commit changes the bot-edit modal to use dialog_widget instead of
edit_fields_modal.
This commit also removes edit_fields_modal module as it is no longer used.
This commit changes the edit-user-info modal to use
dialog_widget instead of edit_fields_modal.
The edit_fields_modal module will be removed in
further commits to avoid code duplication.
This commit changes the edit-linkifier modal to use
dialog_widget instead of edit_fields_modal.
The edit_fields_modal module will be removed in
further commits to avoid code duplication.
We show red color for confirmation modals and green for other
modals with input fields.
As of this commit, only confirmation modals use dialog_widget but
some other modals with input fields will be migrated to use
dialog_widget.
We used html_submit_button to pass text to be present in the modal
submit button. There are only two possible options as of now -
"Confirm" and "Save changes" and the correct one can be determined
using is_confirm_modal parameter. So, we remove this paramter for
now and we can add it later if we have more type of modals using
this widget.
This commit adds a new dialog_widget.js file containing most
of the code of confirm_dialog.js with some minor changes and
changes confirm_dialog to be a wrapper around dialog_widget.js.
We pass 'is_confim_dialog' as true in dialog_widget for a
confirm_dialog modal. This commit also renames confirm_dialog.hbs
and confirm_dialog_heading.hbs to dialog_widget.js,
dialog_widget.hbs and dialog_widget_heading.hbs respectively.
This commit renames the variables, functions used in confirm_dialog.js
and classes and ids used in confirm_dialog.hbs.
This change is made so that we can easily migrate edit_fields_modal to
use this same code with some more changes.
We will change the file names and correspondingly import variables in
the next commit.
The expand-compose icon currently overlaps with the
recipient input field of private message compose box.
Reduce the size of the division to fix overlap.
Added CSS property of cursor as pointer to the copy
icon in about_zulip section which indicates the
icon to be clickable.
(This minor adjustment was probably missed in a74b52db22)
As we want subscriber list to occupy rest of available space
in the tab, we use relative units (vh) and calc to set the
max-height property dynamically without losing scroll behavior
for stream list.
This avoids showing a highlighted checkmark for resolve topics, which
looks weird given that the topic name itself contains a "resolve
topic" checkmark.
We are doing this to avoid annoying behavior, when
"enter sends" is enabled, and the user accidentally hits
"Enter" and has to deal with the error message.
Fixes#19182
We improved it in the following ways:
* Show the error message with the maximum character
limit.
* Disable the send button.
* When the user tries to send the message via hotkeys
i.e, When "Press enter to send" is enabled or the user
uses "Shift" + "Enter" shortcut, Flash the red border
around the compose box.
Also renamed `check_and_set_overflow_text` to
`check_overflow_text` for better clarity.
This bug was found when the user tries to send a
over character limit message, i.e It has failed the
validation but it still shows the "Sending..." text.
This commit essentially migrates our custom email tooltip
to tippy tooltip for displaying user's email when their
names would overflow past the right edge of user popover.
This also removes the `email_tooltip` and `tooltip_holder` HTML
classes aloong with their CSS styles as they no longer used.
We use subs as a common variable name for a collection of stream
data structure used in settings, in lot of modules. So this
rename clears a bunch of related shadowed variables.
Another minor issue fixed in this commit is behaviour of cursor
on hovering message retention setting label. We fix it by changing
this element this to be a div instead by label. It could be fixed
by adding a css rule for this instead of changing it to div rather
than label but this looked more stable to future refactors.
Labels for stream post/privacy value settings were not properly
linked with their input element so clicking on labels did not
toggle radio buttons. We fix this by having inputs elements inside
label elements to have correct linking.
We remove icons (hash | lock | globe) in permission description of
an stream, as it is pretty obvious as we use them at quite a number
of places with stream names, also it does not fits well with rest of
the text in that area.
Previously stream permissions were hard to find and understand
as they were displayed like a paragraph in description format.
We improve them by using a list item for each different permission.
We had a common title `stream settings` for two cases
when no stream was selected and also when settings for
a particular stream were shown.
To improve this situation we now show `Settings for {stream_name}`
when settings for a particular stream are shown.
We move away from a single scrollable page to have a tabs settings
structure instead.
This commit consists of the minimal changes required to set up toggler
component. And the subsequent commits would include all the UI UX
changes required for updating the layouts.
Co-authored-by: Ryan Rehman <ryanrehman99@gmail.com>
Similar to what mentioned in 2e196fd5d3
previous sea-green colour didn't meet the WCAG AA standard
guidelines for color contrast. This changes meets WCAG AAA
standard.
When editing a topic name (and the topic name has some link
in it) through the recipient bar, the external link icon
overlaps with the stream name. Shifting the code now
ensures that the external link icon would appear to the
right of the topic edit form box.
Also see: https://chat.zulip.org/#narrow/stream/9-issues/topic/topic.20edit.20recipient.20bar
This commits removes the redundant `compute_show_invites` function
which computes the `show_invites` page parameter in `lib/users.py`.
It is so because, commit 13399833b0 removed
the `show_invites` context variable passed in index.html.
Hence, the `show_invites` page_param key is no
longer required to compute in backend as it can be switched with
`settings_data.user_can_invite_others_to_realm()` in the frontend.
This commits also removes the `test_compute*` tests in
`test_home` that concerned with the `show_invites` page parameter
as they are no longer required.
This reverts commit 5a61c9bb14 (#18849),
which had a number of bugs:
• It had a poor interaction with Ctrl+Shift+L resulting in double link
formatting.
• It didn’t work at all in Firefox.
• It didn’t check whether what you’re pasting into is even a compose
box.
• On pasting into the message edit box, it would throw “Error: Cannot
read property 'text' of undefined”.
Signed-off-by: Anders Kaseorg <anders@zulip.com>
We extract the code for checking night mode setting on
the basis of color_scheme value and using matchMedia when
color_scheme is set to automatic. This is currently used
in rendering the correct logo only.
This is a prep commit for fixing loading indicator not
visible on message-edit button in night-mode.
Our dropdown-toggle buttons are meant to have the same size as select
elements, but looked weird if you selected a stream with non-English
characters in its name.
We fix this by copying some styling details settings from our common
input/select styling.
Fixes#18479.
This commit makes a working toggler in compose_actions that adds the
compose-fullscreen class to the compose that removes the max-height
from the compose textarea and adds flex elements above so that the
height automatically adjust with the device height. This results in
making the compose box full screen sized.
The compose_height.js maintains the state of the height of the compose
box. Also, when the compose box is closed, the compose box is reset to
it's default behaviour and original height. So, everytime user need
not toggle off the compose full size and only for specific message
it is used.
It also adds destroy autosize on compose_height state change.
It destroys the autosize of textarea when the full
screen sized compose box is toggled on. And everytime when it is
turned off, it reinitialises the autosize. This also adds a
condition in autosize_textarea to only autosize when composebox
is not in full height state.
Fixes#17660
We extends composebox_typeahead to support autocompletion
suggestions on editing the topic of a message from message
edit form as well as from recipient bar.
Tweaked by tabbott to have correct keyboard interaction without
needing to patch Bootstrap.
Fixes: #16368.
This change ensures that we pop up the typeahead when one
has entered just `@`. This will make clear to the user
about the @-mentions feature in Zulip.
This also makes us consistent with expectations from other
chatting apps like Slack, Discord, etc.
Added few test cases and modified the present ones.
Fixes: #19142.
Fix a bug where the compose box cut the message without warning the user
the message pasted was longer than the allowed. It was fixed by stopping
cutting the message off and showing an indicator whenever the limit exceeds
and removing the indicator as soon as message gets less than that.
The cut off for showing the indicator is set as 90% of the limit.
Fixes#15909
Co-authored-by: João Maurício <carvalho.joaomauricio@gmail.com>
We show the text, which is either the linkifier label or the URL
(depending what generated the topic link).
For the desktop app at least, we probably as a follow-up want to also
show the URL.
(Though maybe it'd be better to just make the desktop app display the
URL).
Generally, tooltips placed at top look good. If the tooltip cannot
fit at top, it will by default be placed at opposite side.
Removed the unnecessary top placement definitions.
We add some additional delay so that user doesn't have to see
them every time but it is the delay is short enough so that
a user can view the full name of long streams without waiting
too long.
This commit changes the pastehandler to have a case when
a url is tried to paste on composebox. It instead of
directly pasting it, changes the content as we do using
ctrl + shift + L, just the difference is here it uses,
the copied text instead of url and cursor moves forward.
Fixes#18692
This commit migrates the `navbar.html` Django template
to handlebars by creating a new file as `navbar.hbs`
within `/static/templates` which is then rendered
using `ui_init` module.
As a part of migration, we also remove the `search_pills_enabled`
and `embedded` parameters from the context attribute as they
are no longer needed now.
Fixes part of #18792.
Right now, on clicking `quote and reply` on any message, the quoted
message is always inserted at the top of compose-box irrespective of
the current cursor position. Also, after insertion of the quoted
message, the cursor is shifted at the end of the compose box.
This commit changes this behaviour to insertion of quoted message
at the current cursor position with a newline at the end of quote
and moving the cursor position to that newline after insertion.
A newline is added at the beginning of quoted message only if there
was some content already present in compose box before the previous
cursor position.
Tested on Google Chrome and Firefox browsers on Ubuntu dev environment.
Fixes: #16836
Similar to the previous commit, the tooltip was not
completely visible in this case and this bug was
similar to the one corrected in recipient bar icons.
Here, the tooltip was partially visible. This bug was similar
to the one that is corrected for recipient bar icons.
I have removed the class attribute `tippy-zulip-tooltip`
for Filter stream title as this will be handled by the
new changes.
This commit renames confirm_dialog_yes_button class to
confirm_dialog_submit_button. This will help in keeping
a general class name when deduplicating the code for
confirm_dialog and edit_fields_modal.
This commit renames the html_yes_button parameter of confirm
dialog widget to html_submit_button and also all the related
variables in confirm_dialog.js.
This will help in keeping a general name when deduplicating
the code for confirm_dialog and edit_fields_modal.
This commit changes the error message element of confirm_dialog to be
above the text of dialog and to be a nice box using already defined
"alert" class.
This commit renames modal_body_html and modal_label to
html_body and html_heading respectively. This change
will help us easily deduplicating the confirm_dialog
and edit_fields_modal code.
Currently, the "Home" link at the top takes one to the doc root,
i.e., /help or /api. This is a little misleading since "Home"
seems to be more synonymous with the Zulip homepage.
This commit adds a proper backlink to the top logo that takes you to
the homepage and renames "Home" to be more specific. The text after
"|" will now take you to the doc root instead (/help or /api). Note
that this allows us to link the /help and /api pages from the
homepage while ensuring that backlinks allow the visitor to get back
to the homepage.
This commit first moves the compose.validate() function out
with the functions that are needed by it. Then one by one
checked for which function is now not needed in compose.js.
This moves all validation related functions out of "compose.js"
to "compose_validate.js".
Splitting compose announce variables out of compose.js.
This commit moves the "user_acknowledged_all_everyone" and
"user_acknowledged_announce" out of compose.js to reduce
cyclic dependency of compose_validate on compose.js.
Moving wildcard mentions to compose_validate.
The wildcard mention settings are mostly used while validating.
Also to reduce the cyclic dependence of compose in
compose_validate, the related wildcard mentions are moved out to
compose_vaidate.js.
This also converts reset_acknowledged functions to set values
by passing values.
This commit migrates the `right_sidebar.html` Django template
to handlebars by creating a new file as `right_sidebar.hbs`
which is then rendered using `ui_init` module.
It also removes the tests in `test_home` due to the template
migration, since these elements aren't rendered on the backend
anymore.
We also remove `test_compute_show_invites_and_add_streams*`.
Fixes part of #18792.
This commit migrates the `left_sidebar.html` Django template
to handlebars by creating a new file as `left_sidebar.hbs`
which is then rendered using `ui_init` module.
These are the minor changes introduced by virtue of template
migration -
- The `compute_show_invites_and_add_streams` function now
only concerns with the invite_to_realm_policy.
- Renamed the `compute_show_invites_and_add_streams` function
to `compute_show_invites` due to the above change.
- Fixes relevant `test_home.py` tests due to the above
changes.
Fixes part of #18792.
We've been unhappy with this fragile nth-last-child logic since the
big navbar rewrite a few years ago.
Now that we have TippyJS tooltips in the navbar area, it actually
causes a bug: Hovering the "subscribe count" widget makes the search
icon jump.
Fix this by just adding a CSS class to the two elements that are
intended to be modified by this logic.
We currently have the resolved topics prefix shown as part of
the topic name in the left sidebar. However this causes inconsistency
while showing topic names. Hence this adds support for showing the
prefix in the cutter to the left of the topic name.
Fixes#18989.
This commit changes the code to scroll to the top after closing the
message edit form to make sure the cursor it at same position and
the scroll does not distract the user when the request of message
edit is processing. Though the scrolling is not visible distinctly
in much case and is visible only when there is some delay, but it
is fine to change this code as the logic is correct and to be on
safer side.
We now show loading indicator inside the 'save' button
instead of hiding the buttons to show the loading
indicator. Both the save and clear buttons are disabled
when the request is processing. We do not change color
of the buttons just change the cursor to indicate that
button are disabled and nothing happens on clicking them.
The reason for disabling the cancel button is that it
is actually not possible to cancel the action once
loading has started, so it is actually better to disable
it only such that users are not confused.
This commit adds a wrapper div element around the button
because we wanted to add two css properties to the button-
'pointer-events: none' such that nothing happens on click
and 'cursor: not-allowed' to indicate that buttons are
disabled. But these boht styles cannot be added to same
element because 'pointer-events: none' overrides the
'cursor: not-allowed' style and normal cursor is visible.
That's why we add a wrapper to add 'cursor: not-allowed'
style to it and add 'pointer-events: none' to the button.
Additional changes are added in `tippyjs.js` to ensure
that the tooltip doesn't hide behind the message
box or it is not limited by the parent container, in
case of recipient bar icons.
We wrap the general stream name, description and type properties in
a "general_settings" div.
The "regular_subscription_settings" div was already present, so the
only change made was renaming this to "personal_settings".
We also wrap the email and adding of members settings in a new
"subscriber_settings" div.
This is a prep commit which will be helpful when we want to display
only one section and hide the other two.
Co-authored-by: Ryan Rehman <ryanrehman99@gmail.com>
The current system to change stream information like Stream name and
description isn't consistent with what we use everywhere else. It's
also slightly difficult to maintain.
Co-authored-by: Pragati Agrawal <pragati22066@gmail.com>
The presence setting is more suited in 'Account & privacy'
section as it is not related to notifications in anyway
and resembles privacy of user by allowing user to hide
his status of being online.
This commit adds a new trigger for compose.start that is
"new private message". It will clear the message recipients
whenever compose.start is called with this trigger.
This solves the bug, when a person is in a PM narrow and
clicks the new private message button, it opens the
composebox with the recipients filled out with whoever
you're narrowed to, rather than opening a new, blank PM.
CZO link for the issue
https://chat.zulip.org/#narrow/stream/9-issues/topic/.22New.20private.20message.22.20isn't/near/1222712
This shortcut now renarrows to an empty topic, rather than to the
stream, as long as the topic input is nonempty.
This was debated in the original implementation of this feature:
https://github.com/zulip/zulip/pull/9511#discussion_r190323319
Having seen the experience in practice, the current behavior is
surprising and we should migrate to the other option originally
considered. In particular, the argument that "narrowing to the stream
would still tell you the topic is empty" turns out to be inaccurate,
since the history within the stream may not be in the most recent
messages in the stream.
Fixes#19122.
d779a1c tweaked `get_full_datetime` to return a string instead
of a {date, time} object. This function is used for recent topics
too but wasn't fixed to use the string.
This resulted in showing 'undefined undefined' in tooltip.
Previously, we showed a `Copied!` alert on copying link to a message
irrespective of the fact that the link was copied or not.
Hence add an event listener that shows the `Copied!` tooltip only
if the action was successful.
Fixes#19019.
Previously, we showed a `Copied!` alert on copying a message
irrespective of the fact that the message was copied or not.
Hence add an event listener that shows the `Copied!` tooltip only
if the action was successful.
Fixes#19019.
If highlight_toggle is called before activate_section_or_default,
then 3 hash change event take place for single hash change.
For example if hash is changed from "#settings/profile" in the
browser to "#organization/organization-permissions", then the
cycle is-
"#settings/profile" -> "#organization/organization-profile" ->
"#organization/organization-permissions".
This is because "highlight_toggle" also leads to call of
"activate_section_or_default" with section as default section
(i.e. organization-profile) then the correct section is opened
again as activate_section_or_default is called in hashchange.js
after highlight_toggle.
The middle hash of the above example depends on the last open
section in organization area or is the default section which is
"organization-profile" when overlay is opened first time after
reload.
This is also consistent with the code for opening overlay from
gear menu where "highlight_toggle" is called later.
Reproducer:
* Open the settings overlay from gear menu, the profile (user profile
not organization profile) is opened.
* Note the current hash in browser is "#settings/profile".
* Now directly change the hash to be "#organization/organization-permissions".
You will notice that the content is fine, but there is problem in left
sidebar and the hash. The left sidebar content is still of user
settings and not organization settings and the hash in the browser is
"#settings/organization-permissions".
Now the bug was due to normal_settings.activate_section_or_default
call instead of org_settings.activate_section_or_default.
Calling from normal_settings leads to hash_prefix being "#settings"
which changes the hash in the browser and also toggles the left
sidebar to display settings part instead of organization. The right
section content is of organization-permissions only because it
depends only on section and not prefix.
So, this commit adds a if-else condition deciding what to call based
on the hash.
The issue was text label has `display: inline-block`
property which caused it to go to a new line in smaller
width screens.
This commit fixes it by changing its display property to `inline`.
Fixes#19075.
Previously, there were cases where the table contents started to
overlap with the table heading when scrolled down the table.
This was mostly visible in `Custom Emoji` organization UI,
where the images and action table column contents started to
overlap with the table headers.
Rectified the bug by adding a CSS `z-index` property to
`table-sticky-headers` class which takes care of all
such overlapping issues.
Fixes#18906.
Previously the header of settings overlay
was 'SETTINGS / {name_of_section}'.
This commit changes it to be one of the two
mentioned below according to the opened
section-
1. 'PERSONAL SETTINGS / {name_of_section}'
2. 'ORGANIZATION SETTINGS / {name_of_section}'
Note - Have kept the header as original in
case of mobile as the above text will be
too long.
The parameter passed to 'handle_topic_updates' is 'muted_topics'
and there is also a javascript file with same name.
So 'muted_topics.get_muted_topics' gives error, and this commit
fixes this by changing the parametr name to 'muted_topics_list'.
This was introduced in 5f74e78bee.
The user timezone is only used for user's profile, so we can
move this setting to the Profile panel of settings and this
will also help us in covering some space when there are no
custom profile fields for the organization.
We separate "Your account" section to two different sections -
"Profile" section for user name, custom profile fields, and avatar
and "Account & Security" section for email, password, role, api-key
and deactivating button.
Another important change here is that the modal for changing name
is removed and now the name has a simple input text box and it
behaves similar to inputs for custom-profile-fields.
Fixes#18848.
We add unsubscribe button in the stream list that allows
users and admins to unsubscribe them using profile modal.
If a user attempts to unsubscribe from a private stream
we redirect them to do so from stream setting overlay
to avoid a really confusing user experience as we ask
for confirmation before unsubscribing such streams.
We rename `stream_subscription_info.hbs` and its related
variables and functions to `stream_subscription_request_info.hbs`.
So that its clear that it is used for displaying info about
requests sent for stream subscriptions.
This is a follow-up for #18957.
We show a tooltip besides "Profile picture" heading
to the users who cannot change their avatar explaining
that the avatar changes are disabled in organization.
We add disabled prop on buttons only and we add the css for
buttons (and some specific class elements) when disabled as
'cursor: not-allowed' or 'pointer-events: none' which means
the user cannot use these buttons when disabled.
This is not the case for the avatar widget as we use a div
element there and not button and neither those specific
classes which has appropriate styles defined.
We use the avatar image block in two ways - for showing image
and as a clickable target (which is actually a div element)
for uploading, so instead of adding 'disabled' prop we are
hiding (adding display: none) the div such that it is not
visible on hover and also cannot be clicked.
This is a prep commit for making zero as invalid value for
message_content_delete_limit_seconds, as that change would
add one more else-if and our eslint rules convert such cases
to switch case. Doing this here would keep the diff smaller
in the original commit of making zero as invalid value.
We do not need to check whether allow_message_deleting is true
when checking for time limit, because we already have a condition
before that returns false if allow_message_deleting=False.
Tooltips of message retention and realm deactivation
should have appropriate class as per the setting and
not "realm_allow_message_deleting_tooltip" for all
the different tooltips.
We ignore deactivated users when they are being added to streams.
To give current user information about the ignored user ids
we show it along with other details about subscribed and
unsubscribed users.
This partially addresses: #18949.
This is required as we added `br` tags irrespective of whether
there were any users in the subscribed or already subscribed
category. This made the spacing here look odd. We now include
br tags inside conditionals to render them only when required.
This refactor helps to avoid code duplication that occurs
if we need to add any extra info to the stream_subscriber_info
and also cleans up code in `add_subscriber_form` and
`.subscriber_list_remove form` handler to make it more readable.
It is preparatory commit to add information about ignored
deactivated users when bulk subscribing users to streams.
This commit fixes the bug of always showing
day-mode realm logo when color scheme display
setting is set to automatic but the OS setting
is dark theme. This is because we cannot check
the OS setting on backend and we need to set
the logo url accordingly in frontend only.
So, we remove the logo url computation from
backend completely and instead compute it in
the frontend only.
Fixes#18778.
When the hash changes to `#reload...` before a reload, the app tries
to show default_view since there is no `case` handled for it. What we
want to do is ignore this hashchange, since we're about to be reloaded
(so it's not helpful) and if the timing is wrong, it can cause the
browser to reload back to "Recent topics" rather than saving the
user's view.
This fixes a bug introduced in 0e65225d06.
With tests from Riken Shan.
While writing a long message in compose-box, the last few messages of
the current stream gets covered by the compose-box and it gets pretty
annoying sometimes trying to figure out a way to read the last message
of the stream while writing. Right now, the only way to get past this
is to resize `compose-textarea` by using the resize tool at the
bottom-right corner of the `compose-textarea`. But, that small resize
tool is not always readily visible to the user.
The proposed solution in this commit is to reset the `max-height`
property of `#compose-textarea` everytime `bottom_whitespace_height`
is resized such that the total height of `#compose` is always less
than or equal to the height of `bottom_whitespace_height`. Doing
this, the compose-box never covers the last message of the current
stream.
The only problem with this is that if the compose-box is closed at the
time of bottom-whitespace resize, we cannot find the
`compose_non_textarea_height` and so, we cannot reset the max-height
of `#compose-textarea`. To solve this, max-height of
`compose-textarea` is also reset everytime a new compose-box is opened
according to the value of `bottom_whitespace_height` at that time.
Thus, if the compose-box is already open at the time of
bottom-whitespace resize, the max-height of `#compose-textarea` will
also get reset at the same time, whereas, if the compose-box is closed
at the time of bottom-whitespace resize, the max-height of
`#compose-textarea` won't get reset at that time, but it will surely
get reset whenever the user will open the compose-box.
Tested on my Ubuntu Development Environment on Chrome and Firefox browsers.
Fixes: #16038.
We've had for years a subtle bug, where after editing a topic in the
left sidebar that had previously had unread messages (but doesn't
anymore), the old topic might still appear in the sidebar.
The bug was hard to notice except for new organizations or in the
development environment, because the pre-edit topic appeared with a
sort key of -Infinity (that being the max ID in an empty list of
message IDs). But this is an important onboarding bug in reducing
faith in Zulip's topic editing just working, so I'm glad to have it
fixed.
Fixes#11901.
This commit fixes a bug of not enabling/disabling
the email-change button when email_changes_disabled
setting is changed. Bug was because of using wrong
selector.
The class "name_change_container" is used in the custom
profile fields form.
The name of custom profile field should not be affected
by this setting.
Also confirmed the behavior by testing on master itself,
that these fields are not hidden actually due to this
code being in settings_account itself.
We can also remove the class "name_change_container" as
there is no use of this class elsewhere.
We handle the css using email-change-form and thus
there is no need for 'user-name-section' class as
this element is used for emails and not user names.
'user-name-section' class is only used to set css for its child
settings-info-icon. This commit removes the 'user-name-section'
class from elements which do not have 'settings-info-icon' as
their child element and also these elements are in not related
to user names.
If a user sets themselves to unavailable, or otherwise
drops out of our presence data, we should still show
them at the top of their own buddy list.
See https://chat.zulip.org/#narrow/stream/137-feedback/topic/Users.20Sidebar/near/1220135
for more context.
I believe this change makes sense as a defensive
fallback, but it's quite possible that we may
want to change the server to record presence info
about users who are "unavailable" and then only
send that info to them (and not their peers).
This effectively reverts d96d4e30ab,
which is a bug that hasn't been present for other reasons due to past
design changes.
It fixes a bug where the "Search operators" page had missing margin
between the table and post-table content..
This commits ports the `search_operators.html` file from
./templates to handlebars, essentially creating a new file
as `search_operators.hbs` within /static/templates which is
then rendered using info_overlays.js.
As part of this migration, we rewrote the way internationalization was
done, since the previous implementation incorrectly did not support
languages with a different word order than English.
We also not consistently use periods at the end of the descriptions.
Co-authored-by: Tim Abbott <tabbott@zulip.com>
Fixes#18504.
This commits ports the `keyboard_shortcuts.html` file from
using the Django template to handlebars, essentially creating
a new file as `keyboard_shortcuts.hbs` within /static/templates
which is then rendered using info_overlays.js.
Fixes part of #18792.
This keeps it consistent with other widgets in message body area.
Set the display position to top to be consistent with
compose control buttons.
Changed the tooltip content to be more readable like
Thursday, May 18, 2017
7:12:53 AM India Standard Time
Also changed timerender.get_full_datetime() to consider
users' 24 hour format preference.
When a user tries to send a (group) private message to a deactivated
user, a compose error is displayed.
Fixes#13766.
Co-authored-by: Signior-X <b19188@students.iitmandi.ac.in>
This modifies the appearance of pills for deactivated users
in the following ways:
* Adds `(deactivated)` with the deactivated user's name.
* Add a tooltip to the deactivated user's pill stating
that one can't send a message to this user.
* Color the deactivated user's pill reddish.
This now also adds tests for user_pills.
Part of #13766.
Co-authored-by: Signior-X <b19188@students.iitmandi.ac.in>
This commit treats deactivated users as valid users
for compose box which prevents the PM list to collapse
when a deactivated user in the PM list is clicked.
Part of #13766
Co-authored-by: Signior-X <b19188@students.iitmandi.ac.in>
The waiting time of 5000ms was probably added for testing UI of
spinner in 2f99e6b7b2 and was missed in review. This commit removes
the waiting time and now the user is deactivated almost instantly when
the button is clicked.
This also migrates from loading the modal dynamically rather than
statically once at page initialization.
With styling changes by tabbott to preserve the original look of the
UI.
Fixes#18278.
This prevents a bug where keypresses are received by recent_topics view
even if a modal is present on it, which prevents, for instance, the modal
from receiving text input.
This commit modifies the linkifier-edit modal to use newly added
edit_fields_modal framework.
One important change is that we remove the "edit-linkifier-status"
element as the corresponding "edit-fields-modal-status" element
is added in edit_fields_modal.hbs and we also modify the css
accordingly. This "edit-fields-modal-status" is used only for
this modal and remains empty for others, so this change does not
cause problems with other modals.
There is another element which uses "edit-linkifier-status" as a
class, but the css we defined was for "edit-linkifier-status" as
id, so the css change is also safe.
This commit modifies the modal for editing bot information to
use edit_fields_modal framework.
We also change the id of form element of this modal such that
it makes sense with the actual use of modal and there is no
problem with this change as styling of this modal is not
affected.
We create a new widget edit_fields_modal such that this common
framework can be used in bot-edit modal, linkifier-edit modal
and user-edit modal, which have very similar implementations.
The "edit-fields-modal-status" is used only for edit-linkifier
modal and remains empty for others, so this change does not
cause problems with other modals.
This commit moves the compose_error function to its own module, which
will be useful for future work splitting the compose module.
We also simplify compose_not_subscribed_error to call the
compose_error show function.
This commit fixes the bug with the delete button of both profile
picture and realm-logo buttons. The button was shifted downwards
and was caused due to line height change in 5d64c21c38.
Found the correct value of 20px by checking the line-height in
one test organization on zulipchat.com where the button position
looks correct.
This commits adds the support to copy a topic link
to the clipboard by introducing a new "Copy link to topic"
topic sidebar action which is placed below the
"Mark all messages as read" action.
Basically, this does the same job as right clicking upon the
topic name and selecting "Copy link".
Closes#18946
We show a spinner inside the button instead of hiding the button
and then showing the spinner in the bottom area. We also disable
the button to avoid repetitive clicking by user.
Click handler added for cancel button in stream creation form
incorrectly assumed data-dismiss to be present only in that
form inside `.subscription`. We now handle editing stream
properties like stream privacy and stream name/description
by making use of modal widget. So this assumption creates
a bug where closing these edit modal closes complete stream
edit pane. It was added in 1886f0a015.
We fix this by binding this handler to data-dismiss element
inside stream creation form.
We had our input elements for stream settings inside li tags
and their alignment was managed using CSS. We move away from
this HTML structure to have inputs and labels inside divs for
two reasons. First is that if we want to later refactor the HTML
to have some different design, then having them inside `ul`
requires complex changes to CSS and eventually we would have
to move away from using `li`s for the part that is changed to
have a different design. Second `li`s are generally not used
to organize input elements.
Above is an explanation of why this change is a preparatory
commit for shifting to have a tabbed design in the stream edit page.
So following changes are done to have a more consistent
HTML structure in stream types modal:
* Added modal-body and removed the non-standard
usage of the unordered list for settings header and inputs.
* Updated relevant CSS rules to have the same design during refactor.
Co-authored-by: Pragati Agrawal <pragati22066@gmail.com>
We had a lot of functions and click handlers that were only
involved with user profile modal and were not related to
popovers logic in any way. So we extract these functions
into a separate module `user_profile.js`.
It can happen that reactions are re-rendered while we are
in the process of showing tooltip for them. In that case,
we setup MutationObserver for an element not present in DOM
which results in weird behaviour. We avoid it by checking the
element again before setting up MutationObserver for it.
See https://chat.zulip.org/#narrow/stream/6-frontend/topic
/tippy.20bug/near/1206316 for details on the issue.
We used name parameter in tab component callback to handle our
custom logic when switching tabs in profile modal. Using name
here invites a posible bug as these name are tagged for
translation. So to avoid this we switch to use key (html id
for these tabs) for this as they are always constant.
We had stream and group tab inside a common div with class
`subscription-group-list` due to this adding any info
elements like alert boxes that were specific to one of them
became difficult. To fix this we keep them in their own
`.tabcontent` div. This change also makes the handling of
display of different tabs a lot easier and cleans
up unnecessary javascript code that was handling the
display of common parent div of stream and group tab.
We show stream tab before user-group tab but in the template
this order was reversed that created confusion while editing
any one of them. So we correct their order in the template
to reflect the order we show in UI.
This refactor changes two things - position of the modal, as it
is moved up by some amount because of using confirm_dialog and
also loading spinner of confirm_dialog widget is used.
We turn off the eslint no-use-before-define for TypeScript files
because it does not work correctly for types. There is already
a typescript-eslint version of it that is enabled for TS.
We also update the error handler on window to use instanceof check
for ErrorEvent instead of checking the error property.
We also update the tippy.js mock in tests to expect a element
(zjquery FakeElement function) instead of zjquery instance, and get
rid of setting _tippy property itself to a noop function.
nooblag
Eeshan Garg
Aman Agrawal
Tim Abbott
Anders Kaseorg
Sahil Batra
akshatdalton
Ganesh Pawar
Alya Abbott
Priyam Seth
tushar912
Steve Howell
Riken Shah
ericluoliu
Lefteris Kyriazanos
Priyank Patel
aryanshridhar
sahil839
M@
Mateusz Mandera
manavdesai27
PIG208
Priyansh Garg
Abhijeet Prasad Bodas
Aryan Shridhar
Vishnu KS
m-e-l-u-h-a-n
Dinesh
Wesley Aptekar-Cassels
Kerry Jackson
Gaurav Pandey
Signior-X
Pankaj Patil
Hashir Sarwar