@asteby/metacore-runtime-react 46.4.0 → 47.1.0

package/src/__tests__/business-pickers.test.tsx

@@ -0,0 +1,157 @@
+// @vitest-environment happy-dom
+// #1025 VehiclePicker, #1026 RelateDocuments, #1027 PrintSendDialog.
+import { afterEach, describe, expect, it, vi } from 'vitest'
+import { cleanup, fireEvent, render, screen, waitFor } from '@testing-library/react'
+
+vi.mock('react-i18next', () => ({
+    useTranslation: () => ({ t: (k: string, o?: any) => o?.defaultValue ?? k, i18n: { language: 'es' } }),
+}))
+
+import { VehiclePicker, type VehicleResult } from '../business/vehicle-picker'
+import { RelateDocuments, serializeRelatedDocuments, type RelatedDocument } from '../business/relate-documents'
+import { PrintSendDialog } from '../business/print-send-dialog'
+import { PermissionsProvider } from '../permissions-context'
+import { ApiProvider, type ApiClient } from '../api-context'
+import { BUSINESS_COMPONENTS } from '../business/catalog'
+import * as runtime from '../index'
+
+afterEach(cleanup)
+
+const apiStub = (): ApiClient =>
+    ({
+        get: vi.fn().mockResolvedValue({ data: {} }),
+        post: vi.fn().mockResolvedValue({ data: { data: { id: 'v9', plate: 'NEW-001', vin: 'VIN9' } } }),
+        put: vi.fn(),
+        delete: vi.fn(),
+    }) as unknown as ApiClient
+
+describe('exports', () => {
+    it('se exportan desde el runtime y están en el catálogo', () => {
+        expect(runtime.VehiclePicker).toBeTypeOf('function')
+        expect(runtime.RelateDocuments).toBeTypeOf('function')
+        expect(runtime.PrintSendDialog).toBeTypeOf('function')
+        const names = BUSINESS_COMPONENTS.map((c) => c.name)
+        expect(names).toEqual(expect.arrayContaining(['VehiclePicker', 'RelateDocuments', 'PrintSendDialog']))
+    })
+})
+
+describe('VehiclePicker', () => {
+    const veh: VehicleResult = { id: 'v1', plate: 'ABC-123', vin: '1HGCM82633A004352', make: 'Nissan', model: 'Versa', year: 2019 }
+
+    it('busca por placa o VIN y elige el resultado', async () => {
+        const search = vi.fn().mockResolvedValue([veh])
+        const onChange = vi.fn()
+        render(
+            <ApiProvider client={apiStub()}>
+                <VehiclePicker value={null} onChange={onChange} search={search} />
+            </ApiProvider>,
+        )
+        fireEvent.change(screen.getByPlaceholderText('Placa o VIN'), { target: { value: 'ABC' } })
+        const opt = await screen.findByRole('option')
+        expect(search.mock.calls[0][0]).toBe('ABC')
+        fireEvent.click(opt.querySelector('button')!)
+        expect(onChange).toHaveBeenCalledWith(veh)
+    })
+
+    it('muestra el vehículo elegido y permite quitarlo', () => {
+        const onChange = vi.fn()
+        render(
+            <ApiProvider client={apiStub()}>
+                <VehiclePicker value={veh} onChange={onChange} search={vi.fn()} />
+            </ApiProvider>,
+        )
+        expect(screen.getByText('ABC-123')).toBeTruthy()
+        fireEvent.click(screen.getByRole('button', { name: 'Quitar vehículo' }))
+        expect(onChange).toHaveBeenCalledWith(null)
+    })
+
+    it('alta rápida: sin PermissionsProvider ofrece crear; con permiso denegado, no', () => {
+        const { unmount } = render(
+            <ApiProvider client={apiStub()}>
+                <VehiclePicker value={null} onChange={vi.fn()} search={vi.fn()} />
+            </ApiProvider>,
+        )
+        expect(screen.getByRole('button', { name: 'Nuevo vehículo' })).toBeTruthy()
+        unmount()
+        render(
+            <ApiProvider client={apiStub()}>
+                <PermissionsProvider permissions={[]} isAdmin={false}>
+                    <VehiclePicker value={null} onChange={vi.fn()} search={vi.fn()} />
+                </PermissionsProvider>
+            </ApiProvider>,
+        )
+        expect(screen.queryByRole('button', { name: 'Nuevo vehículo' })).toBeNull()
+    })
+})
+
+describe('RelateDocuments', () => {
+    const types = [
+        { value: '01', label: 'Nota de crédito' },
+        { value: '04', label: 'Sustitución' },
+    ]
+
+    it('agrega varios documentos con tipo de relación y serializa solo datos', async () => {
+        const search = vi.fn().mockResolvedValue([
+            { id: 'd1', uuid: 'UUID-1', folio: 'A-1' },
+            { id: 'd2', uuid: 'UUID-2', folio: 'A-2' },
+        ])
+        let value: RelatedDocument[] = []
+        const onChange = vi.fn((v: RelatedDocument[]) => {
+            value = v
+        })
+        const { rerender } = render(<RelateDocuments value={value} onChange={onChange} relationTypes={types} search={search} />)
+        fireEvent.change(screen.getByPlaceholderText('Buscar por folio o UUID'), { target: { value: 'A-' } })
+        const list = await screen.findByRole('listbox')
+        fireEvent.click(list.querySelectorAll('button')[0])
+        expect(onChange).toHaveBeenLastCalledWith([
+            expect.objectContaining({ related_document_id: 'd1', relation_type: '01', uuid: 'UUID-1', folio: 'A-1' }),
+        ])
+        rerender(<RelateDocuments value={value} onChange={onChange} relationTypes={types} search={search} />)
+        expect(screen.getAllByText('UUID-1').length).toBeGreaterThan(0)
+        // Cambiar el tipo de la relación existente.
+        fireEvent.change(screen.getByLabelText('Tipo de relación'), { target: { value: '04' } })
+        expect(onChange.mock.lastCall![0][0].relation_type).toBe('04')
+        expect(serializeRelatedDocuments(value)).toEqual([{ related_document_id: 'd1', relation_type: '04' }])
+    })
+
+    it('respeta max y no duplica', () => {
+        const value: RelatedDocument[] = [{ related_document_id: 'd1', relation_type: '01' }]
+        render(<RelateDocuments value={value} onChange={vi.fn()} relationTypes={types} search={vi.fn()} max={1} />)
+        expect(screen.queryByPlaceholderText('Buscar por folio o UUID')).toBeNull()
+    })
+})
+
+describe('PrintSendDialog', () => {
+    const doc = { folio: 'COT-0004', title: 'Cotización', pdfUrl: 'https://files.example/c.pdf', email: 'a@b.mx', phone: '5550001' }
+
+    it('imprimir abre la URL de PDF del host', () => {
+        const open = vi.spyOn(window, 'open').mockReturnValue(null)
+        render(<PrintSendDialog open onOpenChange={vi.fn()} document={doc} />)
+        fireEvent.click(screen.getByRole('button', { name: /Imprimir/ }))
+        expect(open).toHaveBeenCalledWith('https://files.example/c.pdf', '_blank', 'noopener,noreferrer')
+        open.mockRestore()
+    })
+
+    it('enviar llama onSend con canal y destino; no hay integración propia', async () => {
+        const onSend = vi.fn().mockResolvedValue(undefined)
+        render(<PrintSendDialog open onOpenChange={vi.fn()} document={doc} onSend={onSend} />)
+        expect((screen.getByLabelText('Destino') as HTMLInputElement).value).toBe('a@b.mx')
+        fireEvent.click(screen.getByRole('button', { name: /WhatsApp/ }))
+        await waitFor(() => expect((screen.getByLabelText('Destino') as HTMLInputElement).value).toBe('5550001'))
+        fireEvent.click(screen.getByRole('button', { name: 'Enviar' }))
+        await waitFor(() => expect(onSend).toHaveBeenCalledWith('whatsapp', '5550001', doc))
+        expect(await screen.findByText('Enviado.')).toBeTruthy()
+    })
+
+    it('un fallo de onSend se muestra en el diálogo', async () => {
+        const onSend = vi.fn().mockRejectedValue(new Error('Proveedor caído'))
+        render(<PrintSendDialog open onOpenChange={vi.fn()} document={doc} onSend={onSend} />)
+        fireEvent.click(screen.getByRole('button', { name: 'Enviar' }))
+        expect((await screen.findByRole('alert')).textContent).toContain('Proveedor caído')
+    })
+
+    it('sin onSend solo ofrece imprimir', () => {
+        render(<PrintSendDialog open onOpenChange={vi.fn()} document={doc} />)
+        expect(screen.queryByRole('button', { name: 'Enviar' })).toBeNull()
+    })
+})

package/src/__tests__/dependent-options.test.tsx

@@ -9,7 +9,7 @@
 //     header field is empty, and once the header field has a value the options
 //     request carries that value as `filter_value` and re-fetches on change.
 import { afterEach, describe, expect, it, vi } from 'vitest'
-import { act, cleanup, render, screen, waitFor } from '@testing-library/react'
+import { act, cleanup, render, screen, waitFor, within } from '@testing-library/react'
 
 // Identity translator so any raw i18n keys surface verbatim.
 vi.mock('react-i18next', () => ({
@@ -194,6 +194,10 @@ function LineItemsHost({ headerValue }: { headerValue: string }) {
     )
 }
 
+// The editor renders a mobile card list AND a desktop table (CSS picks one), so
+// scope queries to the table to hit a single picker.
+const tableCombobox = () => within(document.querySelector('table') as HTMLElement).getByRole('combobox')
+
 describe('DynamicLineItems cascading cell', () => {
     it('disables the picker while the header field is empty', () => {
         const get = vi.fn(async () => ({
@@ -206,7 +210,7 @@ describe('DynamicLineItems cascading cell', () => {
             </ApiProvider>,
         )
         // The combobox trigger is disabled and shows the dependency hint.
-        const trigger = screen.getByRole('combobox')
+        const trigger = tableCombobox()
         expect((trigger as HTMLButtonElement).disabled).toBe(true)
         expect(trigger.getAttribute('data-depends-blocked')).toBe('')
         // No options request fires while blocked.
@@ -230,7 +234,7 @@ describe('DynamicLineItems cascading cell', () => {
         )
 
         // Open the popover so the typeahead fetches.
-        const trigger = screen.getByRole('combobox')
+        const trigger = tableCombobox()
         expect((trigger as HTMLButtonElement).disabled).toBe(false)
         await act(async () => {
             trigger.click()
@@ -300,7 +304,10 @@ describe('DynamicLineItems cell with optionsConfig.source', () => {
                 meta: { type: 'dynamic', count: 1 },
             },
         }))
-        const client = { get } as unknown as ApiClient
+        // `/options/<model>` lookups try the batched `/q` endpoint first; a client
+        // whose batch endpoint is unavailable falls back to the plain GET asserted here.
+        const post = vi.fn(async () => ({ data: { success: false } }))
+        const client = { get, post } as unknown as ApiClient
 
         const { rerender } = render(
             <ApiProvider client={client}>
@@ -308,7 +315,7 @@ describe('DynamicLineItems cell with optionsConfig.source', () => {
             </ApiProvider>,
         )
 
-        const trigger = screen.getByRole('combobox')
+        const trigger = tableCombobox()
         expect((trigger as HTMLButtonElement).disabled).toBe(false)
         await act(async () => {
             trigger.click()

package/src/__tests__/document-form-dialog.test.tsx

@@ -0,0 +1,190 @@
+// @vitest-environment happy-dom
+// FAC-12 (#1022): alta guiada por tipo de documento.
+import { afterEach, describe, expect, it, vi } from 'vitest'
+import { cleanup, fireEvent, render, screen, waitFor } from '@testing-library/react'
+
+vi.mock('@tanstack/react-router', () => ({ useNavigate: () => () => {} }))
+vi.mock('react-i18next', () => {
+    // Stable references: a fresh `t` per render would retrigger effects that depend on it.
+    const i18n = { language: 'es' }
+    const t = (k: string, o?: { defaultValue?: string }) => o?.defaultValue ?? k
+    const value = { t, i18n }
+    return { useTranslation: () => value }
+})
+
+import { DocumentFormDialog, resolveDocumentForms } from '../document-form-dialog'
+import { DynamicCRUDPage } from '../dynamic-crud-page'
+import { useMetadataCache } from '../metadata-cache'
+import { ApiProvider, type ApiClient } from '../api-context'
+import type { DocumentFormsManifest } from '../types'
+
+afterEach(cleanup)
+
+const forms: DocumentFormsManifest = {
+    type_field: 'type',
+    types: [
+        {
+            key: 'invoice',
+            label: 'Factura',
+            description: 'Ingreso (I)',
+            value: 'I',
+            fields: [
+                { key: 'customer_name', label: 'Cliente', type: 'text', required: true },
+                { key: 'payment_method', label: 'Método de pago', type: 'text' },
+            ],
+            lines: { columns: ['tax'] },
+        },
+        {
+            key: 'credit_note',
+            label: 'Nota de crédito',
+            value: 'E',
+            fields: [
+                { key: 'customer_name', label: 'Cliente', type: 'text', required: true },
+                { key: 'origin_invoice', label: 'Factura origen', type: 'text', required: true },
+            ],
+        },
+    ],
+}
+
+function api(post: ApiClient['post']): ApiClient {
+    return { get: vi.fn().mockResolvedValue({ data: {} }), post, put: vi.fn(), delete: vi.fn() } as unknown as ApiClient
+}
+
+function setup(manifest: DocumentFormsManifest, post: ApiClient['post'] = vi.fn().mockResolvedValue({ data: { success: true, data: { id: '1' } } })) {
+    const onOpenChange = vi.fn()
+    const onSaved = vi.fn()
+    render(
+        <ApiProvider client={api(post)}>
+            <DocumentFormDialog open onOpenChange={onOpenChange} model="fiscal_documents" forms={manifest} onSaved={onSaved} />
+        </ApiProvider>,
+    )
+    return { post: post as ReturnType<typeof vi.fn>, onOpenChange, onSaved }
+}
+
+describe('DocumentFormDialog', () => {
+    it('con dos tipos muestra tarjetas; elegir «Nota de crédito» muestra sus campos y no los de factura', () => {
+        setup(forms)
+        expect(screen.getByText('Factura')).toBeTruthy()
+        expect(screen.getByText('Nota de crédito')).toBeTruthy()
+        expect(screen.queryByText('Factura origen')).toBeNull()
+        fireEvent.click(screen.getByText('Nota de crédito'))
+        expect(screen.getByText('Factura origen')).toBeTruthy()
+        expect(screen.queryByText('Método de pago')).toBeNull()
+    })
+
+    it('un solo tipo se salta el selector', () => {
+        setup({ ...forms, types: [forms.types[1]] })
+        expect(screen.queryByRole('radiogroup')).toBeNull()
+        expect(screen.getByText('Factura origen')).toBeTruthy()
+    })
+
+    it('envía el valor del tipo y los campos al endpoint del modelo', async () => {
+        const { post, onSaved, onOpenChange } = setup(forms)
+        fireEvent.click(screen.getByText('Nota de crédito'))
+        const inputs = document.querySelectorAll('input')
+        fireEvent.change(inputs[0], { target: { value: 'ACME' } })
+        fireEvent.change(inputs[1], { target: { value: 'FAC-1' } })
+        fireEvent.click(screen.getByRole('button', { name: 'Crear' }))
+        await waitFor(() => expect(post).toHaveBeenCalled())
+        expect(post.mock.calls[0][0]).toBe('/dynamic/fiscal_documents')
+        expect(post.mock.calls[0][1]).toMatchObject({ type: 'E', customer_name: 'ACME', origin_invoice: 'FAC-1' })
+        await waitFor(() => expect(onSaved).toHaveBeenCalled())
+        expect(onOpenChange).toHaveBeenCalledWith(false)
+    })
+
+    it('el paso de renglones usa el editor del SDK y los serializa', async () => {
+        const { post } = setup({ ...forms, types: [forms.types[0]] })
+        fireEvent.change(document.querySelectorAll('input')[0], { target: { value: 'ACME' } })
+        fireEvent.click(screen.getByRole('button', { name: 'Siguiente' }))
+        // Sin renglones no guarda: banner en el diálogo.
+        await screen.findByRole('button', { name: 'Renglón libre' })
+        fireEvent.click(screen.getByRole('button', { name: 'Crear' }))
+        await screen.findByRole('alert')
+        expect(post).not.toHaveBeenCalled()
+        // Con un renglón válido, viajan serializados en `lines`.
+        fireEvent.click(screen.getByRole('button', { name: 'Renglón libre' }))
+        fireEvent.change(screen.getByLabelText('Descripción'), { target: { value: 'Servicio' } })
+        fireEvent.change(screen.getByLabelText('Precio'), { target: { value: '100' } })
+        fireEvent.click(screen.getByRole('button', { name: 'Crear' }))
+        await waitFor(() => expect(post).toHaveBeenCalled())
+        const body = post.mock.calls[0][1] as any
+        expect(body.type).toBe('I')
+        expect(body.lines).toEqual([expect.objectContaining({ description: 'Servicio', quantity: 1, unit_price: 100 })])
+    })
+
+    it('un 422 se muestra dentro del diálogo y no lo cierra', async () => {
+        const post = vi.fn().mockRejectedValue({
+            response: { status: 422, data: { success: false, message: 'validation failed', errors: { origin_invoice: ['La factura origen no existe'] } } },
+        })
+        const { onOpenChange, onSaved } = setup({ ...forms, types: [forms.types[1]] }, post)
+        const inputs = document.querySelectorAll('input')
+        fireEvent.change(inputs[0], { target: { value: 'ACME' } })
+        fireEvent.change(inputs[1], { target: { value: 'X' } })
+        fireEvent.click(screen.getByRole('button', { name: 'Crear' }))
+        const banner = await screen.findByRole('alert')
+        expect(banner.textContent).toContain('La factura origen no existe')
+        expect(onOpenChange).not.toHaveBeenCalledWith(false)
+        expect(onSaved).not.toHaveBeenCalled()
+    })
+})
+
+describe('resolveDocumentForms', () => {
+    it('sin manifest (o sin tipos) devuelve undefined: el alta genérica sigue igual', () => {
+        expect(resolveDocumentForms(null)).toBeUndefined()
+        expect(resolveDocumentForms({} as any)).toBeUndefined()
+        expect(resolveDocumentForms({ document_forms: { types: [] } } as any)).toBeUndefined()
+    })
+    it('la prop gana sobre el metadata', () => {
+        expect(resolveDocumentForms({ document_forms: { types: [forms.types[0]] } } as any, forms)).toBe(forms)
+        expect(resolveDocumentForms({ document_forms: forms } as any)).toBe(forms)
+    })
+})
+
+describe('DynamicCRUDPage + document_forms', () => {
+    const meta = (extra: Record<string, unknown>) =>
+        ({
+            title: 'Notas de crédito',
+            endpoint: '/data/x',
+            columns: [],
+            actions: [],
+            perPageOptions: [10],
+            defaultPerPage: 10,
+            searchPlaceholder: 'Buscar',
+            enableCRUDActions: true,
+            hasActions: false,
+            canExport: false,
+            canImport: false,
+            ...extra,
+        }) as any
+
+    const mount = (m: any) => {
+        useMetadataCache.getState().setMetadata('fiscal_documents', m)
+        const client = {
+            get: vi.fn(async (url: string) =>
+                url.startsWith('/metadata/') ? { data: { success: true, data: m } } : { data: { success: true, data: [], meta: { total: 0 } } },
+            ),
+            post: vi.fn(),
+            put: vi.fn(),
+            delete: vi.fn(),
+        } as unknown as ApiClient
+        render(
+            <ApiProvider client={client}>
+                <DynamicCRUDPage model="fiscal_documents" />
+            </ApiProvider>,
+        )
+    }
+
+    it('con document_forms, Crear abre el selector de tipo en vez del formulario genérico', async () => {
+        mount(meta({ document_forms: forms }))
+        fireEvent.click((await screen.findByText(/New Nota/)).closest('button')!)
+        expect(await screen.findByRole('radiogroup')).toBeTruthy()
+        expect(screen.getByText('Nota de crédito')).toBeTruthy()
+    })
+
+    it('sin document_forms no aparece el selector (alta genérica)', async () => {
+        mount(meta({}))
+        fireEvent.click((await screen.findByText(/New Nota/)).closest('button')!)
+        await new Promise((r) => setTimeout(r, 50))
+        expect(screen.queryByRole('radiogroup')).toBeNull()
+    })
+})

package/src/__tests__/dynamic-table-infinite-scroll.test.tsx

@@ -149,6 +149,10 @@ describe('DynamicTable infinite scroll', () => {
         await waitFor(() => expect(screen.getByText('30 de 45')).toBeTruthy())
         observers.forEach((o) => o.fire(true))
         await waitFor(() => expect(screen.getByText('45 de 45')).toBeTruthy())
+        // The sentinel leaves the viewport once everything is loaded. While it
+        // stays intersecting the hook deliberately chains the next page after a
+        // reset (viewport-fill), which would mask the collapse asserted below.
+        observers.forEach((o) => o.fire(false))
 
         // Change the active filters via defaultFilters (part of buildFilterParams).
         rerender(

package/src/__tests__/dynamic-table-mutation-refresh.test.tsx

@@ -0,0 +1,116 @@
+// @vitest-environment happy-dom
+//
+// DynamicTable classic pagination ('pages', the default mode):
+//   1. The pager footer renders; clicking page 2 issues a NEW query with
+//      page=2 and REPLACES the visible rows (no accumulation).
+//   2. Changing the filters resets back to page 1.
+//   3. The chosen page size persists per table in localStorage and is adopted
+//      on the next mount (over the model's server default).
+import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest'
+import { cleanup, fireEvent, render, screen, waitFor } from '@testing-library/react'
+
+vi.mock('@tanstack/react-router', () => ({
+    useNavigate: () => () => {},
+}))
+const I18N = {
+    t: (_k: string, o?: { defaultValue?: string; count?: number; total?: number }) => {
+        if (o?.defaultValue && o.count != null && o.total != null) {
+            return o.defaultValue.replace('{{count}}', String(o.count)).replace('{{total}}', String(o.total))
+        }
+        return o?.defaultValue ?? _k
+    },
+    i18n: { language: 'es' },
+}
+vi.mock('react-i18next', () => ({ useTranslation: () => I18N }))
+
+import { act } from '@testing-library/react'
+import { emitRecordMutation } from '../record-mutation-events'
+import { DynamicTable } from '../dynamic-table'
+import { ApiProvider, type ApiClient } from '../api-context'
+import { useMetadataCache } from '../metadata-cache'
+import type { TableMetadata } from '../types'
+
+afterEach(cleanup)
+
+function meta(): TableMetadata {
+    return {
+        title: 'Issues',
+        endpoint: '/data/issue',
+        group_by: 'stage',
+        columns: [
+            { key: 'title', label: 'Title', type: 'text', sortable: true, filterable: false, searchable: true },
+        ],
+        actions: [],
+        perPageOptions: [10, 20, 50],
+        defaultPerPage: 10,
+        searchPlaceholder: 'Buscar...',
+        enableCRUDActions: false,
+        hasActions: false,
+    }
+}
+
+function fakeApi(total: number): ApiClient {
+    const ok = (data: unknown) => ({ data: { success: true, data, meta: { total } } })
+    const page = (n: number, size: number) => {
+        const start = (n - 1) * size
+        const rows: Array<{ id: number; title: string }> = []
+        for (let i = start; i < Math.min(start + size, total); i++) {
+            rows.push({ id: i + 1, title: `Issue ${i + 1}` })
+        }
+        return rows
+    }
+    return {
+        get: vi.fn(async (url: string, cfg?: any) => {
+            if (url.startsWith('/metadata/table/')) return ok(meta())
+            if (url.endsWith('/facets')) return ok([])
+            const p = cfg?.params?.page ?? 1
+            const size = cfg?.params?.per_page ?? 10
+            return ok(page(p, size))
+        }),
+        post: vi.fn(async () => ok(null)),
+        put: vi.fn(async () => ok(null)),
+        delete: vi.fn(async () => ok(null)),
+    }
+}
+
+function dataCalls(api: ApiClient) {
+    return (api.get as any).mock.calls.filter((c: any[]) => c[0] === '/data/issue')
+}
+
+describe('DynamicTable reloads on record mutation events (#1020)', () => {
+    beforeEach(() => {
+        localStorage.clear()
+        sessionStorage.clear()
+        useMetadataCache.getState().setMetadata('issue', meta())
+    })
+
+    it('repeats the GET when a record of the same model (any case) is mutated', async () => {
+        const api = fakeApi(5)
+        render(
+            <ApiProvider client={api}>
+                <DynamicTable model="issue" enableUrlSync={false} />
+            </ApiProvider>,
+        )
+        await waitFor(() => expect(dataCalls(api).length).toBeGreaterThan(0))
+        await new Promise((r) => setTimeout(r, 450))
+        const before = dataCalls(api).length
+
+        act(() => emitRecordMutation('ISSUE', 'create'))
+        await waitFor(() => expect(dataCalls(api).length).toBeGreaterThan(before))
+    })
+
+    it('ignores mutations of other models', async () => {
+        const api = fakeApi(5)
+        render(
+            <ApiProvider client={api}>
+                <DynamicTable model="issue" enableUrlSync={false} />
+            </ApiProvider>,
+        )
+        await waitFor(() => expect(dataCalls(api).length).toBeGreaterThan(0))
+        await new Promise((r) => setTimeout(r, 450))
+        const before = dataCalls(api).length
+        act(() => emitRecordMutation('other_model', 'delete'))
+        await new Promise((r) => setTimeout(r, 500))
+        expect(dataCalls(api).length).toBe(before)
+    })
+})

package/src/__tests__/line-items-lock-rows.test.tsx

@@ -65,6 +65,7 @@ describe('DynamicLineItems — lock_rows', () => {
     it('control: sin lock_rows muestra "Agregar renglón" y un botón de borrar por fila', () => {
         render(<DynamicLineItems field={lineField()} value={rows} onChange={vi.fn()} />)
         expect(screen.getByText('Agregar renglón')).toBeTruthy()
-        expect(screen.getAllByLabelText('Eliminar renglón')).toHaveLength(2)
+        // Mobile cards + desktop table both render a delete control per row.
+        expect(screen.getAllByLabelText('Eliminar renglón')).toHaveLength(rows.length * 2)
     })
 })

package/src/__tests__/nav-permissions.test.tsx

@@ -0,0 +1,76 @@
+// @vitest-environment happy-dom
+// PIT-044: the sidebar follows the role's effective permissions.
+import { describe, expect, it } from 'vitest'
+import { renderHook } from '@testing-library/react'
+import type { ReactNode } from 'react'
+import { PermissionsProvider, makeCan } from '../permissions-context'
+import {
+    capabilityForNavItem,
+    isNavItemAllowed,
+    modelFromNavUrl,
+    useNavItemVisible,
+} from '../nav-permissions'
+import { filterNavigationByCapability, useNavigation, type NavItem } from '../navigation-builder'
+
+describe('nav url → capability', () => {
+    it('maps /m/<model> to <model>.index and ignores other routes', () => {
+        expect(modelFromNavUrl('/m/POS_Orders?view=kanban')).toBe('POS_Orders')
+        expect(modelFromNavUrl('/app/m/stock_transfers')).toBe('stock_transfers')
+        expect(modelFromNavUrl('/app/activity')).toBeUndefined()
+        expect(capabilityForNavItem({ url: '/m/pos_orders' })).toBe('pos_orders.index')
+        expect(capabilityForNavItem({ url: '/m/x', requires: 'general.admin' })).toBe('general.admin')
+        expect(capabilityForNavItem({ url: '/app/activity' })).toBeUndefined()
+    })
+
+    it('allows non-model routes and gates model routes', () => {
+        const can = makeCan(['pos_orders.index'], false)
+        expect(isNavItemAllowed({ url: '/m/pos_orders' }, can)).toBe(true)
+        expect(isNavItemAllowed({ url: '/m/invoices' }, can)).toBe(false)
+        expect(isNavItemAllowed({ url: '/app/activity' }, can)).toBe(true)
+    })
+})
+
+describe('useNavItemVisible', () => {
+    it('is undefined without a provider (nothing filtered)', () => {
+        const { result } = renderHook(() => useNavItemVisible())
+        expect(result.current).toBeUndefined()
+    })
+
+    it('hides entries the role cannot index; admin sees all', () => {
+        const wrap = (perms: string[], isAdmin: boolean) =>
+            ({ children }: { children: ReactNode }) => (
+                <PermissionsProvider permissions={perms} isAdmin={isAdmin}>
+                    {children}
+                </PermissionsProvider>
+            )
+        const limited = renderHook(() => useNavItemVisible(), { wrapper: wrap(['pos_orders.index'], false) })
+        expect(limited.result.current!({ url: '/m/pos_orders' })).toBe(true)
+        expect(limited.result.current!({ url: '/m/invoices' })).toBe(false)
+        const admin = renderHook(() => useNavItemVisible(), { wrapper: wrap([], true) })
+        expect(admin.result.current!({ url: '/m/invoices' })).toBe(true)
+    })
+})
+
+describe('navigation builder capability filter', () => {
+    const base: NavItem[] = [
+        { key: 'sales', label: 'Ventas', children: [
+            { key: 'orders', label: 'Pedidos', to: '/m/orders', requires: 'orders.index' },
+            { key: 'invoices', label: 'Facturas', to: '/m/invoices', requires: 'invoices.index' },
+        ] },
+        { key: 'admin', label: 'Admin', children: [
+            { key: 'roles', label: 'Roles', to: '/m/roles', requires: 'roles.index' },
+        ] },
+        { key: 'home', label: 'Inicio', to: '/' },
+    ]
+
+    it('drops denied items and parents left empty', () => {
+        const out = filterNavigationByCapability(base, makeCan(['orders.index'], false))
+        expect(out.map((i) => i.key)).toEqual(['sales', 'home'])
+        expect(out[0].children!.map((c) => c.key)).toEqual(['orders'])
+    })
+
+    it('useNavigation keeps everything without a provider', () => {
+        const { result } = renderHook(() => useNavigation(base, []))
+        expect(result.current).toHaveLength(3)
+    })
+})