Commit Graph

166 Commits

Author SHA1 Message Date
Sayam Samal 44fa30e481 css: Add `.help_link_widget` class to consolidate help widget styling. 2023-12-04 16:38:19 -08:00
Sayam Samal c7e2306380 notification_settings: Add banner when push notification not configured. 2023-12-04 16:38:19 -08:00
Sahil Batra 189718dc64 settings: Add support to change user-access setting in development.
This commit updates the backend code to allow changing
can_access_all_users_group setting in development environment
and also adds a dropdown in webapp UI which is only shown in
development environment.
2023-11-23 10:40:42 -08:00
Anders Kaseorg 9b83dc1b79 stylelint: Fix declaration-block-no-redundant-longhand-properties.
Signed-off-by: Anders Kaseorg <anders@zulip.com>
2023-11-08 16:11:15 -08:00
ecxtacy f2deb8da46 settings-ui: Change `<select>` style using custom chevron-down icon.
Align the `dropdown-widget` and `<select>` UIs.
Removed default `<select>` tag styles with `appearance: none` css.
Added custom chevron-down icon with `background-image` attribute
to the `<select>` tag.

The svg icon is used in a CSS variable with a data URI.
The CSS variable is used to set different colors for dark and light
theme.

Tweaked by tabbott to scope selectors appropriately and also delete a
10px font-size in one settings dropdown widget.

Fixes #26859.
2023-11-07 16:55:34 -08:00
Aman Agrawal bc3d48616e gear_menu: Migrate to use tippy. 2023-10-20 12:36:39 -07:00
Hemant Umre eeec8f06e9 templates: Stop using `::after` to render empty list message.
This commit removes all instances of the `required-text` class,
which utilizes the `::after` pseudo-element to render empty list
message. To avoid inserting non-decorative content using a pseudo-
element, we will now use `list_widget.render_empty_list_message_
if_needed` introduced a few commits back to display the empty list
message.

Fixes #23072.
2023-10-11 18:03:53 -07:00
Ujjawal Modi 0e5bb92111 settings: Improve UI for displaying reactivated and deactivated users.
Earlier when a user is deactivated or reactivated from users
table and deactivated_users table the `Role` column was modified.

This commit changes this and now `Role` column is not modified
instead now the corresponding row is greyed out.

Fixes #21653.
2023-10-03 11:15:39 -07:00
Eeshan Garg f3465dea08 demo-orgs: Add UI for converting to permanent organization.
Adds warning banner to the organization settings overlay/tabs
for demo organizations. For owners, clicking on the link in the
banner opens a modal to convert the demo organization into a
permanent organization.

For admins that are not owners, clicking on the link will go
to the help center article on demo organizations.

Non-admin users will not see the warning banner.

The modal for converting a demo organization requires the owner
to have set their email address. Once the owner's email address
is set, then the organization can be made permanent by changing
the subdomain of the organization. The deletion date for the
demo organization will be removed as part of updating the
subdomain.

The organization owner must also have updated the organization
type to be any value other than unsepecified to convert the
demo organization to a permanent organization. The modal's
submit button will be disabled if that is the value for the
organization type in the form. The demo organizations created
in the dev environment now have their organization type set to
unspecified on creation.

This is a part of #19523.

Co-authored by: Lauryn Menard <lauryn@zulip.com>
2023-10-03 09:11:41 -07:00
Satyam Bansal 51e2030f7b integration-url: Migrate integration typeahead to dropdown widget.
Fixes part of #26797.
2023-10-02 12:29:42 -07:00
palashb01 2ca1c0c63e settings: Decrease the gap between the account heading and banner.
This commit fixes the alignment of account-alert-notification-banner
by using a new classname 'account-alert-notification' for this specific
banner, removed the default margin-top and margin-left from this banner
which is set to all other banners, and Aligned the banner with
vertical-align property set to middle.

To left-align this specific banner when the email is long enough
to wrap to the next line removed the margin-left and used a new
classname 'account-settings-heading' for the accounts heading,
and gave a margin-right of 10px to ensure that the notice banner and
the heading have enough space between them, when the email is short.

If the email is long enough to wrap to multiple lines, then the gap
between the email input field and the banner is too low. To adjust
this, set the margin-bottom to 10px.
2023-10-01 17:54:22 -07:00
palashb01 89970eabeb settings: Wrap the content in the alert notification banner.
This commit fixes the issue where, if the content inside the alert
notification banner is long enough, it will wrap inside the alert
banner.

To prevent the email from spilling over in the notice,added the
'overflow-wrap' property set to 'anywhere'.

Fixes: #23653
2023-10-01 17:54:22 -07:00
Hardik Dharmani 7721100378 bot_settings: Use same copy icon across the app.
The bot settings avatar row was using `fa-clipboard` icon. Changed
the icon to use `{{> copy_to_clipboard_svg }}` SVG icon that is used
everywhere else in the app as copy icon.
2023-09-28 15:15:57 -07:00
Hemant Umre f731602024 org_settings: Add frontend support for `realm_jitsi_server_url`.
This commit adds a dropdown and custom input element to set the
`realm_jitsi_server_url` when the video call provider is Jitsi. This
allows organization administrators to add a custom Jitsi server as the
organization's video call provider.

Fixes #17914.

Co-authored-by: Gaurav Pandey <gauravguitarrocks@gmail.com>
2023-09-21 17:39:10 -07:00
Karl Stolley be4d4085f2 emoji: Display status emoji as flexbox in settings.
This does not adjust any of the padding from a float-based era.
It's entirely possible that the status-preview area especially
deserves some further tuning.
2023-09-21 17:18:47 -07:00
Karl Stolley 55e43b6926 settings: Display radio choice label as flexbox. 2023-09-21 17:18:47 -07:00
Zixuan James Li d3e4456562 linkifiers: Use only the handle for dragging.
So that the user can still select and copy text from the body of the
linkifier rows. It might be helpful if we extend this behavior to other
draggable rows, like those for custom profile fields settings.

Fixes #26798
2023-09-21 15:27:16 -07:00
Satyam Bansal 9cde3abd4d bot-settings: Add modal to generate Integration URL.
Fixes part of #25976.
2023-09-20 17:49:51 -07:00
palashb01 e1322faae0 user_profile: Fix the gap between labels and input.
This commit increases the gap between the labels and input/select
of the user profile manage user/bot tab for clearer visibility.
It also reduces the gap between the 'deactivate user' button and
the last input to make it look better.
2023-09-11 10:39:00 -07:00
Ujjawal Modi 9a96d19315 invites: Frontend changes for adding the new realm setting.
This commit does the changes in frontend required
for adding the new setting `Who can create multiuse invite link.`

Fixes #15159.
2023-09-07 14:21:01 -07:00
Lauryn Menard 19b8217e49 demo-orgs: Disable changing user's email visibility until email set.
Because demo organization owners do not initially have an email
set, some of the personal and organization settings in the web-app
UI should be disabled/hidden until the owner configures an email
address for their account.

Disables the dropdown for changing the user's email address visibility
in the account & security tab of the personal settings overlay until
the user configures an email address.
2023-08-31 15:02:16 -07:00
Lauryn Menard 665deac7c0 demo-orgs: Disable show/change API key if email not configured.
Because demo organization owners do not initially have an email
set, some of the personal and organization settings in the web-app
UI should be disabled/hidden until the owner configures an email
address for their account.

Disables the show/change API key button in the account & security
tab of the personal settings overlay if the user's email address
is not configured. A tooltip is shown when hovering over the disabled
button explaining why the feature is disabled.
2023-08-31 15:02:16 -07:00
Karl Stolley 2e07c03968 settings: Align notification play button in a flex layout.
This allows the select to flex, keeping the buttons position on
screen even at mobile-scale viewports.

While other most other controls are currently not so responsive,
this might provide some direction (along with a TODO) on how to
go about moving controls in that direction.

Fixes: #26563
2023-08-31 12:06:32 -07:00
Sahil Batra 75126c96a4 settings: Make custom profile fields table similar to other tables.
This commit updates the admin custom profile fields table to be
similar to other tables in settings page. After this change,
the table will be horizontally scrollable for narrow screens
and the buttons in actions column will not wrap to multiple lines.

This increases the width of "Actions" column and it takes some
unnecessary space, but this will be handled in the next commit
which will adjust "Actions" column in all the tables.
2023-08-21 15:00:39 -07:00
Sahil Batra 154f4f16b5 css: Remove unnecessary CSS defined using table-condensed class.
This commit removes unnecessary CSS defined for tables using
table-condensed class.

The vertical-align property for "td" elements is not needed
since by default the vertical-align property for "td" elements
is inherited and is set to "middle".

The margin properties set for the tables in informational
overlay is also not needed since we have set the width
to 100% and setting the margin to auto does not result in
anything different.
2023-08-21 15:00:39 -07:00
Zixuan James Li 5301060954 linkifiers: Support dragging and reordering linkifiers.
This also removes sorting on the pattern and the URL template, because
it does not make sense anymore as we make linkifiers draggable.

Fixes #23716
2023-08-14 15:21:48 -07:00
Zixuan James Li 31b7003d61 settings: Rename movable-profile-field-row.
So that we can reuse it for other movable rows in places like
.admin_linkifiers_table.
2023-08-14 15:21:48 -07:00
Lauryn Menard 225be0bb97 dropdown-list-widget: Remove dropdown-list-body class and reference.
Removes the "dropdown-list-body" class and references as it is no
longer used in the new DropdownWidget. The previous uses of the
class were removed in commit 875d564f2d.
2023-08-11 12:26:47 -07:00
Sahil Batra db3b9e4742 settings: Make custom profile fields table consistent with others.
We change the custom profile fields table to have same header as
of other table and as a result this also makes the page look
better if an organization has zero custom profile fields.
2023-08-06 18:13:33 -07:00
Aman Agrawal 6efcb7a349 dropdown_widget: Refactor to use Class. 2023-07-27 14:10:08 -07:00
Zixuan James Li 000761ac0c realm_playgrounds: Replace url_prefix with url_template.
Dropping support for url_prefix for RealmPlayground, the server now uses
url_template instead only for playground creation, retrieval and audit
logging upon removal.

This does the necessary handling so that url_template is expanded with
the extracted code.

Fixes #25723.

Signed-off-by: Zixuan James Li <p359101898@gmail.com>
2023-07-24 17:40:59 -07:00
Anders Kaseorg 1b72d5c413 styles: Remove Firefox override for dropdown appearance.
The default appearance in modern Firefox is totally fine, and our
override was incorrectly changing the dropdown triangle to black for
the dark theme.

Signed-off-by: Anders Kaseorg <anders@zulip.com>
2023-07-24 13:10:03 -07:00
Anders Kaseorg 7746e11486 dependencies: Upgrade JavaScript dependencies.
Signed-off-by: Anders Kaseorg <anders@zulip.com>
2023-07-21 15:58:42 -07:00
Sahil Batra f5208a7db6 settings: Re-add bootstrap CSS to custom time limit inputs.
This commit re-adds bootstrap CSS for custom time limit inputs
used by various settings by using more specific selector in
settings.css.

This is a prep commit for removing bootstrap CSS for text type
inputs.
2023-07-07 10:10:28 -07:00
Sahil Batra 96014c1123 settings: Re-add bootstrap CSS rules to ".settings_text_input" selector.
This commit re-adds bootstrap CSS rules to ".settings_text_input"
selector in settings.css and this helps in adding the bootstrap
CSS to text inputs used in settings.

This is a prep commit to remove bootstrap CSS for text type inputs.
2023-07-07 10:10:28 -07:00
Sahil Batra 8c3421c7f4 settings: Remove unnecessary CSS.
There is no text type input element inside
"#service_name_list" element.
2023-07-07 10:10:28 -07:00
Aman Agrawal 503f4b9bfd css: Use 200 font weight for dropdown chevron-down icon.
`font-weight: lighter` converts here to `100` which converts 200
since that is what we support.
2023-07-06 17:57:37 -07:00
Aman Agrawal 1557c4d112 css: Use 400 font weight instead of 500.
500 font weight defaults to 400 which is what we support.
2023-07-06 17:57:37 -07:00
Ganesh Pawar fff9b334ff default_streams: Convert inline form to modal.
Fixes #20838.
2023-07-06 16:24:44 -07:00
Sahil Batra db825ad202 settings: Remove settings_text_input class from url type inputs.
This commit removes settings_text_input class from url type inputs
and we instead add the width property to settings_url_input.

Note that we might instead have a single class for all type of inputs
instead of having different classes for url, password and text type
inputs in further commits.
2023-06-23 11:53:38 -07:00
Sahil Batra a860e717bb bootstrap: Remove bootstrap CSS for url type inputs.
We use url type inputs in the add and edit custom field modals
and also to show the url type custom fields in "Profile" panel
and "Manage user" modal.

This commit re-adds the bootstrap CSS rules to these specific
input elements using modal_url_input and settings_url_input
class and thus removes the CSS for url type inputs from
bootstrap.css.

We might replace the new class added here with a common class
for all type of inputs in further commits.
2023-06-23 11:53:38 -07:00
Tim Abbott ac3acc941f css: Increase opacity for grey elements.
The message timestamp and a few settings elements looked off with the
new 25% off white dark theme font color.
2023-05-16 16:52:22 -07:00
Lakshay Mittal a208da9c4d style: Fix dropdown text alignment by reducing vertical padding.
Zulip's select widgets have a 30px height; this comes from Bootstrap
but is also generally nice for visual consistency.

In modals, we use a 15px font-size, instead of the 14px used in the
rest of the app, and in that context, the 4px vertical padding plus
30px fixed height resulted in the text not being vertically aligned.

Fix this by removing that vertical padding; all of our select elements
with these classes appear to position the text in the center of the
dropdown through other CSS mechanisms.
2023-05-16 15:43:06 -07:00
Sahil Batra e4420bcd61 dropdown_list_widget: Show stream icons when widget is disabled.
We show the stream privacy icon for the selected option in
dropdown list widget even if the widget is disabled. It is
fixed by changing the CSS to hide only the "i" element used
for the arrow toggle button and not all the "i" elements in
disabled state.
2023-04-26 15:44:35 -07:00
Prakhar Pratyush c526543498 settings: Update the 'Muted topics' setting.
This commit updates the existing 'Muted topics'
settings UI to add support for other visibility
policies.

Changes:
Settings sidebar:
1. Rename 'Muted topics' to 'Topics'.
2. Change icon.
Main panel:
3. Rename 'Muted topics' header to 'Topic settings'.
Topics table:
4. Rename 'Date muted' to 'Date updated'.
5. Update the search bar placeholder text to 'Filter topics'.
6. Drop the 'Actions' column.
7. Add a status column with a dropdown set of options.
(Muted, Unmuted, Default for stream)

Fixes #25081.
2023-04-25 12:46:05 -07:00
Prakhar Pratyush b366c37452 user_topics: Rename and refactor 'muted_topic_ui_row.hbs'.
This prep commit renames 'muted_topic_ui_row.hbs'
to 'user_topic_ui_row.hbs'.

This includes minor refactoring, as it is now the
template for rows with any visibility_policy,
not just MUTED.
2023-04-19 16:58:40 -07:00
Sahil Batra 3853a8bf20 dropdown_list_widget: Do not underline the option text on focus.
We remove the underline on the text in the options on focus as
we already have a outline which is enough to show that the option
is focussed.
2023-04-19 16:54:13 -07:00
Zixuan James Li 05a3456581 settings: Use url_template for internal names.
This replaces any "url_format_string" or "url_format" with
"url_template" for the linkifier settings, including HTML ids, template
variables, and etc.

This is not affected by any external API changes.

Signed-off-by: Zixuan James Li <p359101898@gmail.com>
2023-04-19 12:20:49 -07:00
sayamsamal 9f6f77f6bc icons: Change bot icon from GitHub logo to Google material icon.
We currently use the GitHub logo to show the bots settings in both
personal and organization settings. This icon is not a correct
representation since we use have support for several different bots
including but not limited to a GitHub integration bot.

This commit replaces the GitHub logo with Smart Toy material icon
from Google, while also adding the required licencing details at
docs/THIRDPARTY.

Part of #19797.
2023-04-13 10:47:09 -07:00
Sahil Batra c37bd3cbd9 settings: Increase width of textarea field in profile settings.
This increases width of textarea field in profile settings to
match it with other inputs.
2023-04-03 16:59:51 -07:00
Sahil Batra 9612125481 settings: Increase width of person picker in profile settings.
This commit increases width of person picker element in profile
settings to match the width of other inputs.
2023-04-03 16:59:51 -07:00
Sahil Batra 16f8a83c32 settings: Increase width of text inputs.
This commit increases width of text inputs in settings, stream
settings and user group settings to be 325px, which is the
minimum width of select elements on these pages.
2023-04-03 16:59:51 -07:00
Sahil Batra e1877ce57e settings: Add settings_text_input class to text inputs.
This commit adds settings_text_input class to text inputs in
settings, stream settings and user group settings pages. This
class is used to set the width of inputs to 206px, as we will
be removing the boostrap rule which sets width of the input
in further commits.
2023-03-27 22:34:30 -07:00
Sahil Batra dcce524376 settings: Increase width of url field in edit custom field form.
This commit increases the width of url field, displayed for
custom external account type fields, in edit profile field
form. The width of the input is increased as urls are generally
long enough and did not fit in the width set previously in most
cases. We increase the width to match the width in add custom
profile field form.
2023-03-27 22:34:30 -07:00
Sahil Singh 89733670fd image_upload_widget: Refactor style of upload_widget's preview_image.
Forms using upload widget were using the
same css for image preview.

We fix this by assigning a class to the
widget and applying specific styles to it.
2023-03-27 10:19:29 -07:00
Palash Baderia cefc191dd6 settings: Fix responsiveness in change email,password dialogs.
Added a width for the Change Email and Password dialogs at
sm_min (576px) and ml_min (425px) to make them more responsive
on narrow screens.

Fixes: #24339.
2023-03-27 10:11:22 -07:00
Anders Kaseorg d274583d8f styles: Use modern color notation.
postcss-preset-env transpiles this back as necessary.  (It does a
better job than we did, in fact: we had several four-argument hsl()
calls that should have been hsla().)

Signed-off-by: Anders Kaseorg <anders@zulip.com>
2023-03-24 17:26:55 -07:00
Anders Kaseorg 5cdf38b1f7 styles: Use standard CSS nesting syntax.
CSS nesting is being standardized with the syntactic restriction that
the nested selector cannot start with an identifier.  This was
necessary to allow the syntax to be parsed without lookahead.

https://webkit.org/blog/13813/try-css-nesting-today-in-safari-technology-preview/
https://www.w3.org/TR/css-nesting-1/#syntax

The postcss-nesting plugin used by postcss-preset-env enforces this
restriction.

Signed-off-by: Anders Kaseorg <anders@zulip.com>
2023-03-20 11:26:30 -07:00
Sahil Singh 37a0c9c1b9 settings: Fix alignment of loading message.
The loading message that appears at the
top of the page when loading the Bots/
Uploaded Files/Users/Deactivated Users
page under Settings appears to be misaligned.

We fix this by changing the height of the
loading-spinner to match the line-height
of loading text.
2023-03-14 13:23:48 -07:00
Sahil Batra bd9d1b9158 dropdown_list_widget: Set dropdown menu wide enough to fit options.
We now set the width of dropdown menu opened for dropdown-list-widget
elements such that it is enough for all the options. For smaller
screens the dropdown menus are wide since the settings panel and
modal content can be scrolled horizontally.
This change is done only for dropdown-list-widget elements in
"Organization settings" panel and in bot-owner widget in bot edit
modal.

We don't do this change for move topic modal now as it cannot be
scrolled horizontally and appears beneath the button due to position
property.
2023-03-14 12:53:41 -07:00
Sahil Batra 7d9fe8fd23 settings: Set width of dropdown toggle same as select elements.
This commit sets width of toggle buttons for dropdown list
widget elements same as select elements in both organization
settings. We set the min-width to be 325px and max-width to
100%.
2023-03-14 12:53:41 -07:00
Sahil Batra 0beac2f221 settings: Make settings page horizontally scrollable.
We make settings page horizontally scrollable such that
the user can see the complete dropdown by scrolling in
case the dropdown is wider than the screen.
2023-03-14 12:53:41 -07:00
Sahil Batra 80bd425133 settings: Set width of select elements in settings page.
This commit sets width of select elements in settings page
to "auto" such that the width adjusts as required in different
languages and we also keep minimum width of 325px to maintain
consistency of width across elements in the page to not look
ugly.

We also remove the CSS for overriding width of various role
based select elements and a couple of others which was added
to adjust the widths for different languages. Since we have
now set the width to auto, the browser will automatically
adjust width to fit the options.
2023-03-14 12:53:41 -07:00
Palash Baderia c1009bc051 settings: Drop column from tables on narrow screen.
Drop the "last_active" column in the users section of the
organization settings, and the "Bot_type" column in the bots
section on sm_min (576px or less). Also, drop the "Date_muted"
column in the muted topics section of the personal settings
on ml_min (425px or less).

Added new className "topic_date_muted" for the date_muted
column, and "bot_type" for the bot_type column, to hide them
using display none when the viewport is small.

Fixes: #24320
2023-03-01 15:42:15 -08:00
Palash Baderia d8adc6de1c personal_settings: Add deactivate organization button for organization.
Added a 'Deactivate Organization' button inside the
'Personal Settings > Account & Privacy'. This button only appears
when the organization owner is the only user present. To verify this,
I used the 'get_active_human_count' function from the 'people.js'.

To remove duplication, a function has been created inside settings_org
file to handle the click event for the two buttons present inside
personal_settings and organization_settings that perform the same
action of deactivating organization. The click handler is defined in
the click_handlers.js file, which calls the dialog for deactivating
the organization. Previously, the error used to appear at the top of
the organization_settings, but now it appears inside the dialog box
itself.

To remove the duplication of two buttons having the same IDs,changed
the Id `deactivate_realm_button` to a className.

Fixes: #24105
2023-02-23 18:17:28 -08:00
Anders Kaseorg c1675913a2 web: Move web app to ‘web’ directory.
Ever since we started bundling the app with webpack, there’s been less
and less overlap between our ‘static’ directory (files belonging to
the frontend app) and Django’s interpretation of the ‘static’
directory (files served directly to the web).

Split the app out to its own ‘web’ directory outside of ‘static’, and
remove all the custom collectstatic --ignore rules.  This makes it
much clearer what’s actually being served to the web, and what’s being
bundled by webpack.  It also shrinks the release tarball by 3%.

Signed-off-by: Anders Kaseorg <anders@zulip.com>
2023-02-23 16:04:17 -08:00