Before 2017, Zulip's manage streams and settings UIs were tab in the
same pane position as our current message feed and recent topics.
That original implementation was implemented using Bootstrap tabs;
while it hasn't been in use for years, we had a bunch of stale code
related to it leftover in this module.
Previous algorithm was not correct if we didn't have full data for
the current narrow loaded from the server. #23512 adds the support
to mark messages in a narrow unread after a give message_id.
Added a new alert banner to indicate loading and success states of
an ongoing request. This is useful when requests can take a long
time to complete.
Dedicated overlay for user group settings is added as part of
addressing zulip#19526.
The newely added overlay is currently empty and more UI
related to settings is to be added in further commits.
Fixes#22182
This message often flashes on screen briefly, causing unnecessary
worry for the user (is the app likely to not load?).
To address this, we add a delay before the message is shown.
As a consequence, we change the notice to no longer suggest waiting a
few seconds, since we did that before showing it.
e6e6010, 41ddf29 and other commits migrating components to Micromodal
have removed references to these divs. Did a global search and
removed these divs.
Notifies user when messages are not being marked as read through a
banner that lets them mark all messages in the narrow as read. Note
that the banner is only displayed if the user's actions, like
scrolling, would've actually marked the messages as read.
This avoids distracting the user when viewing a thread they've already
read.
tabbott has verified that if new messages come in, the banner will reappear.
Fixes: #18768.
There was a bug where information overlay was not closing on clicking
"x" when some text was selected. This was due to document.getSelection().type
returning "Range" and we do not close the modal in that case as per the code
added in 081d74141b.
As the "x" icon was button, the document.getSelection().type was
still returning "Range" for the text selected, but when the "x"
icon is inside a span, as in settings overlay, clicking on "x"
deselects the already selected text and selection type is not
"Range" and thus modal is closed.
This commit also improves the vertical alignment of "x".
Fixes#20645.
The old name was confusing, since the contents
of the div aren't just a table, and we have
smaller elements that actually do list a bunch
of subscriptions in tabular format.
I remove some spurious whitespace and a stray period
in zephyr-mirror, and then for all three I try to
line-wrap/indent in a way that's nicer for humans
and parsers to read.
I rewrote most of tools/lib/pretty-printer.py, which
was fairly easy due to being able to crib some
important details from the previous implementation.
The main motivation for the rewrite was that we weren't
handling else/elif blocks correctly, and it was difficult
to modify the previous code. The else/elif shortcomings
were somewhat historical in nature--the original parser
didn't recognize them (since they weren't in any Zulip
templates at the time), and then the pretty printer was
mostly able to hack around that due to the "nudge"
strategy. Eventually the nudge strategy became too
brittle.
The "nudge" strategy was that we would mostly trust
the existing templates, and we would just nudge over
some lines in cases of obviously faulty indentation.
Now we are bit more opinionated and rigorous, and
we basically set the indentation explicitly for any
line that is not in a code/script block. This leads
to this diff touching several templates for mostly
minor fix-ups.
We aren't completely opinionated, as we respect the
author's line wrapping decisions in many cases, and
we also allow authors not to indent blocks within
the template language's block constructs.
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.
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 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.
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.
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 results in moving the `zulip_merge_base` parameter to
page_params, so that it's available to JavaScript.
Since this is technically a tiny overlay, it needs to be initialized
before hashchange.js.
It's sufficiently tiny that the shared code benefits don't justify the
cost, given that we plan to move index.html to a different templating
system soon.
This should make it more intuitive to add
new elements to the compose box (such as
banners), and it also makes it a bit more
clear for styling purposes that the same
geometry happens whether the compose box
is open or the buttons are visible.
I lifted the #compose_container div into
the server template. It's not totally
clear to me why we need both #compose
and #compose_container, but there are
some scary comments about 1400px that
made me too timid to address that quirk.
In passing I removed a clearly redundant
click handler.
This moves this block of HTML templates, which are dynamically
rendered with some user data, to be managed by the frontend handlebars
template system.
This migration involves only displaying active alerts in the DOM, and
thus we no longer need navbar_alerts to have display: none by default.
We move compose from being a part of message feed to
being a part of middle column which is a common parent of recent
topics and message feed. This allows us to use a common compose
box for both the views. Fortunately, compose actions were
independent of this change so there weren't any evident
side effects.
Fixes#17543
Currently only enabled in development, since the exact details don't
seem right..
Co-Author-By: Signior-X <b19188@students.iitmandi.ac.in>
Co-Author-By: Aman Agrawal <amanagr@zulip.com>
Implements UI for #8005.
Since the "mute users" feature isn't complete yet,
this UI is shown only in development setups.
Ideally we should have had this commit after the whole
feature was completed and merged, but doing so makes it
difficult to test and merge subparts of the feature one by
one (which is a better workflow, while we still decide what
exactly we want this feature to do).
This commit adds a new button in the user info popover
to mute or unmute the user, and uses a confirmation
dialog while muting, because muting a user accidently can lead
to the muter losing out on a lot of information.
TODOs when making this UI visible in production-
1. Make a /help page and link to it from the confirmation
dialog and the API docs.
This reverses the policy that was set, but incompletely enforced, by
commit 951514dd7d. The self-closing tag
syntax is clearer, more consistent, simpler to parse, compatible with
XML, preferred by Prettier, and (most importantly now) required by
FormatJS.
Signed-off-by: Anders Kaseorg <anders@zulip.com>
Follow up to #14768. This feature was already non-functional due to
.alert-display { display: none; }, and if we want to reimplement it,
we should do it using a modern library.
Signed-off-by: Anders Kaseorg <anders@zulip.com>
Go to Recent Topics on "#", no hash and "#recent_topics".
Go to Recent Topics as the last destination for escape key.
Map `a` key to All messages and change its hash to
`#all_messages`.
Recent Topics is no longer an overlay now, but note that it is
also not a typical messages narrow. It can reside between
an overlay and a Filter in the sense that it is dispalyed as
a typical Filter narrow but has properties of an Overlay.
Compose box is not visible in this view as it will be confusing
to many users and hence compose shortcuts have also been disabled.
Keyboard shortcuts that apply on messages have also been disabled.
The remaining shortcuts that apply to a narrow are still accessible
here.
Prior to commit eb4a2b9d4e the center
area of the navbar was based on a structure that appended crumbs or
"tabs" as <li>s, forming a tab_bar and a tab_list.
However, in eb4a2b9d4e we apply a new
style and structure to the navbar which lets go of the convention of
tabs. Hence, we'd like to purge the tab_bar and tab_list labels from
our code base.
We purged tab_list in 1267caf5009118875f47fdafe312880af08024e1.
This commit purges tab_bar, it includes:
- A blanket search and replace of tab_bar with message_view_header.
- Splitting a single line comment in
tab_bar.js / message_view_header.js.
- The renaming of tab_bar.js to message_view_header.js.
- The renaming of tab_bar.hbs to message_view_header.hbs.
- A blanket search and replace of tab_data with
message_view_header_data.
- Replacing the single occurrence of tabbar with message_view_header
(it was within a comment.)
We fixed the main issue of this form in CVE-2020-9444, but the audit
done at that time only included links found in rendered_markdown; this
change completes our audit for links with target=_blank anywhere in
the codebase.
* Show an empty overlay of recent topics.
* Register click event to open recent topics.
* Launch recent topics on "t" keypress.
This is based on the draft overlay.
This completes the implementation of support for moving a topic to
another stream by adding a basic UI for it.
Fixes#6427, which was previously the most-upvoted issue request in
Zulip.
There are likely to be a bunch of follow-up UI improvements on top of
this change to fully flesh out the feature.
Switched to top-of-page prompt to make it natural to fit in with other
notifications. As we switch to panel-based prompt, templates for the
bankruptcy modal are moved along with its usage in application's
homepage.
We include a bit of delay before reloading to make it easy for the
user to read the "Marking all messages as read" banner before it is
covered by the "Reloading..." notice in environments where the reload
is fast.
Fixes#3347.
This is a prep-commit for the new navbar style, seperating
navbar_alerts.html from navbar.html in order to make the structure and
styles of navbar.html easier to tweak.
These templates have very little to do with each other to begin with
appart from the fact that they are both rendered at the top of the app.
This gives them cache-compatible URLs, and also avoids some extra
copies of the sprite sheet images.
Comments on the Octopus emoji added by tabbott.
Signed-off-by: Anders Kaseorg <anders@zulipchat.com>
This sidesteps tricky escaping issues, and will make it easier to
build a strict Content-Security-Policy.
Signed-off-by: Anders Kaseorg <anders@zulipchat.com>
Commit db45d220a8 (#3996) disabled
mobile zooming on all pages, with the reasoning that focusing an input
may automatically zoom the page and break content. I’m not sure
whether that was a good reason, but at most it only applies to the app
page. Reenable zooming on all other pages like the portico and
documentation to improve their accessibility.
(Note: the other common reason to disable zooming, which was that
mobile browsers once added a 300ms tap delay to recognize double-tap
zoom gestures, has been obsolete since 2014:
https://developers.google.com/web/updates/2013/12/300ms-tap-delay-gone-away)
Signed-off-by: Anders Kaseorg <anders@zulipchat.com>
This adds the same "x" button as we have in "stream search" or "people
search" to the user status modal.
The button is shown if someone types something, or if the status
message was already set (meaning there was already a value in the
input field). If the input field is empty, the button is not visible.
This fixes the follow-up comments from #12179.
- Changed the <p>s to <button>s and modified the css accordingly.
- Changed the css to use scss nesting.
- Changed the line-height from 1.0em to 1.1em, because on Safari the "g" was not fully displayed.
In this commit, I've added a feature to unstar all the starred
messages. This is useful, e.g., for folks who are using starred
messages to keep track of things they should come back when next at
their desktop.
The event flow is the standard one for a feature with a confirmation modal:
(1) User clicks on unstar all messages.
(2) We display a confirmation modal; if the user confirms, we send a
request to the backend to clear all starred messages.
(3) The events system sends that UI update back to us, removing the
stars from the UI.
Fixes#11401.
This is primarily a feature for onboarding, where an organization
administrator might send a bunch of random test messages as part of
joining, but then want a pristine organization when their users later
join.
But it can theoretically be used for other use cases (e.g. for
moderation or removing threads that are problematic in some way).
Tweaked by tabbott to handle corner cases with
is_history_public_to_subscribers.
Fixes#10912.
<script charset=…>, <script type=…>, and <style type=…> are “obsolete
but conforming” in HTML5. They make the validator.nu output noisier
and real problems a little harder to find.
(type was required in HTML 4, which is not relevant to us.)
Signed-off-by: Anders Kaseorg <andersk@mit.edu>
This commit moves all files previously under the 'app' bundle in
the Django pipeline to being compiled by webpack under the 'app'
entry point. In the process, it moves assets under the app entry
to a file called app.js that consumes all relevant css and js files.
This commit also edits the webpack config to be able to expose certain
variables for third party libraries that are currently required by
some modules. This is bad coding form and should be refactored to
requiring whatever dependencies a module may have; we're just
deferring that to the future to simplify the series of transitions we
need to do here. The variable exposure is done using expose-loader in
webpack.
The app/index.html template is edited to override the newly introduced
'commonjs' block in the base template. This is done as a temporary
measure so as not to disrupt other pages on the app during the transition.
It also fixes the value of the 'this' context that was being inferred
as window by third party libraries. This is done using imports-loader
in the webpack config. This is also messy and probably isn't how we
want things to work long term.
This commit transitions all styles in app.css in the Django pipeline
to being compiled by webpack in an app-styles bundle, and renames the
various files to now be processed as SCSS.
To implement this transition, we move the old CSS file refernces in
settings.py and replace them with a bundle declared in
`webpack.assets.json` and includedn in the index.html template
Tweaked by tabbott to keep the list of files in `app.css` in
`webpack.assets.json`, and to preserve the ordering from the old
`settings.py`.
We haven't seen significant traffic from the legacy desktop app in
over a year, and users using it get a warning to upgrade since last
summer, so it's probably OK to stop providing special fonts for it.
We use the attrs property provided by render_bundle function of
django-webpack-loader to add `nonce="<csp_nonce_val_here>" to
js scripts being rendered by webpack.
This should make it easier to find the templates that are actually
part of the core webapp, instead of having them all mixed together
with the portico pages.
brijsiyag
Anders Kaseorg
Tim Abbott
Aman Agrawal
Purushottam Tiwari
Dinesh
Sahil Batra
Steve Howell
Manan Rathi
sahil839
aryanshridhar
nooblag
Ganesh Pawar
Riken Shah
Vishnu KS
pilgrim2308
Abhijeet Prasad Bodas
YashRE42
Aman Agrawal
Tim Abbott
majordwarf
YashRE42
Anders Kaseorg
Alexandra Ciobica
Abhinav Singh
ruchit2801
kunal-mohta
Steve Howell
Cynthia Lin
Harshit Bansal
Anders Kaseorg
Aditya Bansal
Armaan Ahluwalia
Shubham Dhama