@asteby/metacore-runtime-react 46.4.0 → 47.0.0

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-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__/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)
+    })
+})

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

@@ -249,9 +249,25 @@ describe('PermissionsManager (módulo como combobox agrupado)', () => {
         expect(screen.getByRole('option', { name: /Pedidos POS/ })).toBeTruthy()
         expect(screen.getByRole('option', { name: /Terminal/ })).toBeTruthy()
 
-        // Generales presentes con descripción.
-        expect(screen.getByText('Permisos Generales')).toBeTruthy()
-        expect(screen.getByText('Trabajar fuera de horario')).toBeTruthy()
+        // Los generales son un grupo sintético del combobox (#1021), no cards
+        // sueltas junto a la tarjeta del rol.
+        expect(screen.getByRole('option', { name: /Permisos generales/ })).toBeTruthy()
+        expect(screen.queryByText('Trabajar fuera de horario')).toBeNull()
+    })
+
+    it('«Permisos generales» se edita en la misma grilla de dos columnas y cuenta en el total', async () => {
+        const props = makeProps()
+        render(<PermissionsManager {...props} />)
+        await waitFor(() => expect(moduleTrigger().textContent).toMatch(/Usuarios/))
+
+        await selectModule(/Permisos generales/)
+        expect(await screen.findByText('Trabajar fuera de horario')).toBeTruthy()
+        expect(screen.getByText('0/1')).toBeTruthy()
+        const box = screen.getByRole('checkbox', { name: /Trabajar fuera de horario/ })
+        // Misma grilla que las acciones de un módulo.
+        expect(box.closest('div.grid')?.className).toContain('sm:grid-cols-2')
+        fireEvent.click(box)
+        expect(screen.getByText('1/1')).toBeTruthy()
     })
 
     it('CERO acordeones: el módulo es un combobox, no un folder colapsable', async () => {
@@ -304,7 +320,8 @@ describe('PermissionsManager (módulo como combobox agrupado)', () => {
         await selectModule(/Pedidos POS/)
         await screen.findByText('Pagar')
         fireEvent.click(screen.getByRole('checkbox', { name: /Pagar/ }))
-        fireEvent.click(screen.getByRole('checkbox', { name: /Trabajar fuera de horario/ }))
+        await selectModule(/Permisos generales/)
+        fireEvent.click(await screen.findByRole('checkbox', { name: /Trabajar fuera de horario/ }))
 
         expect(screen.getByText('Cambios sin guardar')).toBeTruthy()
         fireEvent.click(screen.getByRole('button', { name: /Guardar permisos/ }))

package/src/__tests__/use-print-document-feedback.test.tsx

@@ -0,0 +1,58 @@
+// @vitest-environment happy-dom
+// «Descargar Factura CFDI» no daba señal alguna: ahora hay progreso, éxito y
+// el motivo del servidor si falla (la promesa sigue rechazando).
+import { afterEach, describe, expect, it, vi } from 'vitest'
+import { cleanup, renderHook } from '@testing-library/react'
+import type { ReactNode } from 'react'
+
+const toast = vi.hoisted(() => ({
+    loading: vi.fn(() => 'tid'),
+    success: vi.fn(),
+    error: vi.fn(),
+    dismiss: vi.fn(),
+}))
+vi.mock('sonner', () => ({ toast }))
+
+import { usePrintDocument, documentErrorMessage } from '../use-print-document'
+import { ApiProvider, type ApiClient } from '../api-context'
+
+afterEach(() => {
+    cleanup()
+    vi.clearAllMocks()
+})
+
+const wrap = (client: ApiClient) => ({ children }: { children: ReactNode }) => <ApiProvider client={client}>{children}</ApiProvider>
+
+describe('usePrintDocument feedback', () => {
+    it('descarga: toast de progreso y de éxito', async () => {
+        URL.createObjectURL = vi.fn(() => 'blob:x')
+        const client = { get: vi.fn().mockResolvedValue({ data: new Blob(['x']), headers: {} }) } as unknown as ApiClient
+        const { result } = renderHook(() => usePrintDocument(), { wrapper: wrap(client) })
+        await result.current({ model: 'Invoice', id: '1', key: 'cfdi', mode: 'download' })
+        expect(toast.loading).toHaveBeenCalled()
+        expect(toast.success).toHaveBeenCalledWith('Documento descargado')
+        expect(toast.dismiss).toHaveBeenCalled()
+        expect(toast.error).not.toHaveBeenCalled()
+    })
+
+    it('fallo: muestra el motivo del servidor (cuerpo Blob) y rechaza', async () => {
+        const body = new Blob([JSON.stringify({ message: 'La factura aún no está timbrada' })], { type: 'application/json' })
+        const client = { get: vi.fn().mockRejectedValue({ response: { status: 409, data: body } }) } as unknown as ApiClient
+        const { result } = renderHook(() => usePrintDocument(), { wrapper: wrap(client) })
+        await expect(result.current({ model: 'Invoice', id: '1', key: 'cfdi', mode: 'download' })).rejects.toBeTruthy()
+        expect(toast.error).toHaveBeenCalledWith('La factura aún no está timbrada')
+    })
+
+    it('feedback:false no muestra nada; error:false deja el error al llamador', async () => {
+        const client = { get: vi.fn().mockRejectedValue({ response: { status: 500, data: null } }) } as unknown as ApiClient
+        const { result } = renderHook(() => usePrintDocument(), { wrapper: wrap(client) })
+        await expect(result.current({ model: 'I', id: '1', key: 'k', mode: 'open', feedback: false })).rejects.toBeTruthy()
+        await expect(result.current({ model: 'I', id: '1', key: 'k', mode: 'open', feedback: { progress: true, error: false } })).rejects.toBeTruthy()
+        expect(toast.error).not.toHaveBeenCalled()
+    })
+
+    it('documentErrorMessage cae a un mensaje genérico', async () => {
+        expect(await documentErrorMessage(new Error('x'))).toMatch(/No se pudo generar/)
+        expect(await documentErrorMessage({ response: { status: 404 } })).toMatch(/no está disponible/)
+    })
+})