# Etapa 7B — Botón "volver" contextual en workspace

**Sprint:** 7
**Fecha:** 2026-07-07
**Alcance:** workspace header únicamente. Sin tocar LibraryPage, AuthContext, migraciones, ni lógica de simulación.

---

## Problema

Cuando un admin (platform_admin/member) abre el workspace de un proceso que pertenece a un cliente (org no-provider), no hay forma de volver a la vista de los procesos de ese cliente. El ícono de casa (🏠) lleva a la biblioteca general, pero pierde el contexto de qué cliente se estaba revisando.

El mismo problema aplica a client_editor: al entrar al workspace, no hay un back button visible.

---

## Comportamiento esperado

### Para admin (platform_admin / member)

Si el proceso tiene `org_id` asignado (proceso de un cliente):

```
← Solar Banco        [nombre del proceso]    [botones de acción]
```

El botón "← {org.name}" navega a `/library?org={org_id}`.

Si el proceso NO tiene `org_id` (proceso sin cliente asignado):

```
← Biblioteca        [nombre del proceso]    [botones de acción]
```

Navega a `/library`.

### Para client_editor / client_viewer

```
← Procesos        [nombre del proceso]    [botones de acción]
```

Navega a `/library`. (Para estos roles, `/library` ya muestra solo los procesos de su org.)

---

## Cambios en código

**ANTES de empezar:** leer el componente del header del workspace para entender la estructura actual del breadcrumb/navegación. También leer cómo el store o el componente accede a la información del proceso actual (nombre, org_id). Verificar si la información de `org_id` y `org_name` está disponible en el estado del proceso cargado.

### 1. Library route — soporte para query param `?org=<uuid>`

En `LibraryPage.tsx` (o el router de la biblioteca), agregar soporte para el query param `org`:

- Leer `org` de los query params con TanStack Router (`useSearch`)
- Si `org` está presente: al cargar la biblioteca, hacer scroll automático al grupo/cliente cuyo `org_id` coincide, o resaltarlo visualmente
- Si `org` no está presente: comportamiento actual sin cambios

**No es necesario filtrar la lista** — mostrar todos los clientes como siempre, pero posicionar la vista en el cliente relevante. Esto preserva el contexto sin ocultar información.

El scroll puede ser simple: `document.getElementById('org-{org_id}')?.scrollIntoView({ behavior: 'smooth', block: 'start' })` con un `useEffect` que se dispara cuando `org` está en los params y la lista cargó.

### 2. Workspace header — back button contextual

En el componente del workspace header (WorkspaceHeader, WorkspacePage, o donde esté el breadcrumb):

Agregar antes del separador `|` y del nombre del proceso un botón de navegación contextual:

```typescript
// Determinar destino del back button
const backHref = process.orgId
  ? `/library?org=${process.orgId}`
  : '/library'

const backLabel = process.orgName  // si está disponible en el store
  ?? (isClientRole ? 'Procesos' : 'Biblioteca')
```

**UI:** botón ghost pequeño con ícono de flecha izquierda (`ArrowLeft` de Lucide) + texto. Consistente con el estilo del header actual. Ejemplo:

```
[←] Solar Banco  |  Conciliaciones ATM  [editable]  •  ...
```

Si `process.orgName` no está disponible en el store actual, hay dos opciones:
a) Hacer un fetch adicional de la organización (simple: `supabase.from('organizations').select('name').eq('id', orgId).single()`) al cargar el workspace
b) O usar solo el botón sin nombre ("← Volver") y el admin sabrá dónde lo lleva

**Preferir opción (a)** si el costo de implementación es bajo (un SELECT adicional en el store de workspace). Si es complejo, usar (b) y registrar como mejora en BACKLOG.md.

---

## Tests

```typescript
// Mínimo:

// 1. Back button muestra texto correcto para admin con proceso de cliente
//    (mock: process.orgId = 'some-uuid', process.orgName = 'Solar Banco')
//    → expect button text to contain 'Solar Banco' o 'Volver'
//    → expect link href to contain '/library?org=some-uuid'

// 2. Back button muestra "Biblioteca" para admin con proceso sin org
//    (mock: process.orgId = null)
//    → expect href = '/library'

// 3. Back button muestra "Procesos" para client_editor
//    (mock: isClientRole = true)
//    → expect href = '/library'
```

---

## Criterios de validación

- [ ] Admin en workspace de proceso con cliente → ve "← [nombre del cliente]" en el header
- [ ] Click en ese botón → navega a `/library?org=<uuid>` → biblioteca hace scroll al cliente correspondiente
- [ ] Admin en workspace de proceso sin cliente asignado → ve "← Biblioteca"
- [ ] client_editor en workspace → ve "← Procesos"
- [ ] El botón no aparece más de una vez, no rompe el layout del header
- [ ] `npm run test` → tests verdes
- [ ] `npm run build` limpio
- [ ] **Validación visual del director antes del OK formal**

---

## NO modificar

- Edge Functions
- Migraciones
- Lógica de simulación, ROI, PDF, CSV
- `ConfirmInvitePage`, `AdminPage`, `ReportPage`
- `AuthContext` (cubierto en Etapa 7)