Commit Graph

4434 Commits

Author SHA1 Message Date
Krzysztof Kotlarek
0410c07342
UX: the ability to collapse AdminConfigAreaCard ()
Additional `collapsable` argument which makes area cards collapsible.
2024-12-17 11:47:23 +11:00
Sam
55a8184231
FEATURE: Reason and deleted content support in the review queue ()
Add flag reason filter and improve handling of deleted content in review queue

This commit enhances the review queue with several key improvements:

1. Adds a new "Reason" filter to allow filtering flags by their score type
2. Improves UI for deleted content by:
   - Adding visual indication for deleted posts (red background)
   - Properly handling deleted content visibility for staff (category mods can not see deleted content)
3. Refactors reviewable score type handling for better code organization
4. Adds  tests for trashed topics/posts visibility

This change will help moderators more efficiently manage the review queue by
being able to focus on specific types of flags and better identify deleted
content.
2024-12-17 11:44:46 +11:00
Jordan Vidrine
565a48e8e1
UX: fix active and muted channels () 2024-12-16 16:02:44 -06:00
Joffrey JAFFEUX
41df705188
DEV: replaces topic-notifications-options by DMenu ()
This commit introduces <NotificationsTracking /> which is a wrapper component around <DMenu /> which replaces the select-kit component <TopicNotificationsButton />.

Each tracking case has its dedicated component:

- topic -> `<TopicNotificationsTracking />`
- group -> `<GroupNotificationsTracking />`
- tag -> `<TagNotificationsTracking />`
- category -> `<CategoryNotificationsTracking />`
- chat thread -> `<ThreadNotificationsTracking />`
2024-12-16 19:59:18 +01:00
Joffrey JAFFEUX
f6a4de4805
DEV: adds support for nested collections and objects ()
Collections were an existing concept in FormKit but didn't allow nesting. You can now do infinite nesting:

```gjs
<Form
  @data={{hash
    foo=(array
      (hash bar=(array (hash baz=1))) (hash bar=(array (hash baz=2)))
    )
  }}
  as |form|
>
  <form.Collection @name="foo" as |parent parentIndex|>
    <parent.Collection @name="bar" as |child childIndex|>
      <child.Field @name="baz" @title="Baz" as |field|>
        <field.Input />
      </child.Field>
    </parent.Collection>
  </form.Collection>
</Form>
```

On top of this a new component has been added: `Object`. It allows you to represent objects in your form data. Collections are basically handling arrays, and Objects are objects.

This is useful if you form data has this shape for example:

```javascript
{ foo: { bar: 1, baz: 2 } }
```

This can now be mapped in your form using this syntax:

```gjs
<Form @data={{hash foo=(hash bar=1 baz=2)}} as |form|>
  <form.Object @name="foo" as |object name|>
    <object.Field @name={{name}} @title={{name}} as |field|>
      <field.Input />
    </object.Field>
  </form.Object>
</Form>
```

Objects accept nested collections and nested objects. Just like Collections.

A small addition has also been made to `Collection`, they now support a custom `@tagName`, it's useful if each item of your collection is the row of a table for example.
2024-12-13 15:43:32 +01:00
Joffrey JAFFEUX
cbc0ece6e8
DEV: <DSelect /> ()
`<DSelect />` is a wrapper similar to our existing `<DButton />` over the html element `<select>`. The code is ported from form kit which is now directly using `<DSelect />`. Note this component has also been used in edit topic timer modal.

This component is recommended for a small list of text items (no icons, no rich formatting...).

Usage:

```gjs
<DSelect class="my-select" @onChange={{this.handleChange}} as |select|>
  <select.Option @value="foo" class="my-favorite-option">Foo</select.Option>
  <select.Option @value="bar">Bar</select.Option>
</DSelect>
```

This commit comes with a set of assertions:

```gjs
import dselect from "discourse/tests/helpers/d-select-helper";
import { select } from "@ember/test-helpers";

assert
  .dselect(".my-select")
  .hasOption({ value: "bar", label: "Bar" })
  .hasOption({ value: "foo", label: "Foo" })
  .hasNoOption("baz");

await select(".my-select", "foo");

assert.dselect(".my-select").hasSelectedOption({value: "foo", label: "Foo"});
```
2024-12-13 10:40:06 +01:00
Martin Brennan
fae6ffcf06
UX: Introduce <DStatTiles /> component ()
Introduces a new component used to show a grid of stats
on any page, mostly used for dashboards and config pages.
This component yields a hash with a `Tile` component property,
and the caller can loop through their stats and display them
using this component.

Each stat needs a @label and a @value at minimum, but can
also pass in a @tooltip and a @url.
2024-12-13 11:32:46 +10:00
chapoi
ee567165f1
UX: increase button sizes and timeline size ()
* UX: increase button sizes and timeline size

* UX: bring back tracking btn on topic timeline desktop

* Scope flexing topic-navigation area to mobile + make all buttons same font-size
2024-12-12 16:09:44 +01:00
Martin Brennan
203f93bcaf
FIX: Background color for settings overriden filter ()
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.
2024-12-12 10:27:37 +11:00
Keegan George
9df7d6f9a0
UX: Make radio buttons respect forum's accent color ()
Similar to 601780aadf, this change ensures radio buttons respect the forum's accent color. Visual color change only, as such no tests.
2024-12-11 15:22:00 -08:00
Kris
9f68b037d4
UX: fix PM title editing layout () 2024-12-12 09:18:52 +11:00
Keegan George
601780aadf
UX: Make checkboxes respect forum's accent color ()
This change ensures checkboxes respect the forum's accent color. Visual color change only, as such no tests.
2024-12-11 12:55:22 -08:00
Kris
aabf174ac8
UX: fix admin sidebar header width () 2024-12-11 11:09:27 -05:00
Régis Hanol
6ef0b5d508
Cleanup mobile topic footer area () 2024-12-11 14:59:37 +01:00
Ella E.
d69edab611
FIX: Prevent experimental badge from splitting onto new lines with long titles ()
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.
2024-12-10 10:25:45 +10:00
Martin Brennan
5e86bc2f43
FIX: Allow anyone who can manage groups to see Automatic tooltip ()
Followup 35ecd0335c

Since we have the moderators_manage_categories_and_groups setting,
more than admins can manage groups, so we need to allow others to
see this Automatic tooltip as well.

Also fixes an inconsistency with canManageGroup between the User
model and Group controller, the latter is correct, allowing management
of automatic groups if can_admin_group permission is true
2024-12-09 13:21:24 +10:00
Kelv
e55d4f0c5c
DEV: update deprecated icon names in themes-grid-card () 2024-12-08 22:18:55 +01:00
Kris
d35d8193aa
UX: fix PM topic map layout () 2024-12-06 08:34:54 -05:00
Ella E.
c817a94c89
UX: Move revoked API key status to dedicated column ()
* 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
2024-12-05 04:24:01 -07:00
Gary Pendergast
bb2e9645f2
FIX: Move granted badges to the end of the post header. () 2024-12-05 09:22:03 +11:00
Kris
19f530a827
UX: refactor title editing CSS to improve layout () 2024-12-04 16:30:48 -05:00
Kris
5c2e05cf5d
UX: fix topic map padding in low-content situations () 2024-12-04 09:39:14 -05:00
Ella E.
ef9d7579df
UX: Add admin filter row styling ()
* DEV: add scss file for admin filter

* UX: apply styling for the filter row
2024-12-03 18:22:13 +11:00
Gary Pendergast
2513339955
FEATURE: Show when a badge has been granted for a post ()
Co-authored-by: Joffrey JAFFEUX <j.jaffeux@gmail.com>
Co-authored-by: Jarek Radosz <jradosz@gmail.com>
Co-authored-by: Alan Guo Xiang Tan <gxtan1990@gmail.com>
2024-12-03 13:43:27 +11:00
Jordan Vidrine
3b334f54fc
FIX: adjust codeblock link styling () 2024-12-02 09:49:54 -06:00
Krzysztof Kotlarek
6d4c6ee154
UX: admins users page follows admin ux guideline ()
Conversion of `/admin/users` page to follow admin UX guidelines.

In addition, add the username to the title on the user admin page.
2024-12-02 10:11:23 +11:00
David Taylor
c98335e4e5
UX: Drop post-background highlighting on navigation ()
Animating the background-color property like this is not compositable for the browser, which means the animation is not smooth, and can contribute to the Cumulative Layout Shift web vital.

For now, we're removing this, and may consider re-introducing an alternative version in future based on user feedback.
2024-11-28 16:55:13 +00:00
Jan Cernik
b4ef3456d9
FEATURE: Allow to customize the signup form descriptions () 2024-11-27 14:23:14 -03:00
Ella E.
ea2a0f2c8e
DEV: refactor SCSS structure for admin table styling () 2024-11-26 22:08:52 -07:00
Ted Johansson
15a61a0c1f
DEV: Change admin emoji delete button from icon to text ()
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.
2024-11-26 14:10:14 +08:00
Osama Sayegh
118f7869bb
FEATURE: Add bulk destroy to admin users list ()
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.
2024-11-25 11:13:35 +03:00
Ted Johansson
88af23e1ca
DEV: Modernize admin user fields ()
This PR modernizes the user fields area of the admin UI. It is largely based on the work on the emoji section.
2024-11-25 11:54:43 +08:00
Jordan Vidrine
44fbf1048c
UX: Multiple codeblocks fixes () 2024-11-22 13:52:23 -06:00
Penar Musaraj
a97ac905d1
Revert "UX: Codeblocks edits ()" ()
This reverts commit 667a09b159.
2024-11-22 12:09:40 -05:00
Jordan Vidrine
667a09b159
UX: Codeblocks edits () 2024-11-22 09:05:48 -06:00
Akshay Birajdar
b138eaf9e5
FEATURE: Add Bulk actions to /filter page ()
- Add bulk actions component on /filter page for both desktop & mobile view.
- Add system specs to assert bulk actions to be available on /filter page.
2024-11-22 11:51:06 +11:00
Renato Atilio
6e5d4ee492
DEV: refactor composer references on composer-container/-editor ()
Most of it is removing the ComposerContainer > ComposerEditor indirect references to the composer service, so ComposerEditor now deals with the service directly.

Form template was moved from DEditor to ComposerEditor.
2024-11-21 13:29:12 -03:00
Jordan Vidrine
34e6c8f3dd
UX: Codeblocks experiment merge () 2024-11-20 17:24:41 -06:00
Kris
84fecd370c
A11Y: convert sortable topic list headers to proper buttons () 2024-11-19 15:38:03 -05:00
Ted Johansson
c3367c329c
DEV: Make breadcrumb separators unclickable icons ()
The current breadcrumb separators are ">" characters that are added as pseudo-elements. These become part of the clickable area for the links, which causes mis-clicks.

This PR does two things:

- Replace the pseudo-element with a DIcon.
- Make sure the separator is not clickable.
2024-11-19 16:42:43 +08:00
Ted Johansson
d96b8d1001
DEV: Modernize admin emoji JavaScript ()
app/assets/javascripts/admin/addon/templates/emojis.hbs
2024-11-19 15:44:34 +08:00
Martin Brennan
01a160d8af
UX: Add AdminConfigAreaEmptyList component ()
This component can be used as a placeholder on
admin pages where the table has no data as per
the admin UI guidelines.
2024-11-19 16:49:57 +10:00
Joffrey JAFFEUX
582de0ffe3
DEV: adds blocks support to chat messages ()
Blocks allow BOTS to augment the capacities of a chat message. At the moment only one block is available: `actions`, accepting only one type of element: `button`.

<img width="708" alt="Screenshot 2024-11-15 at 19 14 02" src="https://github.com/user-attachments/assets/63f32a29-05b1-4f32-9edd-8d8e1007d705">

# Usage

```ruby
Chat::CreateMessage.call(
  params: {
    message: "Welcome!",
    chat_channel_id: 2,
    blocks: [
      {
         type: "actions",
         elements: [
           { value: "foo", type: "button", text: { text: "How can I install themes?", type: "plain_text" } }
         ]
      }
    ]
  },
  guardian: Discourse.system_user.guardian
)
```

# Documentation

## Blocks

### Actions

Holds interactive elements: button.

#### Fields

| Field | Type | Description | Required? |
|--------|--------|--------|--------|
| type | string | For an actions block, type is always `actions` | Yes |
| elements | array | An array of interactive elements, maximum 10 elements | Yes |
| block_id | string | An unique identifier for the block, will be generated if not specified. It has to be unique per message | No |

#### Example

```json
{
  "type": "actions",
  "block_id": "actions_1",
  "elements": [...]
}
```

## Elements

### Button

#### Fields

| Field | Type | Description | Required? |
|--------|--------|--------|--------|
| type | string | For a button, type is always `button` | Yes |
| text | object | A text object holding the type and text. Max 75 characters | Yes |
| value | string | The value returned after the interaction has been validated. Maximum length is 2000 characters | No |
| style | string | Can be `primary` ,  `success` or `danger` | No |
| action_id | string | An unique identifier for the action, will be generated if not specified. It has to be unique per message | No |

#### Example

```json
{
  "type": "actions",
  "block_id": "actions_1",
  "elements": [
    {
      "type": "button",
      "text": {
          "type": "plain_text",
          "text": "Ok"
      },
      "value": "ok",
      "action_id": "button_1"
    }
  ]
}
```

## Interactions

When a user interactions with a button the following flow will happen:

- We send an interaction request to the server
- Server checks if the user can make this interaction
- If the user can make this interaction, the server will:

  * `DiscourseEvent.trigger(:chat_message_interaction, interaction)`
  * return a JSON document
  
  ```json
  {
    "interaction": {
        "user": {
            "id": 1,
            "username": "j.jaffeux"
        },
        "channel": {
            "id": 1,
            "title": "Staff"
        },
        "message": {
            "id": 1,
            "text": "test",
            "user_id": -1
        },
        "action": {
            "text": {
                "text": "How to install themes?",
                "type": "plain_text"
            },
            "type": "button",
            "value": "click_me_123",
            "action_id": "bf4f30b9-de99-4959-b3f5-632a6a1add04"
        }
    }
  }
  ```
  * Fire a `appEvents.trigger("chat:message_interaction", interaction)`
2024-11-19 07:07:58 +01:00
Ella E.
79ffbe7cd5
UX: Make cells middle aligned; apply overview class directly to td elements () 2024-11-18 18:42:29 -07:00
Jordan Vidrine
2a59df79d3
UX: Add title & adjust dnd image () 2024-11-18 19:25:41 -06:00
Kris
809ce5f5da
DEV: remove !important from btn-transparent background () 2024-11-19 09:38:10 +11:00
Ella E.
9dab8ed29b
DEV: Moved styles for to be nested under to prevent layout issues affecting other admin tables () 2024-11-17 22:48:47 -07:00
Gary Pendergast
69d9868c7f
FEATURE: Add keyboard shortcuts for jumping to unread channels () 2024-11-18 11:18:58 +11:00
Ella E.
93983286b5
UX: Increase admin section header contrast () 2024-11-15 19:43:29 -07:00
Jan Cernik
876591fdab
FIX: Signup fields tab order and descriptions () 2024-11-15 18:17:55 -03:00