-
Notifications
You must be signed in to change notification settings - Fork 15
TabbedUI breaks content fields with position: 'sidebar'
#35
Comments
@omavi are you saying you have |
@jacobsfletch yes, exactly! |
Can confirm, just stumbled upon this issue as well. |
Actually, after looking a bit more into this, I think there's two issues at play here:
|
👍🏼 hitting this too, @qbeauperin I don't totally follow as I'm not explicitly using |
The workaround I've ended up using is not using the plugin, but using the plugin's fields directly. import { CollectionConfig } from 'payload/types';
// SEO fields
import { Overview } from '@payloadcms/plugin-seo/dist/ui/Overview';
import { getMetaDescriptionField } from '@payloadcms/plugin-seo/dist/fields/MetaDescription';
import { getMetaTitleField } from '@payloadcms/plugin-seo/dist/fields/MetaTitle';
import { getPreviewField } from '@payloadcms/plugin-seo/dist/ui/Preview';
import { getMetaImageField } from '@payloadcms/plugin-seo/dist/fields/MetaImage';
const seoConfig = {
uploadsCollection: 'media',
generateTitle: ({ doc }) => `${doc?.title?.value} — Site name`,
generateDescription: ({ doc }) => doc?.excerpt?.value,
generateURL: ({ doc }) => `https://faefarm.com/news/${doc?.slug?.value}`,
generateImage: ({ doc }) => doc?.featuredImage?.value,
}
const Posts: CollectionConfig = {
slug: 'posts',
fields: [
{
type: 'tabs',
tabs: [
{
label: 'Content',
fields: [
{
name: 'title',
type: 'text',
localized: true,
required: true,
},
{
name: 'slug',
type: 'text',
localized: true,
required: true,
unique: true,
},
{
name: 'content',
type: 'richText',
localized: true,
},
]
},
{
label: 'SEO',
fields: [
{
name: 'meta',
label: 'SEO',
type: 'group',
fields: [
{
name: 'overview',
label: 'Overview',
type: 'ui',
admin: {
components: {
Field: Overview,
},
},
},
{
name: 'title',
type: 'text',
localized: true,
admin: {
components: {
Field: (props) => getMetaTitleField({ ...props, ...{ pluginConfig: seoConfig } }),
},
},
},
{
name: 'description',
type: 'textarea',
localized: true,
admin: {
components: {
Field: (props) => getMetaDescriptionField({ ...props, ...{ pluginConfig: seoConfig } }),
},
},
},
{
name: 'image',
label: 'Meta Image',
type: 'upload',
localized: true,
relationTo: seoConfig?.uploadsCollection,
admin: {
description: 'Maximum upload file size: 12MB. Recommended file size for images is <500KB.',
components: {
Field: (props) => getMetaImageField({ ...props, ...{ pluginConfig: seoConfig } }),
},
},
},
{
name: 'preview',
label: 'Preview',
type: 'ui',
admin: {
components: {
Field: (props) => getPreviewField({ ...props, ...{ pluginConfig: seoConfig } }),
},
},
},
]
}
]
}
]
},
{
name: 'publishedDate',
type: 'date',
admin: {
position: 'sidebar',
},
},
],
}
export default Posts; |
I implemented a workaround in a separate plugin that moves all |
@qbeauperin you are spot on here, I just opened PR #47 with the fix. I've also updated the README and any relevant code with notes explaining exactly what If your collection is not already tab-enabled, meaning the first field in your config is not of type THANK YOU everyone for your patience on this. It looks like we've had a handle of others waiting on this fix, too. I'll report back as soon as possible, as soon as a release has been published. |
Just shipped in |
Thanks @jacobsfletch! Just made the changes and they're working well 😌 |
The following logic doesn't account for fields that should end up in the sidebar:
plugin-seo/src/index.ts
Lines 82 to 98 in 348b519
The text was updated successfully, but these errors were encountered: