feat(cms): add schema for Section component (background, blur hash, children)

[Ur-imazing]

Resolves #145

Summary

Add Section section component schema with backgroundColor (enum: default, light, dark, primary), blurHash (string), and content dynamic zone. Register in Experience sections dynamic zone. Section content allows: media-collection, promo-banner, info-blocks, cta (text not on main yet; can be added when #144 merges). GraphQL schema and generated client updated.

Contracts Changed

• yes

Regeneration Required

• yes

Validation

• Contracts validated
• Generated code verified (no manual edits)
• Tests and build passed
• Terraform plan reviewed (if infra change)

Made with Cursor

Summary by CodeRabbit

• New Features
  • Added a new Section component to the CMS with selectable background colors (dark, default, light, primary) and optional blur support.
  • Sections can contain a mix of dynamic content types (media collections, promo banners, info blocks, CTAs, text, etc.) for flexible layout composition.
  • Experience pages now support placing Section components within their content zones for richer page building.

[coderabbitai]

Walkthrough

Adds a new CMS "Section" component with backgroundColor, blurHash, and a dynamic content zone; integrates it into the Experience content type and updates GraphQL and TypeScript schema declarations to expose the new component and related unions/inputs/enums.

Changes

Cohort / File(s)	Summary
CMS Component Definition apps/cms/src/components/sections/section.json	New Strapi component "Section" with backgroundColor enum, blurHash string, and content dynamic zone accepting media-collection, text, promo-banner, info-blocks, cta.
CMS Content Type Integration apps/cms/src/api/experience/content-types/experience/schema.json	Adds sections.section to the sections dynamic zone components array and fixes a missing comma in the JSON.
GraphQL Schema apps/cms/schema.graphql	Introduces ComponentSectionsSection type, ComponentSectionsSectionInput, ComponentSectionsSectionFiltersInput, ENUM_COMPONENTSECTIONSSECTION_BACKGROUNDCOLOR, SectionContentDynamicZone union and SectionContentDynamicZoneInput; extends ExperienceSectionsDynamicZone and GenericMorph unions to include the new Section and dynamic zone.
TypeScript GraphQL Declarations packages/graphql/src/graphql-env.d.ts	Adds corresponding TypeScript declarations for the new GraphQL types, inputs, union, and enum; updates union possibleTypes to include ComponentSectionsSection and SectionContentDynamicZone.

Estimated code review effort

🎯 3 (Moderate) | ⏱️ ~20 minutes

🚥 Pre-merge checks | ✅ 5

✅ Passed checks (5 passed)

Check name	Status	Explanation
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.
Title check	✅ Passed	The title accurately summarizes the main change: adding a Section component schema with background color, blur hash, and dynamic content (children).
Linked Issues check	✅ Passed	All acceptance criteria from #145 are met: Section schema added with backgroundColor enum, blurHash string, and dynamic zone for repeatable content; component registered in Experience dynamiczone; GraphQL schema regenerated.
Out of Scope Changes check	✅ Passed	All changes directly support the Section component schema requirements from #145 without introducing unrelated modifications to other features.
Docstring Coverage	✅ Passed	No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.

_{✏️ Tip: You can configure your own custom pre-merge checks in the settings.}

✨ Finishing Touches

• 📝 Generate docstrings (stacked PR)
• 📝 Generate docstrings (commit on current branch)

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Post copyable unit tests in a comment
• Commit unit tests in branch feat/145-section

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands and usage tips.}

[coderabbitai]

@Ur-imazing Sure! I'll kick off a review of PR #200 now.

✅ Actions performed

Review triggered.

Note: CodeRabbit is an incremental review system and does not re-review already reviewed commits. This command is applicable only when automatic reviews are paused.

[coderabbitai]

Actionable comments posted: 1

🤖 Prompt for all review comments with AI agents

Verify each finding against the current code and only fix it if needed.

Inline comments:
In `@apps/cms/schema.graphql`:
- Line 483: The new union member ComponentSectionsSection was added but not
handled in the renderer or requested in the watch query; update the
SectionRenderer function to add a case for "ComponentSectionsSection" (import
the corresponding React component or implement a renderer for that variant) so
the switch/if on section.__typename is exhaustive, and update the
GET_WATCH_EXPERIENCE GraphQL selection (used in GET_WATCH_EXPERIENCE in
content.ts) to include the ComponentSectionsSection fragment/fields so the data
shape matches what SectionRenderer expects; ensure types/imports are updated so
type-checking passes.

---

ℹ️ Review info

⚙️ Run configuration

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro

Run ID: 1a3bbb40-86c3-4022-9d07-4424d6a26301

📥 Commits

Reviewing files that changed from the base of the PR and between aa97cf5 and f364b81.

📒 Files selected for processing (4)

• apps/cms/schema.graphql
• apps/cms/src/api/experience/content-types/experience/schema.json
• apps/cms/src/components/sections/section.json
• packages/graphql/src/graphql-env.d.ts

🚧 Files skipped from review as they are similar to previous changes (2)

• apps/cms/src/api/experience/content-types/experience/schema.json
• apps/cms/src/components/sections/section.json

[Ur-imazing]

Re: CodeRabbit critical comment (#discussion_r2886577709)

CodeRabbit is correct that ComponentSectionsSection is now in the ExperienceSectionsDynamicZone union but is not yet handled in the web app: SectionRenderer in apps/web/src/components/sections/index.tsx has no case for it, and GET_WATCH_EXPERIENCE in apps/web/src/lib/content.ts does not request the Section fragment.

We are not addressing this in this PR by design. This PR is scoped to CMS schema and codegen only, as specified in the parent epic #175 and issue #145 ("no web UI changes in this epic" / "Schema and codegen only; no web UI"). Web rendering and query updates for the Section component belong in Epic B (#176) or the related web issue #155 (feat(web): add Section component). Those will add the ComponentSectionsSection case to SectionRenderer and the corresponding fragment to GET_WATCH_EXPERIENCE.

Tracking: the critical finding will be actioned when the Section web component is implemented in a follow-up PR under #176/#155.