refactor(atomic): Migrate SmartSnippet functional components

[Copilot]

• Fixes Migrate SmartSnippet functional components #6351

---

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

[alexprudhomme]

@copilot retry this please !

[Copilot]

Pull Request Overview

This PR migrates SmartSnippet functional components from Stencil to Lit, establishing a clear migration path by creating new Lit implementations while preserving the legacy Stencil versions with deprecation markers.

Key Changes:

• Created Lit-based functional components following established patterns (render* naming, FunctionalComponent types)
• Renamed legacy Stencil components with stencil- prefix and added deprecation markers
• Added comprehensive test coverage for all new Lit components
• Updated imports in consuming Stencil components to reference the renamed legacy versions

Reviewed Changes

Copilot reviewed 12 out of 14 changed files in this pull request and generated 2 comments.

Show a summary per file

File	Description
atomic-smart-snippet.tsx	Updated imports to use stencil- prefixed legacy components
atomic-insight-smart-snippet.tsx	Updated imports to use stencil- prefixed legacy components
stencil-smart-snippet-feedback-banner.tsx	Renamed legacy Stencil feedback banner with deprecation marker
smart-snippet-feedback-banner.ts	New Lit implementation of feedback banner functional component
smart-snippet-feedback-banner.spec.ts	Comprehensive test coverage for Lit feedback banner (251 test cases)
stencil-smart-snippet-common.tsx	Renamed legacy Stencil common components with deprecation markers
snippet-wrapper.ts	New Lit wrapper component for smart snippets
snippet-wrapper.spec.ts	Test coverage for wrapper component
snippet-question.ts	New Lit question heading component
snippet-question.spec.ts	Test coverage for question component
snippet-truncated-answer.ts	New Lit truncated answer component
snippet-truncated-answer.spec.ts	Test coverage for truncated answer component
snippet-footer.ts	New Lit footer component
snippet-footer.spec.ts	Test coverage for footer component

---

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

[Copilot]

The container element is appended to document.body in beforeEach but never removed in an afterEach. This could cause memory leaks and test pollution. Add cleanup:

afterEach(() => {
  document.body.removeChild(container);
});

Suggested change

	afterEach(() => {
	if (container && container.parentNode === document.body) {
	document.body.removeChild(container);
	}
	});

[louis-bompart]

Fair catch. @alexprudhomme if you don't use the render fixture, you have to own the clean up ;)

[Copilot]

[nitpick] The common classes 'flex items-center gap-x-1.5' are duplicated in both branches of the ternary. Consider using the classMap directive or separating common classes to improve maintainability:

class="flex items-center gap-x-1.5 ${props.liked ? 'text-success' : 'cursor-pointer hover:underline'}"

Or using classMap:

class=${classMap({
  'flex': true,
  'items-center': true,
  'gap-x-1.5': true,
  'text-success': props.liked,
  'cursor-pointer': !props.liked,
  'hover:underline': !props.liked,
})}

The same applies to the dislike button classes on lines 58-62.

[jmazzah-coveo]

why are there new components with this migration? i don't see them used anywhere. like snippet-footer, snippet-question, etc? will we need them in the future?