When the caret in textarea is around the right end of the screen,
typeahead can overflow the window. To fix it, we use tippy's
mechanism to keep the tooltip inside the visible boundary.
(cherry picked from commit 6c500e9a6e)
Here we want to rerender the current narrow after receiving an
event which moves messages. We have mechanisms to keep using
the cached list if we are narrowing to the same narrow which
we want to avoid in this case.
This reworks canonical_url_of_media to work with HTMLMediaElement,
making it possible to do cross-browser inspection of media sources.
(Firefox and Chrome disagree on whether to return the "href"
attribute as the path in the source, or a full URL).
Additionally, we ensure non-empty cache keys on media so
unexpected results from the DOM do not get cached.
Co-Authored-By: Alex Vandiver <alexmv@zulip.com>
Co-Authored-By: roanster007 <rohan.gudimetla07@gmail.com>
Using different punctuation for the aria-label from the tooltip is
silly. Additionally, we don't need to repeat the channel name in
aria-label; it essentially will never be seen and the message list
copy of getting the channel name was buggy.
Tested by deleting a DM and navigating to recent view. No error
is thrown and dm row is correctly placed.
Co-authored-by: Tim Abbott <tabbott@zulip.com>
Earlier tooltip info for the default topic menu notification option
had static string to display.
This commit changes the string info and includes channel name and its
corresponding privacy icon to display in the tooltip.
Earlier tooltips for topic menu button had inconsistent context with
that of other tooltips. In topic menu tooltip, action was described in
first line which different from that of other tooltips.
This commit changes the tooltip context and rearranges them to match
the format of action on first line and more context on second line.
Using "*" selector is inefficient as they require checking every
element because of the browser's bottom-up matching process.
This commit instead updates the selector to use individual
classes for elements to apply the CSS rules keeping in mind
to use unique class names instead of general class names.
Earlier, the `Add Channel` button was being focused even after the
modal was open, causing multiple modals to open on pressing enter
repeatedly.
This commit fixes the issue by removing the focus from the `Add
Channel` button after the modal is open by focusing the dropdown on the
modal.
Earlier the focus remained on the button to open the modal,
causing multiple modals to open on pressing enter repeatedly.
This commit fixes the issue by removing the focus from the button
by focusing on the first input field of the modal.
When moving message while compose box has content, stream was not
updated to the new stream if it was changed.
Tested by moving message with stream changed and with / without topic
changed.
This commit makes pasting formatted text a two-step process:
- Insert unformatted text
- Insert formatting
This way, undo (Ctrl+Z) will restore the original pre-formatting
syntax.
This is the same as the approach taken with
auto-formatting in #29302.
Fixes#31061
This commit fixes the overflowing issue for long bot owner names in the
user card popover, and also repositions the bot owner user card popover
to align with the bot owner name on the bot user card popover.
The `.popover-menu-user-avatar` selector being used to replace the small
avatar with the medium avatar was a broad selector, which also targeted
the bot's avatar when the bot owner's user card was opened. This commit
fixes this bug by scoping the selector to the current popover instance.
This CSS was needed when there was label along with the buttons
on the same line when this was originally added in 626c5ef55e.
But there is no label with the buttons now, so this CSS is not
needed.
I'm not aware of us using any of these; we don't generate the class
names involved, and we're not using `uppy.use` on any of their UI
components.
I confirmed that the only use of an Uppy UI component was the progress
bar, which was stopped using in
b01ac3623f.
We previously did not allow users to deactivate themselves from users
list to avoid users deactivating themselves accidentally. But we now
show a confirmation modal before deactivating, so it is fine to allow
it.
When the user card is displayed via right sidebar, the reference
can be lost due to it being updated or hidden on window resize.
To fix it, we show user card as an overlay when we cannot find
the reference.
Another solution would have been to relocate the reference and
update it for the popover but that is not naturally supported by
tippy once the popover has been displayed.
As a follow-up to the commit f124ef931, which deals with the keyboard
focus when opened via the keyboard shortcut `U`, this commit ensures
that when the user card is opened via the mouse, and the first
navigational key is pressed, the focus is on the first menu option
instead of the other tabbable elements which can be distracting.
Previously, clicking on "view user profile" in the user card popover
would open up the profile as an overlay, changing the hash, and
closing other already opened overlays when opened.
This commit would modify it to behave as a modal rather when
an overlay is already open in the background, thus preventing
the hash change, and allowing the background overlays to exist
when it is opened.
Fixes#30481
This commit updates the color of the text items in the user card popover
which are mostly user related information, to use the new Zulip color
palette.
This increases the contrast of the custom profile fields and other user
related information such as the user's local time and status text to
improve readability.
Fixes part of #31027.
The postcss-color-mix-function plugin does not support var() color
arguments since those cannot be dynamically resolved. This commit
replaces all var() color arguments with their static hsl() equivalent
values to ensure that color-mix() functions are successfully compiled
to rgb() for browser compatibility.
Fixes#30851.
Since there can be multiple messages being edited at once, with a
possibility for them to be out of the DOM, we use
compose_state.get_last_focused_compose_type_input to determine which
message edit to toggle the preview mode on.
We keep the compose box preview toggle behaviour more or less the same,
where we do not check whether the compose box was last focused or not if
there are no eligible message edit boxes and the compose box is open.
This behaviour works well for compose box since there's always one
possible compose box at a time compared to multiple message edit boxes.
One thing to note behaviour wise is that if you have 1 message edit
box open and you shift the focus to compose box, and then close the
compose box, `Alt + P` will not work until the focus is brought back again to
the message edit box.
We want to able to use the clear_preview_area in other places than
click_handlers and that's why it has been moved to message_edit.js.
The name was chosen to be consistent with a similar function in
compose.js.
We want to use render_and_show_preview in message_edit, but that will
cause a dependency cycle because of message_events. In order to avoid
the dependency cycle, the function has been moved to compose_ui and
relevant types have been added.
This commit does not audit the existing function for improvements, just
moves it around and adds types.
The `msg` and `result` are same as the other files (e.g.
activity.test.js) with success responses.
This adds the `LONG_HOVER_DELAY` delay to the user card tooltips, which
prevent the tooltips from becoming distracting when the user is just
navigating the popover.
When the user card is opened via the keyboard shortcut `U`, the initial
focus should be on the first popover menu option, rather than the copy
buttons or the custom profile field links which can be distracting due
to the presence of tooltips on them.
Fixes part of #31027.