fix: able to edit and preview when we have no content #3726
Conversation
|
| style={{ | ||
| display: | ||
| !props.builderContextSignal.value.content && | ||
| (isPreviewing() || isEditing()) |
There was a problem hiding this comment.
should this be?
style={(isEditing() || isPreviewing() || props.builderContextSignal.value.content)
? {}
: { display: 'none' }}
There was a problem hiding this comment.
because we have custom event listeners on the div ref that enable visual editing, we want to visually hide this wrapper div in editing/preview if content is empty, but still render it. if we don't hide it it might break customer layouts because it'll be an empty div with no content.
so:
- content exists: render div and
display: undefined - content does not exist but isEditing/isPreviewing: render div and
display: 'none'- once inline editing kicks in, it will populate the content and re-render, so
displaystyle will be removed
- once inline editing kicks in, it will populate the content and re-render, so
your suggestion would display this div in the second case even if we never get content, which we want to avoid.
There was a problem hiding this comment.
having said all of that, this logic has a lot of booleans so it would be good to summarize the thought behind it in a comment @sidmohanty11
Description
Jira
https://builder-io.atlassian.net/browse/PLAN-338
Screenshot
If relevant, add a screenshot or two of the changes you made.