Before this commit it was complicated to render a `Checkbox` outside of
a `CheckboxGroup` as you would get no title, no description, no optional
hint and not tooltip.
This commits makes all of this possible by adding a special case for
checkboxes, and sharing code for tooltips and optional hint.
This commit also uses this opportunity to refactor part of the code to
use curryComponent and reduce code duplication.
This experiment hides the list of categories in the inner
sidebar for the main site settings page if the admin sidebar
is enabled. It also defaults the list of settings to "All"
instead of a specific category.
Our theory here is that people who use this page are using
it to find an exact setting, not to go through the categories
one by one. Our admin sidebar also has several groups of important
settings already too, so that can be used for browsing.
Finally, the input on the page focuses when you load it, so
filtering is faster.
This commit converts the `AdminReport` component, which is quite
high complexity, to gjs. After this initial round, ideally this
component would be broken up into smaller components because it is
getting quite big now.
Also in this commit:
* Add an option to display the report description in a tooltip, which
was
the main way the description was shown until recently. We want to use
this on the dashboard view mostly.
* Move admin report "mode" definitions to the server-side Report model,
inside a `Report::MODES` constant, collecting the modes defined in
various
places in the UI into one place
* Refactor report code to refer to mode definitions
* Add a `REPORT_MODES` constant in JS via javascript.rake and refactor
JS to refer to the modes
* Delete old admin report components that are no longer used
(trust-level-counts, counts, per-day-counts) which were replaced
by admin-report-counters a while ago
* Add a new `registerReportModeComponent` plugin API, some plugins
introduce their own modes (like AI's `emotion`) and components and
we need a way to render them
All of these buttons use our default grey background styling, but aren't
carrying the `btn-default` class, which makes them easier to target in
themes. This PR adds the class.
"context" notation is not supported in iOS < 16.4, and we don't have any
post-processing on our CSS files which can automatically make that
conversion.
For now, changing the stylelint config to enforce the more-compatible
syntax, and updating all occurences.
Stylelint is a css linter: https://stylelint.io/
As part of this change we have added two javascript scripts:
```
pnpm lint:css
pnpm lint:css:fix
```
Look at `.vscode/settings.json.sample` and `.vscode/extensions.json` for
configuration in VSCode.
---------
Co-authored-by: Joffrey JAFFEUX <j.jaffeux@gmail.com>
This is a small clean-up PR that does the following:
- Convert api-keys.hbs to a RouteTemplate backed api-keys.gjs.
- Move the sub-page templates (index, show, new) into /api-keys sub-directory.
- Removes some styles that aren't used after the admin UI conversion.
There are a few changes here to make the Emails admin page more consistent with the rest of the admin UI.
- The header and navigation menu have been updated.
- The sidebar now stays highlighted when visiting the email admin sub-pages.
- Moved the Template editor from /admin/customize/email_templates to /admin/email/templates, so it fit as a sub-page.
- Removed the link to the Template editor from the Customize section of the old top menu, since it's accessible from the Emails section, instead.
In #30096 we converted the API keys UI to follow the new admin UI guidelines.
During this conversion, the step where you get a chance to copy the API key after creating, was lost due to a rebase mistake.
This re-introduces it.
This adds the Silence Reason column to silenced user lists.
This feature helps combat large spam attacks cause you can quickly see
why a user was silenced and then bulk act on all the silenced users
This PR makes the secondary sidebar in the admin UI more consistent
navigation experience:
* Added a coloured background for links on hover
* Replaced the bold text and line style with a distinct background
highlight, ensuring it complements the admin sidebar while maintaining
its own identity
* Bringing in arrow indicators to match the active navigation state in
the category settings
### Before
<img width="488" alt="image"
src="https://github.com/user-attachments/assets/aa843766-0ed7-435a-8880-6f0598aa4782"
/>
### After
<img width="475" alt="image"
src="https://github.com/user-attachments/assets/ec31bab9-0f51-4757-ab06-95a961ae17ee"
/>
Followup 203f93bcaffab1f493be70c2277ef11048f2017e
This commit makes sure the background for all the admin
site settings filters (including the filter input and
override checkbox) is consistent no matter what the theme,
as it currently changes based on theme.
Setting tab should be added to permalinks so admins do not need to have left `/permalinks`.
A new component called `AreaSetting` was added to avoid duplications and
simplify adding settings to other sections.
This converts the `<AdminPageHeader />` component and the
`<AdminPageSubheader />` components into new components
that can be used outside of admin, and updates the CSS classes.
Also introduces a `<DPageActionButton />` component and child
components for the header action buttons.
I have to keep the old admin-only components around for
now until plugins are updated, then we can remove it,
and remove the re-exports that are done within
admin-page-action-button.gjs
* UX: Apply admin table classes for consistent mobile styling on the web hooks page
* DEV: Remove icon on the status component; update status classes
* DEV: Update tests for webhook status component
* DEV: add space var with a smaller value
* DEV: Add styling for different status labels
This was fixed previously but must have regressed, we
are showing a darker grey background around the
"Only show overridden" checkbox for our Settings tab
in config pages.
This PR resolves an issue where the "Experimental" badge would break onto a new line when the title was too long, causing the badge text to separate from the icon. The fix ensures the badge text and icon remain aligned, even with longer titles.
* DEV: add table heading for status
* UX: Move revoked status to its own column with a badge; remove revoked icon
* UX: Increase text contrast for revoked rows
The Admin UI guidelines states that buttons should have text, not icons. This was an oversight on the admin emoji listing.
Part of this change is also opportunistically removing the CSS file for admin emojis, none of which is used any more since the conversion.
This commit introduces a new feature that allows staff to bulk select and delete users directly from the users list at `/admin/users/list`. The main use-case for this feature is make deleting spammers easier when a site is under a large spam attack.
Internal topic: t/140321.
Redesign the permalinks page to follow the UX guide. In addition, the ability to edit permalinks was added.
This change includes:
- move to RestModel
- added Validations
- update endpoint and clear old values after the update
- system specs and improvements for unit tests
This commit:
- Adds back the target drop options to enable the feature
- Applies the css to every elements and not just the one for admin emojis, also fixes the style as it was flashing and preventing it to work. For now we just change the color of the image icon.
- Adds a test to ensure we don't regress.
This PR adds a small visual change to the new feature item on the `/admin/whats-new` page. When features are marked with an experimental site setting, they should show an indication on the feature item that it is "Experimental"
* UX: Apply admin table classes for consistent mobile styling on the emojis page
* UX: remove icon from the button
* UX: styling tweaks on the emoji uploader form
* UX: right align table button controls
* apply prettier
I was skimming through existing pages to get a feel for the admin UI guidelines. I noticed that this part was missing its margin. On some further investigation, it seems that a single CSS selector, .award-badge was being used both for the section and for the button in the header, so I decided to 1) separate the two and 2) add in the missing margin.
