Visually differentiate localized fields from non-localized fields

[zubricks]

It's tough to identify at a glance which fields have localized: true, and which fields do not. We should consider extending the built-in field types with a way to denote if they are localized or not e.g. When editing a single locale, show the current locale in a pill next to the field label to show that it is localized.

[tylandavis]

Design update 11/29/23

To show which fields are localized, a pill with the current locale will be added next to the label of the field:

[benjick]

Looks great, any way to have this today?

[tylandavis]

You could achieve this yourself by replacing the label with a custom component, and use a combination of Payload React hooks to determine which fields are localized and which locale is currently selected.

[benjick]

I ended up creating a plugin which traverses every field and checks if localized = true and wraps the underlying component so I can add a border

[nexflo]

I just saw this also on screenshots on the official payload site... so i thoughts its flying around as a plugin somewhere...or as a native feature.
@benjick you thinking about releasing the plug? :)

[benjick]

@nexflo I could if you want, but if you're on 3.0 there's already https://github.com/r1tsuu/payload-enchants/tree/master/packages/better-localized-fields which I based my 2.x plugin on

(moved this comment into the correct thread)