SeparatorRowRenderer renders <div> inside <tr>, causing invalid DOM nesting warning #28184

Issue Summary

SeparatorRowRenderer renders a <div> directly inside a <tr>, which violates valid HTML table structure rules. This results in a React validateDOMNesting warning in development and can potentially lead to hydration mismatches in SSR environments.

Steps to Reproduce

1. Run the project locally
2. Navigate to http://localhost:3000/bookings/upcoming
3. Open the browser console.

Actual Results

• React logs a validateDOMNesting warning
• Next.js overlay displays the error in development mode.
• The separator row renders with invalid DOM structure.

Expected Results

• SeparatorRowRenderer should render valid table structure.
• No validateDOMNesting warnings should appear in the console.

Technical details

• Next.js: 16.1.5 (Turbopack)
• React: 18.2.0
• Node.js: v22.22.0
• Yarn: 4.12.0
• Browser: Chrome (latest)

Evidence

• Next.js error overlay screenshots attached below.