This commit acts as a follow-up commit to the previous three commits
implementing the redesigned filter input in the left sidebar. This
makes some structural changes to the channel/topic/dm headers, and
aligns to filter inputs to the predefined grid lines in the left sidebar
to ensure good visual flow.
Fixes#34476.
This follow-up commit replaces the current left sidebar channel list
filter input implementation with the redesigned input component.
Note: This commit removes `clear_search` method from `stream_list.ts`,
since the `.input-button` onclick handler over at `inputs.ts` handles
the clearing of the filter input fields by sending an empty text input
event. This input event triggers the filter update handler of the
module, in this case the `update_streams_for_search` function and
resets the filter list, eliminating the need for a separate per-module
input clearing/resetting workflow.
Fixes part of #34476.
This commit adds code to use
`web_left_sidebar_unreads_count_summary` from personal
settings in web app.
Co-authored-by: Akarsh Jain <akarsh.jain.790@gmail.com>
Fixes part of #28759.
This commit updates the styling of "Log in to browse
more channels" link in the left sidebar for logged out
users to match "BROWSE N MORE CHANNELS" link. If a string
exceeds the width of container then it would be wrapped
to the next line.
Fixes: #33108
On smaller screens, where left_sidebar is hidden by default,
clicking the `New topic` and `New direct message` buttons did not
close the left_sidebar because these buttons are located within
the left_sidebar.
Clicking these buttons made the cursor to focus over the compose
but the compose remained half hidden by the left_sidebar.
This commit enables the left_sidebar to automatically hide
when these buttons are clicked by introducing the
auto-hide-left-sidebar-overlay class on these buttons.
Earlier, tooltip in left sidebar views had only the navigation list
title shown inside it.
This commit adds more information to the tooltip by including their
respective counts.
Fixes: zulip#25901.
Co-authored-by: ecxtacy <dc.dhruvchouhan@gmail.com>
Earlier, left sidebar navigation had two separate tooltip logic to
handle the same tooltip template.
This commit refactors it to use a single tooltip logic for the left
sidebar navigation.
This temporary change allows us to preserve these old styles
while iteratively move all the close buttons to new styles.
Once the migration is complete, `old_clear_search_button` won't
exist anymore and there will be new styles for `clear_search_button`.
This commit is a part of the efforts to rename btn-related classes
and variables to align with Zulip's no-abbreviations policy and
streamline the search results.
Fixes#31823
When home view changes, CSS just puts the selected home view
at the top of the left_sidebar navigation list (expanded)
or to the left (collapsed), but the rendered <li> elements
stay in the same order in DOM, so regarldess of current home view,
keyboard navigation always follows the order in which the <li>
elements appear in DOM.
Changes:
- Reorder <li> navigation elements in DOM based on current home view.
- Remove tabindex=0 from <a> elements, because they are now ordered
correctly in DOM.
- Add (tabindex="0" role="button") to the <i> collapsable VIEWS, to be
keyboard accessibile.
This commit adds '*' as a keyboard shortcut to navigate to the starred messages view and the shortcut is documented in various required locations accordingly.
Fixes#31397.
Fixes#22113.
The search will only be visible when in the `more conversations`
view. Once we click `back to channels` and close the
`more conversations` view, the search will clear and the search
box will disappear.
We've chosen `pm_list_data.get_conversations` as the function
to which we will pass our search term. We could have technically
found the value of the filter element via JQuery in pm_list_data,
but pm_list_data does not handle any JQuery and we should keep
it that way.
`pm_list_data.get_list_info` also accepts the search_string so that
the info it returns in expanded view is accurate.
We've also added some code to `click_handlers` to make sure that
clicking the search input does not bring us into the DM narrow.
We clean up unnecessary nesting in this commit and replace one
usage of `#direct-messages-sticky-header` with
`#direct-messages-section-header`. Since `.direct-messages-container`
was being used along with `#direct-messages-sticky-header` at multiple
places, just removing the nesting would break those selectors. For those
selectors, they have been refactored to just look for
`#direct-messages-section-header` instead. `.direct-messages-container`
specific selectors still exist but they apply to both instances of
`.direct-messages-container`, the DM header and the DM list.
While the TODO comment we deleted in left_sidebar.css says we need to
rewrite both show more and show less button to grids; show more was
already a grid.
There have been some very slight changes in the actual size of the back
to channels row; those changes make the row more consistent with the
rest of the left sidebar rows in terms of sizing.
We've introduced a new class called `.hide-more-direct-messages-text`
that applies the same properties as the `span` selector used to. We are
using a class because of better performance when selecting, see
https://chat.zulip.org/#narrow/stream/6-frontend/topic/CSS.20selector.20performance/near/1845719
for more info on the why,
The `font-size` was moved inside the above class, so that when setting
the line-height of the anchor component, the `em` refers to the normal
font size and not the smaller font size for `back to channels`.
We've moved the link inside `.direct-messages-section-header` and most
of the grid properties are inherited from that element.
This is a preparatory commit to introduce DM filter in #30332.
The elements which received focus didn't have tooltips attached to
them, thus when blur was triggered on `a`, the tooltip didn't hide
as it was not listening on it for the blur event.
We move the toolip to `a` elements so that when focus and blur
are triggered tippy is able to capture them.
Fixes#30403.
Having tabIndex set to 0 led to keyboard focus being put on
a scrollbar container, which led to users having to tab twice
to skip a container.
This commit also removes instances of tabIndex being set to
-1 programatically for certain cases, since it is -1 by default now.
This commit also removes `outline: none` for simplebar since
that property is not needed anymore because the wrapper is
not focusable anymore.
Rename `show_all_private_messages` to `show-all-direct-messages`.
We've also hyphenated the attribute during the rename.
Part of the private_message to direct_message rename project.
Rename `toggle_private_messages_section_icon` to
`toggle-direct-messages-section-icon`.
We've also hyphenated the attribute during the rename.
Part of the private_message to direct_message rename project.
Rename `private_messages_section_header` to
`direct-messages-section-header`.
We've also hyphenated the attribute during the rename.
Part of the private_message to direct_message rename project.
