builder
builder copied to clipboard
Custom component with many localized fields freezes entire Builder editor and throws many errors in console
Describe the bug Custom component with many localized fields freezes entire Builder editor and throws many errors in console. The more localized fields the bigger frezee and lags occur.
To Reproduce You can clone the repo from here: https://github.com/mimoid-prog/svelte-kit-builder-localized-error
Steps to reproduce the behavior:
- Create custom component, define many fields with
localized: true
, register this component - Put component on the page
- Try to edit it's properties
- Entire Builder editor freezes, you can't click nothing, console is full of errors
Expected behavior Properties should be available to edit instantly, there should not be errors in console.
Screenshots Video:
https://github.com/BuilderIO/builder/assets/55198084/c5c17535-bfdb-434b-b890-ea85b996aaf3
Additional context Node.js - 20.9.0
@mimoid-prog We made a fix for the specific issue you shared a screenshot of.
However, another issue persists. It is specifically tied to the Content Input favoriteTechStack
being a localized list. We are actively investigating this and will follow up with you.
I want to point out that you are setting localized: true
to both the list and all of its internal individual fields. That is unusual, as you would usually either want to localize the entire array, or the individual objects within, but not both.
If you remove the localized
key from the parent list:
{
name: 'favoriteTechStack',
type: 'list',
defaultValue: [
{
name: 'Svelte',
description: 'A compiler for building user interfaces.'
}
],
- localized: true,
subFields: [
{
name: 'name',
type: 'text',
defaultValue: 'Svelte',
localized: true
},
{
name: 'description',
type: 'text',
defaultValue: 'A compiler for building user interfaces.',
localized: true
}
]
}
Then your example now works and no longer freezes. Would that be satisfactory in unblocking you? If not: what need do you have for localizing the entire array?