fix: slots qa part 2

[benlife5]

Fixes:

• timestamp in testimonials
• missing hero and core info tests
• embedded string field styling
• hero mobile alignment

[github-actions]

Warning: Component files have been updated but no migrations have been added. See https://github.com/yext/visual-editor/blob/main/packages/visual-editor/src/components/migrations/README.md for more information.

[coderabbitai]

Walkthrough

This pull request consolidates several updates across the visual editor package, focusing on type safety, data structure enhancements, and styling refinements. Key changes include: adding type satisfies annotations to CoreInfoSection slot definitions to enforce public prop contracts; extending Timestamp slot configurations in testimonial and contribution date contexts to support an endDate field with updated styling flags; adding alignment properties to hours-related styling; refactoring test data in HeroSection to reduce duplication; converting inline style props to responsive className-based sizing in CTA components; and adjusting input field padding and button positioning in the embedded field string input editor.

Suggested reviewers

• mkilpatrick
• colton-demetriou
• asanehisa

Pre-merge checks and finishing touches

❌ Failed checks (1 inconclusive)

Check name	Status	Explanation	Resolution
Title check	❓ Inconclusive	The title 'fix: slots qa part 2' is vague and generic, using non-descriptive terms that don't convey meaningful information about the specific changes made.	Consider a more specific title that highlights the main changes, such as 'fix: testimonial timestamps, test coverage, and styling adjustments' or similar.

✅ Passed checks (1 passed)

Check name	Status	Explanation
Description check	✅ Passed	The description lists specific fixes related to the changeset (timestamps, tests, styling, alignment) and is directly related to the files modified.

✨ Finishing touches

• 📝 Generate docstrings

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Post copyable unit tests in a comment
• Commit unit tests in branch qa-fixes-2

---

📜 Recent review details

Configuration used: CodeRabbit UI

Review profile: CHILL

Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between 885a26a and acdf136.

📒 Files selected for processing (8)

• packages/visual-editor/src/components/migrations/0026_core_info_section_slots.ts (1 hunks)
• packages/visual-editor/src/components/migrations/0036_testimonials_section_slots.ts (2 hunks)
• packages/visual-editor/src/components/pageSections/CoreInfoSection.test.tsx (1 hunks)
• packages/visual-editor/src/components/pageSections/CoreInfoSection.tsx (9 hunks)
• packages/visual-editor/src/components/pageSections/HeroSection.test.tsx (7 hunks)
• packages/visual-editor/src/components/pageSections/TestimonialSection/TestimonialCard.tsx (3 hunks)
• packages/visual-editor/src/components/pageSections/heroVariants/HeroContent.tsx (1 hunks)
• packages/visual-editor/src/editor/EmbeddedFieldStringInput.tsx (2 hunks)

🧰 Additional context used

🧬 Code graph analysis (3)

packages/visual-editor/src/components/pageSections/HeroSection.test.tsx (1)

packages/visual-editor/src/components/testing/componentTests.setup.ts (1)

• testHours (163-220)

packages/visual-editor/src/components/pageSections/CoreInfoSection.test.tsx (1)

packages/visual-editor/src/components/testing/componentTests.setup.ts (1)

• testHours (163-220)

packages/visual-editor/src/components/pageSections/CoreInfoSection.tsx (6)

packages/visual-editor/src/components/contentBlocks/HeadingText.tsx (1)

• HeadingTextProps (19-40)

packages/visual-editor/src/components/contentBlocks/Address.tsx (1)

• AddressProps (21-39)

packages/visual-editor/src/components/contentBlocks/PhoneList.tsx (1)

• PhoneListProps (21-26)

packages/visual-editor/src/components/contentBlocks/Emails.tsx (1)

• EmailsProps (17-24)

packages/visual-editor/src/components/contentBlocks/HoursTable.tsx (1)

• HoursTableProps (17-35)

packages/visual-editor/src/components/contentBlocks/TextList.tsx (1)

• TextListProps (14-16)

⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (3)

• GitHub Check: call_unit_test / unit_tests (20.x)
• GitHub Check: call_unit_test / unit_tests (18.x)
• GitHub Check: semgrep/ci

🔇 Additional comments (10)

packages/visual-editor/src/editor/EmbeddedFieldStringInput.tsx (1)

111-111: LGTM! Input field styling refinements.

The updated padding and hover states improve the visual consistency and user experience. The button position adjustment at Line 120 correctly aligns with the new input padding.

Also applies to: 120-120

packages/visual-editor/src/components/pageSections/HeroSection.test.tsx (2)

20-48: Excellent refactoring to centralize test data.

Introducing the testDocument constant significantly reduces duplication across test cases and improves maintainability. This makes it easier to update test data in the future.

---

948-2206: Comprehensive test coverage for version 30 props.

The new test cases for version 30 provide thorough coverage across all hero variants (classic, immersive, spotlight, compact) with both entity values and constant values. This aligns well with the slot-based architecture updates.

packages/visual-editor/src/components/pageSections/heroVariants/HeroContent.tsx (1)

69-82: LGTM! Improved responsive CTA sizing.

The migration from inline style props to className-based responsive sizing (sm:w-fit w-full h-auto) provides better mobile-first responsive behavior. The addition of sm:items-center enhances small-screen alignment consistency.

packages/visual-editor/src/components/migrations/0026_core_info_section_slots.ts (1)

79-79: LGTM! Sensible default alignment for hours table.

Adding alignment: "items-start" as the default for the hours table is a good choice that provides consistent left-alignment behavior. This aligns with the HoursTableProps type definition.

packages/visual-editor/src/components/pageSections/CoreInfoSection.test.tsx (1)

772-925: Comprehensive test coverage for version 26 slot props.

This new test case provides thorough validation of the slot-based architecture with mixed values across all configured slots. The inclusion of alignment: "items-start" in the HoursTableSlot aligns with the migration defaults.

packages/visual-editor/src/components/migrations/0036_testimonials_section_slots.ts (1)

12-12: LGTM! Timestamp props extended for date range support.

The addition of the endDate field and explicit includeRange/includeTime styling flags enhance the Timestamp functionality. The type assertion to TimestampProps ensures type safety with the public interface.

Also applies to: 102-118

packages/visual-editor/src/components/pageSections/TestimonialSection/TestimonialCard.tsx (1)

36-36: LGTM! Timestamp configuration aligned with TimestampProps.

The update to ISO date format (2022-07-22T00:00) and the addition of the endDate field properly align with the TimestampProps interface. The explicit styling flags (includeTime: false, includeRange: false) improve clarity.

Also applies to: 99-109

packages/visual-editor/src/components/pageSections/CoreInfoSection.tsx (2)

15-24: Excellent addition of public type imports.

Importing the public prop types (HeadingTextProps, HoursTableProps, TextListProps, EmailsProps, AddressProps, PhoneListProps) enables explicit type-satisfies annotations for all slots, improving type safety and API contract enforcement.

---

212-212: Strong type safety with satisfies annotations.

The satisfies type assertions on all slot props provide compile-time guarantees that the default props match the public interfaces. This is particularly valuable for:

• Catching type mismatches early
• Documenting the expected prop structure
• Ensuring API consistency across slots

The inclusion of alignment: "items-start" at Line 310 correctly satisfies the HoursTableProps requirement.

Also applies to: 234-234, 259-259, 275-275, 293-293, 312-312, 330-330, 341-341

---

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