Commit Graph

1198 Commits

Author SHA1 Message Date
Elliot DeNolf
4c3e41beb1 chore(release): v3.7.0 [skip ci] 2024-12-13 12:06:46 -05:00
Jacob Fletcher
796df37461 fix(ui): awaits form state before rendering conditional fields (#9933)
When a condition exists on a field and it resolves to `false`, it
currently "blinks" in and out when rendered within an array or block
row. This is because when add rows to form state, we iterate over the
_fields_ of that row and render their respective components. Then when
conditions are checked for that field, we're expecting `passesCondition`
to be explicitly `false`, ultimately _rendering_ the field for a brief
moment before form state returns with evaluated conditions. The fix is
to set these fields into local form state with a new `isLoading: true`
prop, then display a loader within the row until form state returns with
its proper conditions.
2024-12-13 16:42:52 +00:00
Patrik
a582431a36 fix(ui): properly passes readOnly prop to email & username auth fields (#9938)
### What?

The `readOnly` prop was not being passed down to the `email` &
`username` auth fields.

Resulting in these fields not being disabled properly if `update` access
was restricted.

### How?

Passes the `readOnly` prop through to the fields and now properly
disables these fields if `update` access is restricted.
2024-12-12 17:40:23 -05:00
Dan Ribbens
5af71fb8d0 fix: join collection read access (#9930)
Respect read access control through the join field collections for GraphQL and admin UI

fixes #9922 and #9865
2024-12-12 12:01:03 -05:00
Alessio Gravili
bae2fe535e feat(ui): allow customizing min height of code editor (#9920)
Requirement for https://github.com/payloadcms/payload/pull/9645.

Dynamic code field resizing currently is broken for line-breaks - need
to address that in a future PR.
2024-12-12 06:31:39 +00:00
Alessio Gravili
c8046cade7 chore(ui): export SearchFilter, EditUpload, FileDetails, PreviewSizes, PreviewButton, ErrorIcon, InfoIcon, SuccessIcon, WarningIcon (#9919)
Fixes https://github.com/payloadcms/payload/issues/9794
2024-12-12 06:23:26 +00:00
Patrik
d9efd192e7 fix(ui): truncates richtext fields when displaying within a joins field (#9911)
### What?

Previously, `richtext` fields were not properly truncated when displayed
in a `joins` field.

`Before`:

![Screenshot 2024-12-11 at 3 42
13 PM](https://github.com/user-attachments/assets/a6f44248-8cb9-4a38-a74c-eaa88b739601)

### How?

Now - we've added proper css styling to truncate extended `richtext`
elements inside a `joins` table.

`After`:

![Screenshot 2024-12-11 at 3 41
53 PM](https://github.com/user-attachments/assets/ae846c50-2e29-411f-b056-20e4caf3ef20)
2024-12-11 17:03:27 -05:00
Jacob Fletcher
4c57df69ca refactor(ui): migrates away from React.forwardRef (#9907)
As of React 19, `ref` can now be accessed directly from props and no
longer require the use of `React.forwardRef`.
2024-12-11 21:09:05 +00:00
Alessio Gravili
00d438e91f refactor(ui): export TableColumnsProvider, documentDrawerBaseClass and SelectMany (#9899) 2024-12-11 18:34:58 +00:00
Patrik
b1d92c2bad feat: allows excluding entities from the nav sidebar / dashboard without disabling its routes (#9897)
### What?

Previously, the `admin.group` property on `collection` / `global`
configs allowed for a custom group and the `admin.hidden` property would
not only hide the entity from the nav sidebar / dashboard but also
disable its routes.

### Why?

There was not a simple way to hide an entity from the nav sidebar /
dashboard but still keep the entities routes.

### How?

Now - we've added the `false` type to the `admin.group` field to account
for this.

Passing `false` to `admin.group` will hide the entity from the sidebar
nav and dashboard but keep the routes available to navigate.

I.e

```
admin: {
  group: false,
},
```
2024-12-11 13:31:12 -05:00
Elliot DeNolf
45d20643df chore(release): v3.6.0 [skip ci] 2024-12-11 13:05:47 -05:00
James Mikrut
a0f0316534 fix: ensures autosave only runs sequentially (#9892)
Previously, Autosave could trigger 2 parallel fetches where the second
could outpace the first, leading to inconsistent results.

Now, we use a simple queue-based system where we can push multiple
autosave events into a queue, and only the latest autosave will be
performed.

This also prevents multiple autosaves from ever running in parallel.
2024-12-11 09:33:48 -06:00
Jacob Fletcher
da6bc55b19 fix(ui): ensures admin.disableListFilter is disabled despite url search params (#9874)
Continuation of #9846 and partial fix for #9774. When setting
`admin.disableListFilter` retroactively, it remains active within the
list filter controls. Same for when the URL search query contains one of
these fields, except this will actually display the _wrong_ field,
falling back to the _first_ field from the config. The fix is to
properly disable the condition for this field if it's an active filter,
while still preventing it from ever rendering as an option within the
field selector itself.
2024-12-10 17:37:52 -05:00
Jacob Fletcher
f7172b5b2c fix(ui): refreshes column state during hmr and respects admin.disableListColumn despite preferences (#9846)
Partial fix for #9774. When `admin.disableListColumn` is set
retroactively, it continues to appear in column state, but shouldn't.
This was because the table column context was not refreshing after HMR
runs, and would instead hold onto these stale columns until the page
itself refreshes. Similarly, this was also a problem when the user had
saved any of these columns to their list preferences, where those prefs
would take precedence despite these properties being set on the
underlying fields. The fix is to filter these columns from all requests
that send them, and ensure local component state properly refreshes
itself.
2024-12-10 15:11:44 -05:00
Patrik
563694d930 fix(ui): prevents unwanted data overrides when bulk editing (#9842)
### What?

It became possible for fields to reset to a defined `defaultValue` when
bulk editing from the `edit-many` drawer.

### Why?

The form-state of all fields were being considered during a bulk edit -
this also meant using their initial states - this meant any fields with
default values or nested fields (`arrays`) would be overwritten with
their initial states

I.e. empty values or default values.

### How?

Now - we only send through the form data of the fields specifically
being edited in the edit-many drawer and ignore all other fields.

Leaving all other fields stay their current values.

Fixes #9590

---------

Co-authored-by: Dan Ribbens <dan.ribbens@gmail.com>
2024-12-10 11:39:15 -05:00
Elliot DeNolf
ff62017cf2 chore(release): v3.5.0 [skip ci] 2024-12-06 14:58:41 -05:00
Alessio Gravili
8f3f44922e feat: upgrade to React 19 stable and Next.js 15.0.4 (#9801)
No need for those ugly @types/react overrides anymore!
2024-12-06 14:53:36 -05:00
Patrik
62fc2f552f fix(ui): collapsed array state on input change (#9800)
### What?

Previously, `initCollapsed: true` `array` fields would auto collapse
when typing in their respective inputs while in the create new view.

### Why?

This was due to the fact that we were only checking if `preferences`
existed in `form state` to handle the current state of the array row and
then falling back on the `initCollapsed` prop if `preferences` didn't
exist.

This was a problem because during create - `preferences` do not exist
yet. As a result, the state of the array row would keep falling back to
collapsed if `initCollapsed` was set to `true`.

### How?

To fix this, we now check the actual form state first before falling
back to preferences and then falling back to the initCollapsed prop
value.

Fixes #9775
2024-12-06 13:22:41 -05:00
Dan Ribbens
a11243e288 fix(ui): join field ignoring defaultSort and defaultLimit (#9766)
The join field was not respecting the defaultSort or defaultLimit of the
field configuration.

### Why?

This was never implemented.

### How?

This fix applies these correct limit and sort properties to the query,
first based on the field config and as a fallback, the collection
configuration.
2024-12-05 21:23:19 +00:00
Said Akhrarov
1ab3be65f8 fix(ui): disable doc submenu when parent button is disabled (#9750) 2024-12-05 15:56:00 -05:00
Paul
8f785e1fde chore(ui): expose onInputChange from react-select in SelectInput component (#9728) 2024-12-04 19:27:14 -06:00
Sasha
0829a350ce feat: allow to define global label as function (#9759) 2024-12-04 18:39:35 -05:00
Jarrod Flesch
fa7ed3f621 fix(ui): stale locale value from useLocale (#9582)
### What?
Fixes issue with stale locale from searchParams

### Why?
Bad use of useEffect/useState inside our useSearchParams provider.

### How?
Memoize the locale instead of relying on the useEffect which was causing
unnecessary renders with stale values.
2024-12-04 14:00:17 -05:00
Jarrod Flesch
8e26824bf8 fix(ui): only render header dom node if needed (#9742)
### What?
The `<header>` dom node was rendering even if empty for group fields.
Causing extra margin to be added even if no label/description were
provided.

### Why?
If the field had no label, description or errors it would still render.

### How?
Wraps the header node in an additional condition that checks for label,
description or errors before rendering the node.
2024-12-04 13:29:45 -05:00
Jarrod Flesch
4a324a9de7 fix(ui): incorrect label size for group field (#9740)
### What?
The group label was incorrectly sized.

![CleanShot 2024-12-04 at 10 33
13](https://github.com/user-attachments/assets/c94cb8b9-4453-4d57-a483-ea35a63f04a9)

### Why?
It should be rendered as a span not a label.

### How?
Added `as="span"` to the FieldLabel for the group field like we do for
the array field.

![CleanShot 2024-12-04 at 10 35
13](https://github.com/user-attachments/assets/99bdec33-39ee-4bd0-a4d1-ed3635e2bea7)
2024-12-04 11:13:53 -05:00
Elliot DeNolf
0ca473e6ca chore(release): v3.4.0 [skip ci] 2024-12-04 10:32:41 -05:00
Jacob Fletcher
a53c1d5517 fix: hidden and disabled fields cause incorrect field paths (#9680) 2024-12-03 21:22:28 -05:00
Dan Ribbens
67179a7fb8 fix: join field description, custom components and loading state (#9703)
- [fix: join field shows loading when creating a
document](9f7a2e7936)
- [fix: join field
descriptions](90e8cdb464)
- [feat(ui): adds before & after inputs to join
field](19d43329ad)

---------

Co-authored-by: Patrik <patrik@payloadcms.com>
2024-12-03 15:58:42 -05:00
Jarrod Flesch
fbb59bab0a fix: error after view is left idle on edit views (#9709)
### What?
![CleanShot 2024-12-03 at 15 00
13](https://github.com/user-attachments/assets/63afb1cf-59ae-4ae7-8741-c98cca0134df)

### Why?
`user.id` was being used as a dependency is callbacks and when the user
was logged out due to inactivity the above error would throw.

### How?
Added optional chaining to the dependency.
2024-12-03 15:49:07 -05:00
Sasha
18f9f35692 fix(ui): copy to locale incorrect label when locale label is defined as object (#9705)
Fixes https://github.com/payloadcms/payload/issues/9701

### What?
Previously, when defining `localization.locales` like this:
```ts
localization: {
  defaultLocale: 'en',
  locales: [{ label: { en: 'ESLocale' }, code: 'es' },{ label: { en: 'ESLocale' }, code: 'en' }],
},
```

The title in "copy to locale" modal was displayed incorrectly
```
Copy to locale: Copying from [object Object] to [object Object]
```

### How?
Uses the `getTranslation` function to handle this behavior properly
2024-12-03 21:06:51 +02:00
Dan Ribbens
d047f01bfa fix: copy data from locale transaction error (#9673)
### What?
Write conflict errors can arise when collections have hooks.

### Why?
The copyDataFromLocale local API calls to update were not passsing req
so changes could be made on different transcations.

### How?
Fixed the error by passing `req` and also introduced some perf
optimizations using `depth` and disabling `joins` since that data isn't
needed for this operation.
2024-12-03 13:02:44 -05:00
Elliot DeNolf
a6ba9e3a41 chore(release): v3.3.0 [skip ci] 2024-12-03 12:53:42 -05:00
Paul
d1de106944 fix(ui): data disappearing when form state updates in globals (#9682)
Fixes a bug where data would visually disappear from the form when
merging new form stats when saving globals.
2024-12-03 15:41:21 +00:00
Dan Ribbens
6104fe5011 feat: disableLocalStrategy with auth fields still enabled (#9579)
Adds configuration options to `auth.disableLocalStrategy` to allow
customization of how payload treats an auth enabled collection.

Two new properties have been added to `disableLocalStrategy`:

- `enableFields` Include auth fields on the collection even though the
local strategy is disabled. Useful when you do not want the database or
types to vary depending on the auth configuration used.
- `optionalPassword`: makes the password field not required
2024-12-03 09:52:23 -05:00
Patrik
58b7415385 feat(ui): adds beforeInput & afterInput props for arrays, blocks, collapsible, group, radio, & relationship fields. (#9674)
The following fields did not have the ability to add beforeInput &
afterInput:
- Arrays
- Blocks
- Collapsibles
- Groups
- Radios
- Relationships

### How?

Adds the ability to define and add before and after inputs to these
fields in your config.

Here are examples of the above fields with beforeInputs & afterInputs
defined (I.e. `#before-input` & `#after-input`):

`Arrays`:
![Screenshot 2024-12-02 at 1 22
15 PM](https://github.com/user-attachments/assets/8a2d5351-acab-4b28-b9bd-b19e1942da7e)


`Blocks`:
![Screenshot 2024-12-02 at 1 35
53 PM](https://github.com/user-attachments/assets/e9b5f22b-2671-4efb-8ee4-b4de3a1addc5)


`Collapsible`:
![Screenshot 2024-12-02 at 1 46
34 PM](https://github.com/user-attachments/assets/38f7a016-8a79-4ece-90d2-0b1761db19cd)


`Groups`:
![Screenshot 2024-12-02 at 1 52
34 PM](https://github.com/user-attachments/assets/dc6a123b-ee01-4021-bbbf-ac1b8c086072)


`Radios`:
![Screenshot 2024-12-02 at 1 59
35 PM](https://github.com/user-attachments/assets/4ddd16a1-2ad2-44f5-a7e9-86aa6e4e947b)


`Relationships`:
![Screenshot 2024-12-02 at 1 21
55 PM](https://github.com/user-attachments/assets/b4679baf-6157-41c9-8485-ca570be979d2)
2024-12-02 19:37:16 +00:00
Jacob Fletcher
edc04aec56 refactor: deprecates params and search params contexts (#9581)
As described in #9576, the `SearchParamsProvider` can become stale when
navigating routes and relying on search params during initial render.
This is because this context, along with the `ParamsProvider`, is
duplicative to the internal lifecycle of `useSearchParams` and
`useParams` from `next/navigation`– but always one render behind.
Instead, we need to use the hooks directly from `next/navigation` as
described in the jsdocs. This will also remove any abstraction over top
the web standard for `URLSearchParams`.

For this reason, these providers and their corresponding hooks have been
marked with the deprecated flag and will continue to behave as they do
now, but will be removed in the next major release. This PR replaces all
internal reliance on these hooks with `next/navigation` as suggested,
except for the `useParams` hook, which was never used in the first
place.

```diff
'use client'
- import { useSearchParams } from '@payloadcms/ui'
+ import { useSearchParams } from 'next/navigation'
+ import { parseSearchParams } from '@payloadcms/ui'

export function MyClientComponent() {
- const { searchParams } = useSearchParams()
+ const searchParams = useSearchParams()
+ const parsedParams = parseSearchParams(searchParams)

  // ...
}
```
_MyClientComponent.tsx_
2024-12-02 13:57:59 -05:00
Jacob Fletcher
d04cea123c fix(ui): properly animates height for dynamically rendered children (#9665)
Fixes https://github.com/payloadcms/payload/issues/9567. When using the
`AnimateHeight` component on a patched browser such as Webkit,
components with dynamically rendered children are not properly animating
in, such as blocks with rich text. This is because the height of that
content is unable to be calculated before it's rendered, preventing the
component from acquiring a target height to animate toward. This change
was originally introduced in #9456 in effort to remove unnecessary
dependencies.

The fix is to setup a ResizeObserver during animation to watch for
changes to the content's height. This way, as components dynamically
render in based on the "open" state, the hook will simply increment the
target height accordingly.
2024-12-02 13:18:16 -05:00
Alessio Gravili
24c75b09c0 fix(ui): upgrade sonner from 1.5.0 to 1.7.0 (#9666)
This fixes React 19 peer dependency warnings for sonner
2024-12-02 18:08:22 +00:00
Alessio Gravili
877b89962e chore: upgrade all dependencies used to build payload (swc, esbuild, react compiler, babel) (#9658) 2024-12-02 09:07:48 -07:00
Alessio Gravili
71ba4a8bce chore: upgrade all react and next-related packages (#9655)
This PR updates all react and next-related packages to the latest
version in our test directory and in our templates, while still allowing
older versions to be used.

Additionally, this ensures that the "scheduler" package version we
install matches the version installed by react-dom
2024-12-02 00:48:39 -07:00
Alessio Gravili
9d724086c7 feat(ui): upgrade react-datepicker dependency from 6.2.0 to 7.5.0 (#9654)
The new version comes with included types (we can uninstall
`@types/react-datepicker`!), removes 1 dependency and adds official
support for React 19
2024-12-02 05:53:12 +00:00
Alessio Gravili
73e0e25e14 fix(ui): upgrade react-select, fixes type issues with select input (#9653)
React-select fixed React 19 type compatibility here:
https://github.com/JedWatson/react-select/pull/5974
2024-12-01 21:35:03 -07:00
Alessio Gravili
963387f7b0 feat(ui): export CodeEditor (#9650)
Requirement for https://github.com/payloadcms/payload/pull/9645
2024-12-02 03:19:26 +00:00
Alessio Gravili
f151723745 feat(ui): export TabsProvider and TabComponent (#9647)
Requirement for https://github.com/payloadcms/payload/pull/9645
2024-12-02 02:28:13 +00:00
Elliot DeNolf
07e40d37ac chore(release): v3.2.2 [skip ci] 2024-11-29 12:59:59 -05:00
Alessio Gravili
c4327f2294 fix(ui): ensure UI is reactive to HMR changes, without having to refresh the page (#9602)
**Before:**

https://github.com/user-attachments/assets/c4ad9184-4629-419d-a30e-68dd802da387


**After:**

https://github.com/user-attachments/assets/4f7bcd4a-e1a7-464e-8036-55f48c1d5da1
2024-11-28 14:55:41 -07:00
Alessio Gravili
36a6a19de8 fix(ui): css is not defined error in production build (#9603)
Related: https://github.com/payloadcms/payload/pull/9456
Fixes https://github.com/payloadcms/payload/issues/9598

This ensures that the `CSS` property is accessed safely, preventing the
"CSS is not defined" error
2024-11-28 21:00:23 +00:00
Jarrod Flesch
4b302f22a0 fix: incorrect formState after doc save (#9573)
### What?
When the document is saved the formState was not being reset from the
server.

### Why?
getFormState was not being called onSuccess of the form submission

### How?
The `Form` onSuccess function now allows for an optional return type of
`FormState` if the functions returns formState then we check to see if
that differs from the current formState on the client. If it does then
we dispatch the `REPLACE_STATE` action with the newState.

Fixes https://github.com/payloadcms/payload/issues/9423
2024-11-27 16:45:10 -05:00
Jacob Fletcher
3961223cc1 fix(ui): retains search params when navigating back (#9576)
Closes #9132. When query params are present in the URL, such as after
searching or filtering in the list view, they are not being retained
after navigating back to that view via `history.back()` (i.e. the back
button). This makes it difficult to quickly navigate in and out of
documents from the list view when an underlying search exists. This was
because the `SearchParamsProvider` is stale when the new view renders,
which then replaces the URL with these stale params. The fix here is to
_not_ use the `SearchParamsProvider` at all, and instead use
`next/navigation` directly. Ultimately, this provider should likely be
marked deprecated and then removed in the next major release for this
very reason.
2024-11-27 14:49:53 -05:00
Alessio Gravili
ca07c9f0d7 fix(ui): ensure Form submit button only uses onClick handler when needed, as that was causing issues with password manager extensions (#9572) 2024-11-27 17:50:26 +00:00