Commit Graph

19 Commits

Author SHA1 Message Date
Kris
9baa820d53
UX: add collabsible headings to theme objects editor, adjust styles (#26383)
This adds collapsible headings to child lists, and adjusts the layout to utilize the available space.
2024-03-27 13:59:01 +08:00
Alan Guo Xiang Tan
476d91d233
DEV: Change category type to categories type for theme object schema (#26339)
Why this change?

This is a follow-up to 86b2e3aa3e.

Basically, we want to allow people to select more than 1 category as well.

What does this change do?

1. Change `type: category` to `type: categories` and support `min` and `max`
   validations for `type: categories`.

2. Fix the `<SchemaThemeSetting::Types::Categories>` component to support the
   `min` and `max` validations and switch it to use the `<CategorySelector>` component
   instead of the `<CategoryChooser>` component which only supports selecting one category.
2024-03-27 10:54:30 +08:00
Alan Guo Xiang Tan
ef99b97ea7
DEV: Load theme objects typed setting metadata when routing to editor (#26354)
Why this change?

Previously, we were preloading the necessary metadata for
`adminCustomizeThemes.show.schema` route in the
`adminCustomizeThemes.show` route. This is wasteful because we're
loading data upfront when the objects setting editor may not be used.

This change also lays the ground work for a future commit where we need
to be shipping down additional metadata which may further add to the
payload.
2024-03-26 14:02:05 +08:00
Alan Guo Xiang Tan
8a6e43a3d4
FIX: Fix broken translation in tags input field objects setting editor (#26340)
Why this change?

When a property of `type: tags` is required, we should be displaying the
"at least 1 tag is required" validation error message when there are no
tags selected in the `TagChooser` compoment. However, we were passing
`this.min` as the `count` attribute when generating the translation
string which is incorrect as `this.min` is not always set.
2024-03-25 16:06:32 +08:00
Alan Guo Xiang Tan
86b2e3aa3e
DEV: Change tag type to tags type for theme object schema (#26315)
Why this change?

While working on the tag selector for the theme object editor, I
realised that there is an extremely high possibility that users might want to select
more than one tag. By supporting the ability to select more than one
tag, it also means that we get support for a single tag for free as
well.

What does this change do?

1. Change `type: tag` to `type: tags` and support `min` and `max`
   validations for `type: tags`.

2. Fix the `<SchemaThemeSetting::Types::Tags>` component to support the
   `min` and `max` validations
2024-03-22 15:32:00 +08:00
Alan Guo Xiang Tan
3685eafb7a
UX: Improve category selector in theme objects editor (#26311)
Why this change?

Prior to this change, the category selector was not clearable and did
not allow a none value. This is incorrect as the category selector
should be clearable and should allow a none value when the property is
not required.
2024-03-22 11:36:53 +08:00
Alan Guo Xiang Tan
2417b090a9
UX: Improve group selector in theme objects editor (#26312)
Why this change?

Prior to this change, the group selector was using the `<GroupChooser>`
component which is a `<MultiSelectComponent>` and is not ideal in our
situation when we only allow a single group to be selected.

The other problem is that we are doing an async load of the groups when
it is already loaded and available in the `Site` service.
2024-03-22 10:29:33 +08:00
Alan Guo Xiang Tan
2d867aa8e5
DEV: Add validation message to float fields in theme object editor (#26285)
Why this change?

This is a continuation of a30d73f255

In our schema, we support the `min` and `max` validation
rules like so:

```
some_objects_setting
  type: objects
  schema:
    name: some_object
    properties:
      id:
        type: float
        validations:
          min: 5
          max: 10
```

While the validations used to validate the objects on the server side,
we should also add client side validation for better UX.

What does this change do?

Since the integer and float input fields share very very similar logic
in the component. This commit pulls the common logic into
`admin/components/schema-theme-setting/number-field.gjs` which
`admin/components/schema-theme-setting/types/integer.gjs` and `admin/components/schema-theme-setting/types/float.gjs`
will inherit from.
2024-03-21 15:33:38 +08:00
Alan Guo Xiang Tan
a30d73f255
DEV: Add validation message to integer fields in theme object editora (#26284)
Why this change?

This is a continuation of 8de869630f.

In our schema, we support the `min` and `max` validation
rules like so:

```
some_objects_setting
  type: objects
  schema:
    name: some_object
    properties:
      id:
        type: integer
        validations:
          min: 5
          max: 10
```

While the validations used to validate the objects on the server side,
we should also add client side validation for better UX.
2024-03-21 15:03:07 +08:00
Alan Guo Xiang Tan
8de869630f
DEV: Add validation message to string fields in theme object editor (#26257)
Why this change?

In our schema, we support the `min_length` and `max_length` validation
rules like so:

```
some_objects_setting
  type: objects
  schema:
    name: some_object
    properties:
      title:
        type: string
        validations:
          min_length: 1
          max_length: 10
```

While the validations used to validate the objects on the server side,
we should also add client side validation for better UX.
2024-03-21 12:39:25 +08:00
Alan Guo Xiang Tan
e5566b8519
FIX: Error encountered when adding child object in object setting editor (#26259)
Why this change?

If an object doesn't have any child objects for a particular property
and we try to add one through the editor, an error will be raised.

```
Cannot read properties of undefined (reading 'push')
    at SchemaThemeSettingEditor.addItem (editor.js:190:1)
```
2024-03-21 11:35:49 +08:00
Kris
59217b8a18
UX: adjust objects editor styles for full page layout (#26265) 2024-03-20 15:55:52 -04:00
Osama Sayegh
ec63f3e782
FEATURE: Buttons to add and remove objects for schema theme settings (#26256)
Continue from https://github.com/discourse/discourse/pull/25673.

This feature adds new buttons for schema theme settings that add/remove objects from lists.
2024-03-20 13:41:12 +08:00
Alan Guo Xiang Tan
426c035b80
UX: First pass styling experimental objects typed setting editor (#26194)
Why this change?

This is a first pass at styling the editor for creating/editing/updating
an objects typed theme setting. Only the desktop view is being
considered at the current moment.

The objects typed theme setting is still behind a feature flag at this moment so there is no need for us to get the styling perfect. The purpose of this PR is to get us to a state which we can quickly iterate with a designer on.
2024-03-18 10:03:30 +08:00
Alan Guo Xiang Tan
cdba864598
DEV: Support description for properties in objects schema (#26172)
Why this change?

When editing a objects typed theme setting, the input fields which are
rendered should include a description so that the user knows the purpose
of the field which they are changing.

What does this change do?

This change adds support for adding description to each property in the
schema for an object by following a given convention in the locale file.

For a schema like this:

```
objects_setting:
  type: objects
  schema:
    name: section
    properties:
      name:
        type: string
        required: true
      links:
        type: objects
        schema:
          name: link
          properties:
            name:
              type: string
              required: true
              validations:
                max_length: 20
            url:
              type: string
```

Description for each property in the object can be added like so:

```
en:
  theme_metadata:
    settings:
      objects_setting:
        description: <description> for the setting
        schema:
          properties:
            name: <description for the name property>
            links:
              name: <description for the name property in link>
              url: <description for the url property in link>
```

If the a description is not present, the input field will simply not
have an description.

Also note that a description for a theme setting can now be added like
so:

```
en:
  theme_metadata:
    settings:
      some_other_setting: <This will be used as the description>
      objects_setting:
        description: <This will also be used as the description>
```
2024-03-15 07:47:42 +08:00
Osama Sayegh
3a4f4abdc9
DEV: Support category, float, group and tag inputs for objects theme setting (#26113)
Continue from https://github.com/discourse/discourse/pull/25673 and https://github.com/discourse/discourse/pull/25811.

This PR adds support for category, float, group and tag types for schema theme settings.
2024-03-13 09:08:50 +08:00
Alan Guo Xiang Tan
5b8652965a
DEV: Add save button to editing typed objects theme setting route (#26133)
Why this change?

This is still a work in progress but allows objects type theme setting
to be saved.
2024-03-13 06:52:46 +08:00
Osama Sayegh
8bec0ca083
FEATURE: Support boolean, enum and integer fields for schema theme settings (#25933)
Continue from https://github.com/discourse/discourse/pull/25673 and https://github.com/discourse/discourse/pull/25811.

This commit adds support for boolean, integer and enum types for schema theme settings.
2024-02-29 11:11:32 +03:00
Osama Sayegh
3f4537eeb5
FEATURE: Schema theme setting input fields (#25811)
Continue from https://github.com/discourse/discourse/pull/25673.

This commit starts building the inputs pane of schema theme settings. At the moment only string fields are rendered, but more types will be added in future commits.
2024-02-27 01:07:32 +03:00