fix(app): avoid nested session loading frames

packages/app/src/session/route.tsx

@@ -87,19 +87,24 @@ function ResolvedTargetSessionRoute() {
         </SessionRouteFrame>
       }
     >
-      <SessionRouteFrame padded passthrough={!!directory()}>
-        <SessionPanelFrame raised passthrough={!!directory()}>
-          <Show when={directory()}>
-            {(value) => (
+      <div class="relative size-full">
+        <div class="absolute inset-0" classList={{ invisible: !!directory() }}>
+          <SessionRouteFrame padded>
+            <SessionPanelFrame raised />
+          </SessionRouteFrame>
+        </div>
+        <Show when={directory()}>
+          {(value) => (
+            <div class="absolute inset-0">
               <LocationProvider directory={value()}>
                 <SessionUIProvider directory={value()} server={server.key}>
                   <TargetSessionPage />
                 </SessionUIProvider>
               </LocationProvider>
-            )}
-          </Show>
-        </SessionPanelFrame>
-      </SessionRouteFrame>
+            </div>
+          )}
+        </Show>
+      </div>
     </Show>
   )
 }

packages/app/src/session/session-frame.tsx

@@ -1,26 +1,19 @@
 import type { ParentProps } from "solid-js"
 
-export function SessionRouteFrame(props: ParentProps<{ padded?: boolean; passthrough?: boolean }>) {
+export function SessionRouteFrame(props: ParentProps<{ padded?: boolean }>) {
   return (
-    <div
-      classList={{
-        contents: props.passthrough,
-        "relative flex size-full flex-col overflow-hidden": !props.passthrough,
-        "p-2": props.padded && !props.passthrough,
-      }}
-    >
+    <div class="relative flex size-full flex-col overflow-hidden" classList={{ "p-2": props.padded }}>
       {props.children}
     </div>
   )
 }
 
-export function SessionPanelFrame(props: ParentProps<{ raised?: boolean; passthrough?: boolean }>) {
+export function SessionPanelFrame(props: ParentProps<{ raised?: boolean }>) {
   return (
     <div
+      class="flex min-h-0 flex-1 flex-col overflow-hidden rounded-[10px] bg-v2-background-bg-base"
       classList={{
-        contents: props.passthrough,
-        "flex min-h-0 flex-1 flex-col overflow-hidden rounded-[10px] bg-v2-background-bg-base": !props.passthrough,
-        "shadow-[var(--v2-elevation-raised)]": props.raised && !props.passthrough,
+        "shadow-[var(--v2-elevation-raised)]": props.raised,
       }}
     >
       {props.children}