ENT-11639: Add testimonials to all plans - updated AcademicSelection …

[gshivajibiradar]

Summary
This PR implements ENT-11639 by adding the testimonials component across all plans in the checkout flow.

Changes
Updated AcademicSelection component
Integrated testimonials section for all plans
Ensured consistent UI across Essentials and other plan flows
Improved layout and user experience

Dependency
Dependent on ENT-11423 (plan details implementation)

Testing
Verified testimonials display correctly across all plans
Checked UI responsiveness and alignment
Ensured no impact on existing checkout flow

Next Steps
Ready for review once dependent ticket is merged
Will proceed with final validation after integration

[codecov]

Codecov Report

✅ All modified and coverable lines are covered by tests.
✅ Project coverage is 87.23%. Comparing base (5acd6ec) to head (61084c9).
⚠️ Report is 10 commits behind head on main.

Additional details and impacted files

@@            Coverage Diff             @@
##             main     #160      +/-   ##
==========================================
+ Coverage   86.99%   87.23%   +0.24%     
==========================================
  Files         153      153              
  Lines        2799     2868      +69     
  Branches      526      559      +33     
==========================================
+ Hits         2435     2502      +67     
- Misses        364      366       +2     

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

🚀 New features to boost your workflow:

• ❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.
• 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.

[Copilot]

Pull request overview

Implements ENT-11639 by extending the Essentials “AcademicSelection” page layout to include the shared purchase summary area (which contains the testimonial card), aligning the Essentials flow UI with the main checkout layout.

Changes:

• Updated AcademicSelection to a two-column Row/Col layout.
• Added PurchaseSummary to the right column so testimonials/purchase summary appear in the Essentials flow.
• Adjusted container padding to match other checkout pages (py-4.5).

---

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

[Copilot]

Pull request overview

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

---

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

[brobro10000]

Please reference the figma design for implementation. Approving to unblock

[Copilot]

Pull request overview

Copilot reviewed 18 out of 18 changed files in this pull request and generated 3 comments.

Comments suppressed due to low confidence (1)

src/components/app/data/hooks/useTestimonials.tsx:49

• fetchTestimonials changes behavior based on whether getAuthenticatedUser() returns a session, but the React Query queryKey is always ['testimonials'] and staleTime is Infinity. If the query runs while unauthenticated (returning fallbacks) and the user later authenticates during the flow, the cached fallback data will never be refetched. Consider including an auth discriminator (e.g., user ID / boolean) in the queryKey and/or allowing refetch on auth changes instead of using staleTime: Infinity unconditionally.

export const fetchTestimonials = async (): Promise<Testimonial[]> => {
  const { ENTERPRISE_ACCESS_BASE_URL } = getConfig();
  const url = `${ENTERPRISE_ACCESS_BASE_URL}/api/v1/testimonials/`;
  try {
    // Use authenticated client when a JWT is available (account-details, billing-details)
    // Fall back to plain axios for unauthenticated steps (plan-details/register, plan-details/login)
    const user = getAuthenticatedUser();
    const res = user
      ? await getAuthenticatedHttpClient().get(url)
      : await axios.get(url);
    return res.data?.results?.length ? res.data.results : DEFAULT_TESTIMONIALS;
  } catch {
    return DEFAULT_TESTIMONIALS;
  }
};

const useTestimonials = () => useQuery({
  queryKey: ['testimonials'],
  queryFn: fetchTestimonials,
  staleTime: Infinity,
});

---

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

[Copilot]

planDetailsLoader now requires a RouteContext parameter, but RouteContext is not imported/defined in this file and the extra required parameter makes the function incompatible with how PAGE_LOADERS is typed/called (it is invoked with only queryClient). Consider reverting this loader to a single-argument signature (e.g., (queryClient: QueryClient)) and remove the unused RouteContext parameter (or make it optional and correctly imported if you truly need it).

Suggested change

	// eslint-disable-next-line @typescript-eslint/no-unused-vars
	async function planDetailsLoader(_queryClient: QueryClient, _routeContext: RouteContext): Promise<Response | null> {
	async function planDetailsLoader(_queryClient: QueryClient): Promise<Response | null> {

[Copilot]

planDetailsLoginLoader declares a routeContext: RouteContext argument that is unused, and RouteContext is not imported/defined in this module. This will fail type-checking/linting. If the context isn’t needed here, drop the parameter entirely (or prefix with _ and import the type if it is needed).

[Copilot]

This test name claims to verify the “no repeat until all have been shown” behavior, but the assertions only check that the first rendered quote is one of the provided testimonials. Either extend the test to navigate/rerender across multiple steps (or rerun the selection logic) and assert no duplicates until the list is exhausted, or rename the test to match what it actually verifies.