87fa0e4c12
## Context
When navigating between the app and settings sections,
MainAppLayoutOutlet keeps the outgoing page mounted during the
AnimatePresence exit transition, and can leave a stale exit node behind
the active page, notably when the page hosts an app front component
whose Web Worker teardown blocks React from removing it.
The leftover page is invisible (opacity 0) but still captures pointer
events on top of the active route, so e.g. front-component buttons stay
clickable through the settings screen.
The existing `exit={{ pointerEvents: 'none' }}` mitigation is defeated
by descendants that set pointer-events explicitly (the front-component
container uses pointer-events: auto). Tag each transition page with its
route section and mark every non-active one `inert`, which descendants
cannot override, so any stale page is fully non-interactive.
<!-- This is an auto-generated description by cubic. -->
<a
href="https://cubic.dev/pr/twentyhq/twenty/pull/22328?utm_source=github"
target="_blank" rel="noopener noreferrer"
data-no-image-dialog="true"><picture><source
media="(prefers-color-scheme: dark)"
srcset="https://www.cubic.dev/buttons/review-in-cubic-dark.svg"><source
media="(prefers-color-scheme: light)"
srcset="https://www.cubic.dev/buttons/review-in-cubic-light.svg"><img
alt="Review in cubic"
src="https://www.cubic.dev/buttons/review-in-cubic-dark.svg"></picture></a>
<!-- End of auto-generated description by cubic. -->
Run yarn dev while server running on port 3000