feat(cms-base-layer): improve feedback for unmapped CMS elements#2336
Open
Maciek Kucmus (mkucmus) wants to merge 7 commits intomainfrom
Open
feat(cms-base-layer): improve feedback for unmapped CMS elements#2336Maciek Kucmus (mkucmus) wants to merge 7 commits intomainfrom
Maciek Kucmus (mkucmus) wants to merge 7 commits intomainfrom
Conversation
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
Maciek Kucmus (mkucmus)
requested review from
Copilot and
somethings (lasomethingsomething)
Contributor
There was a problem hiding this comment.
Pull request overview
Improves developer experience when CMS elements/blocks are unmapped by rendering visible dev-mode placeholders with component name, docs link, and an AI prompt copy button. Also adds console warnings, a Nuxt DevTools tab, and new documentation.
Changes:
- Dev-mode placeholder component (
CmsNoComponent.vue) now shows component name, docs link, and "copy AI prompt" button instead of a plain error message CmsGenericElementandCmsGenericBlockrender the placeholder in dev mode with console warnings, and render empty div in production- New documentation page and sidebar/index updates for implementing missing CMS components
Reviewed changes
Copilot reviewed 8 out of 8 changed files in this pull request and generated 2 comments.
Show a summary per file
| File | Description |
|---|---|
CmsNoComponent.vue |
Redesigned placeholder with expected component name, docs link, and AI prompt copy button |
CmsGenericElement.vue |
Dev-mode console warning and placeholder rendering for missing elements |
CmsGenericBlock.vue |
Dev-mode console warning and placeholder rendering for missing blocks |
missing-component.md |
New step-by-step guide for implementing missing CMS components |
shopping-experiences.md |
Added CMS rendering workflow section explaining data-to-component mapping |
index.md |
Added link to new missing-component guide |
sidebar.ts |
Added sidebar entry for missing component page |
nuxt-module/src/index.ts |
Added "CMS Elements" tab to Nuxt DevTools |
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
packages/cms-base-layer/app/components/public/cms/CmsNoComponent.vue
Outdated
Show resolved
Hide resolved
packages/cms-base-layer/app/components/public/cms/CmsNoComponent.vue
Outdated
Show resolved
Hide resolved
…//github.com/shopware/frontends into feat/cms-documentation-for-unmapped-elements
Contributor
Author
|
I added a query param handler for missing component page in docs: 
thanks to this a developer knows exactly what to do. |
Contributor
There was a problem hiding this comment.
Pull request overview
Improves developer experience when Shopware CMS sections/blocks/elements can’t be resolved to Vue components by adding dev-only placeholders + warnings, surfacing related docs, and expanding documentation around the CMS rendering workflow.
Changes:
- Render a visible dev-mode placeholder (
CmsNoComponent) and log actionable console warnings when CMS components are missing. - Add a Nuxt DevTools “CMS Elements” tab and link new/updated CMS docs pages from navigation.
- Add a dedicated “missing component” docs guide and expand Shopping Experiences documentation with the CMS rendering workflow.
Reviewed changes
Copilot reviewed 8 out of 8 changed files in this pull request and generated 3 comments.
Show a summary per file
| File | Description |
|---|---|
| packages/nuxt-module/src/index.ts | Adds a Nuxt DevTools custom tab linking to CMS docs. |
| packages/cms-base-layer/app/components/public/cms/CmsNoComponent.vue | Introduces a richer dev placeholder UI with docs link and “copy AI prompt” behavior. |
| packages/cms-base-layer/app/components/public/cms/CmsGenericElement.vue | Switches missing-element handling to dev-only warnings + placeholder render. |
| packages/cms-base-layer/app/components/public/cms/CmsGenericBlock.vue | Switches missing-block handling to dev-only warnings + placeholder render. |
| apps/docs/src/getting-started/cms/missing-component.md | New step-by-step guide for implementing missing CMS components. |
| apps/docs/src/getting-started/cms/index.md | Adds the new “missing component” guide to CMS landing page references. |
| apps/docs/src/framework/shopping-experiences.md | Documents the CMS data → component resolution workflow and dev feedback behavior. |
| apps/docs/.vitepress/sidebar.ts | Adds the new guide to the docs sidebar navigation. |
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
Comment on lines
+50
to
+51
|
|
||
| const fileDir = computed(() => cmsType.value + '/') |
packages/cms-base-layer/app/components/public/cms/CmsNoComponent.vue
Outdated
Show resolved
Hide resolved
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
closes: #2329
Summary
Improves CMS rendering DX for developers working with unmapped CMS components:
missing-componentpage with a step-by-step implementation guide linked directly from the placeholder; expandedshopping-experiences.mdwith the CMS rendering workflowScreenshots
(removed one component for tests)