Block Grid/List: Skip workspace modal for blocks with no properties

[Copilot]

When only one block type is available and it contains no content properties (only areas), the current implementation opens an empty workspace modal. This creates unnecessary friction in the UX flow.

Solution Implemented

The implementation checks contentTypeHasProperties from the block's structure before deciding whether to open the workspace modal:

• Observes when only one block type is allowed
• Waits for content types to load, then checks structure.contentTypeHasProperties
• Skips workspace modal and creates block immediately when no properties exist
• Opens workspace modal when properties exist (existing behavior)
• Defaults to opening modal if structure cannot be determined (safe fallback)

Changes Made

Block Grid (block-grid-entries.context.ts and block-grid-entries.element.ts)

• Added DEFAULT_BLOCK_HAS_PROPERTIES constant for safe default behavior
• Added #singleBlockTypeHasProperties state to track if single block type has properties
• Added #setupSingleBlockTypePropertyCheck() method with promise-based async handling and error recovery
• Modified getPathForCreateBlock() to return undefined when hasProperties === false (triggers inline creation)
• Added _allowedBlockTypes state to element to track available block types
• Added #createBlockInline() method that calls context.create() and context.insert() to create blocks directly
• Updated create button render methods with click handlers that:
  • Detect when path is undefined (block has no properties)
  • Prevent default navigation
  • Call #createBlockInline() to create the block immediately

Block List (property-editor-ui-block-list.element.ts)

• Added DEFAULT_BLOCK_HAS_PROPERTIES constant for safe default behavior
• Added _singleBlockTypeHasProperties state
• Updated block types observer to check structure's contentTypeHasProperties asynchronously
• Modified #getPathForCreateBlock() to return undefined when block has no properties (triggers inline creation)
• Updated create button click handler to create blocks inline when no properties exist or inline editing is enabled

Technical Details

• Uses promise .then() pattern instead of async callbacks to avoid race conditions
• Includes .catch() error handling for robust fallback behavior
• Maintains type safety with optional chaining
• Consistent implementation across both Block Grid and Block List editors
• Both implementations use the same pattern: return undefined path → detect in click handler → create inline via context methods

This provides a better UX by avoiding empty modals for blocks that only define areas, while maintaining backward compatibility.

---

💬 We'd love your input! Share your thoughts on Copilot coding agent in our 2 minute survey.

[nielslyngsoe]

@copilot yes please let me see how this looks in code.

[Copilot]

@copilot yes please let me see how this looks in code.

I've implemented the solution in commits 529913c, 4e8a040, and 33a0b23.

The implementation adds a check for contentTypeHasProperties from the block's structure before deciding whether to open the workspace modal:

Block Grid changes:

• When only one block type is allowed, waits for content types to load
• Checks if the block has properties via structure.contentTypeHasProperties
• If hasProperties === false, returns catalogue path without appending workspace modal
• Result: Block is created immediately without opening an empty modal

Block List changes:

• Similar logic with additional handling for inline editing mode
• When hasProperties === false, returns undefined to trigger inline creation
• Click handler creates block inline when no properties exist or inline mode is enabled

Both implementations include error handling and use a safe default (DEFAULT_BLOCK_HAS_PROPERTIES = true) to maintain backward compatibility.

The solution is ready for testing with blocks that have no properties (only areas).

[nielslyngsoe]

@copilot I dont think this works. It would need to call a method, when its not suppose to open a modal.

[Copilot]

You're absolutely right! I've fixed this in commit c318a42.

The Block Grid now properly creates blocks inline when they have no properties:

• Context returns undefined (not a catalogue path) when block has no properties
• Element detects undefined path and calls #createBlockInline() method
• Method uses context.create() and context.insert() to create the block directly
• Click handler prevents default navigation when path is undefined

This matches the Block List implementation where blocks are created inline without opening any modal.

[nielslyngsoe]

I'm not happy with this.