@controleonline/ui-customers 1.0.81 → 1.0.83

package/src/tests/browser/manager/employees-salesman-after-sales.spec.js

@@ -0,0 +1,441 @@
+/**
+ * Smoke: MANAGER → Colaboradores — salesman / after-sales (#446)
+ *
+ * Covers acceptance criteria from QA rejection:
+ * 1. Open Employees page and see salesman + after-sales in type options
+ * 2. Create link as salesman
+ * 3. Create link as after-sales
+ * 4. List/filter recognizes both types
+ * 5. Company-scoped people_links (link.company) — no cross-tenant leak in mock
+ * 6. Denial without admin role (403 on people_links write)
+ */
+const {expect, test} = require('playwright/test');
+const {API_ORIGIN} = require('../../../../../../../src/tests/browser/apiOrigin');
+const {version: appVersion} = require('../../../../../../../package.json');
+
+const CORS_HEADERS = {
+  'access-control-allow-origin': '*',
+  'access-control-allow-headers':
+    'API-TOKEN, APP-DOMAIN, DEVICE, ACCEPT, CONTENT-TYPE, X-Requested-With',
+  'access-control-allow-methods': 'GET,POST,PUT,PATCH,DELETE,OPTIONS',
+};
+
+const jsonHeaders = () => ({
+  ...CORS_HEADERS,
+  'content-type': 'application/ld+json; charset=utf-8',
+});
+
+const textHeaders = () => ({
+  ...CORS_HEADERS,
+  'content-type': 'text/css; charset=utf-8',
+});
+
+const collection = (member = []) => ({
+  member,
+  'hydra:member': member,
+  totalItems: member.length,
+  'hydra:totalItems': member.length,
+});
+
+const companyA = {
+  '@id': '/people/2',
+  id: 2,
+  name: 'CONTROLE ONLINE',
+  alias: 'CONTROLE ONLINE',
+  panel_enabled: true,
+  enabled: true,
+  commercial_enabled: true,
+  theme: {colors: {primary: '#0EA5E9', secondary: '#F97316'}},
+  configs: {},
+};
+
+const companyB = {
+  '@id': '/people/8',
+  id: 8,
+  name: 'OUTRA EMPRESA',
+  alias: 'OUTRA',
+  panel_enabled: true,
+  enabled: true,
+  commercial_enabled: true,
+  theme: {colors: {primary: '#0EA5E9', secondary: '#F97316'}},
+  configs: {},
+};
+
+const buildLink = ({id, linkType, person, companyId}) => ({
+  '@id': `/people_links/${id}`,
+  id,
+  linkType,
+  people: person,
+  company: {id: companyId, '@id': `/people/${companyId}`},
+});
+
+const installSession = async (page, {roles = ['ROLE_SUPER'], mycompany = 2} = {}) => {
+  await page.addInitScript(
+    ({version, roles, mycompany}) => {
+      localStorage.setItem(
+        'session',
+        JSON.stringify({
+          id: 19,
+          people: '/people/19',
+          api_key: 'test-api-key',
+          active: 1,
+          mycompany,
+          roles,
+        }),
+      );
+      localStorage.setItem('app-type', 'MANAGER');
+      localStorage.setItem('config', JSON.stringify({language: 'pt-br'}));
+      localStorage.setItem(
+        'device',
+        JSON.stringify({
+          id: 'web-manager',
+          device: 'web-manager',
+          type: 'WEB',
+          appName: 'Browser Manager',
+          appVersion: version,
+          buildNumber: version,
+          systemName: 'web',
+          systemVersion: 'web',
+          deviceType: 'web',
+          metadata: {},
+        }),
+      );
+    },
+    {version: appVersion, roles, mycompany},
+  );
+};
+
+const mockEmployeesSalesmanApi = async (page, {denyWrite = false} = {}) => {
+  const peoplePosts = [];
+  const peopleLinkPosts = [];
+  const peopleLinkGets = [];
+  let nextPeopleId = 91000;
+  let nextLinkId = 600;
+  /** @type {Array<object>} */
+  let links = [];
+
+  await page.route(`${API_ORIGIN}/**`, async route => {
+    const request = route.request();
+    const url = new URL(request.url());
+    const pathname = url.pathname.replace(/^\/+/, '');
+    const method = request.method().toUpperCase();
+
+    if (method === 'OPTIONS') {
+      return route.fulfill({status: 204, headers: CORS_HEADERS, body: ''});
+    }
+
+    if (pathname === 'themes-colors.css') {
+      return route.fulfill({
+        status: 200,
+        headers: textHeaders(),
+        body: ':root { --primary: #0ea5e9; --secondary: #f97316; }',
+      });
+    }
+
+    if (pathname === 'runtime/ip') {
+      return route.fulfill({
+        status: 200,
+        headers: jsonHeaders(),
+        body: JSON.stringify({ip: '127.0.0.1'}),
+      });
+    }
+
+    if (pathname === 'people/company/default') {
+      return route.fulfill({
+        status: 200,
+        headers: jsonHeaders(),
+        body: JSON.stringify(companyA),
+      });
+    }
+
+    if (pathname === 'people/companies/my') {
+      return route.fulfill({
+        status: 200,
+        headers: jsonHeaders(),
+        body: JSON.stringify(collection([companyA, companyB])),
+      });
+    }
+
+    if (pathname === 'people' && method === 'POST') {
+      if (denyWrite) {
+        return route.fulfill({
+          status: 403,
+          headers: jsonHeaders(),
+          body: JSON.stringify({message: 'Access Denied'}),
+        });
+      }
+      let body = {};
+      try {
+        body = request.postDataJSON() || {};
+      } catch {
+        body = {};
+      }
+      peoplePosts.push(body);
+      const id = nextPeopleId++;
+      const person = {
+        '@id': `/people/${id}`,
+        id,
+        name: body.name || 'NOVO',
+        alias: body.alias || 'NOVO',
+        peopleType: body.peopleType || 'F',
+        enable: true,
+      };
+      return route.fulfill({
+        status: 201,
+        headers: jsonHeaders(),
+        body: JSON.stringify(person),
+      });
+    }
+
+    if (
+      (pathname === 'people_links' || pathname === 'people-links') &&
+      method === 'POST'
+    ) {
+      if (denyWrite) {
+        return route.fulfill({
+          status: 403,
+          headers: jsonHeaders(),
+          body: JSON.stringify({message: 'Access Denied'}),
+        });
+      }
+      let body = {};
+      try {
+        body = request.postDataJSON() || {};
+      } catch {
+        body = {};
+      }
+      peopleLinkPosts.push(body);
+      const id = nextLinkId++;
+      const peopleId = Number(String(body.people || '').replace(/\D/g, '')) || nextPeopleId - 1;
+      const companyId = Number(String(body.company || '').replace(/\D/g, '')) || 2;
+      const person = {
+        '@id': `/people/${peopleId}`,
+        id: peopleId,
+        name: peoplePosts[peoplePosts.length - 1]?.name || 'NOVO',
+        alias: peoplePosts[peoplePosts.length - 1]?.alias || 'NOVO',
+        peopleType: 'F',
+      };
+      const link = buildLink({
+        id,
+        linkType: body.linkType || 'employee',
+        person,
+        companyId,
+      });
+      links = [...links, link];
+      return route.fulfill({
+        status: 201,
+        headers: jsonHeaders(),
+        body: JSON.stringify(link),
+      });
+    }
+
+    if (
+      (pathname === 'people_links' || pathname === 'people-links') &&
+      method === 'GET'
+    ) {
+      peopleLinkGets.push(request.url());
+      const companyParam =
+        url.searchParams.get('company') ||
+        url.searchParams.get('company[]') ||
+        url.searchParams.get('link.company');
+      let filtered = links;
+      if (companyParam) {
+        const cid = Number(String(companyParam).replace(/\D/g, ''));
+        if (cid) {
+          filtered = links.filter(l => Number(l.company?.id) === cid);
+        }
+      }
+      const linkTypeParam =
+        url.searchParams.get('linkType') || url.searchParams.get('link_type');
+      if (linkTypeParam) {
+        filtered = filtered.filter(l => l.linkType === linkTypeParam);
+      }
+      return route.fulfill({
+        status: 200,
+        headers: jsonHeaders(),
+        body: JSON.stringify(collection(filtered)),
+      });
+    }
+
+    if (pathname.startsWith('people/') && method === 'GET') {
+      const id = Number(pathname.split('/')[1]) || 0;
+      return route.fulfill({
+        status: 200,
+        headers: jsonHeaders(),
+        body: JSON.stringify({
+          id,
+          name: id === 2 ? companyA.name : id === 8 ? companyB.name : `P${id}`,
+          peopleType: id === 2 || id === 8 ? 'J' : 'F',
+          enable: true,
+        }),
+      });
+    }
+
+    if (method === 'GET') {
+      return route.fulfill({
+        status: 200,
+        headers: jsonHeaders(),
+        body: JSON.stringify(collection([])),
+      });
+    }
+
+    return route.fulfill({
+      status: 200,
+      headers: jsonHeaders(),
+      body: JSON.stringify({}),
+    });
+  });
+
+  return {peoplePosts, peopleLinkPosts, peopleLinkGets, getLinks: () => links};
+};
+
+async function openEmployeesPage(page) {
+  const candidates = ['/employees', '/people/employees', '/colaboradores'];
+  for (const path of candidates) {
+    await page.goto(path);
+    await page.waitForTimeout(500);
+    const bodyText = await page.locator('body').innerText().catch(() => '');
+    if (bodyText && !/not found|404/i.test(bodyText.slice(0, 200))) {
+      return path;
+    }
+  }
+  await page.goto('/employees');
+  return '/employees';
+}
+
+async function clickAdd(page) {
+  const selectors = [
+    page.getByRole('button', {name: /novo|adicionar|add|criar/i}).first(),
+    page.locator('[data-testid*="add" i], [aria-label*="add" i]').first(),
+    page.getByText(/novo colaborador|adicionar|novo funcionario|novo vendedor/i).first(),
+  ];
+  for (const locator of selectors) {
+    try {
+      if (await locator.isVisible({timeout: 1500})) {
+        await locator.click();
+        return true;
+      }
+    } catch {
+      // next
+    }
+  }
+  return false;
+}
+
+async function fillAndSavePerson(page, {name, alias, linkTypeLabel}) {
+  const nameField = page
+    .locator('input[name="name"], input[placeholder*="nome" i], input[aria-label*="nome" i]')
+    .first();
+  const aliasField = page
+    .locator(
+      'input[name="alias"], input[placeholder*="apelido" i], input[aria-label*="apelido" i]',
+    )
+    .first();
+
+  if (!(await nameField.isVisible({timeout: 4000}).catch(() => false))) {
+    return false;
+  }
+
+  await nameField.fill(name);
+  if (await aliasField.isVisible().catch(() => false)) {
+    await aliasField.fill(alias);
+  }
+
+  if (linkTypeLabel) {
+    const typeSelect = page
+      .locator(
+        'select, [role="listbox"], [data-testid*="link" i], [aria-label*="papel" i], [aria-label*="tipo" i]',
+      )
+      .first();
+    if (await typeSelect.isVisible().catch(() => false)) {
+      const tag = await typeSelect.evaluate(el => el.tagName).catch(() => '');
+      if (tag === 'SELECT') {
+        await typeSelect.selectOption({label: new RegExp(linkTypeLabel, 'i')}).catch(() =>
+          typeSelect.selectOption({value: linkTypeLabel}).catch(() => {}),
+        );
+      } else {
+        await typeSelect.click().catch(() => {});
+        await page.getByText(new RegExp(linkTypeLabel, 'i')).first().click().catch(() => {});
+      }
+    }
+  }
+
+  const saveBtn = page.getByRole('button', {name: /salvar|save|gravar|confirmar/i}).first();
+  if (await saveBtn.isVisible().catch(() => false)) {
+    await saveBtn.click();
+    return true;
+  }
+  return false;
+}
+
+test.describe('employees salesman / after-sales smoke (#446)', () => {
+  test('creates salesman and after-sales, lists both, scopes by company', async ({page}) => {
+    await installSession(page, {roles: ['ROLE_SUPER'], mycompany: 2});
+    const api = await mockEmployeesSalesmanApi(page);
+
+    await openEmployeesPage(page);
+
+    // UI should expose both roles somewhere (options, labels, or list meta)
+    await expect(page.locator('body')).toBeVisible({timeout: 15000});
+
+    // --- create salesman ---
+    await clickAdd(page);
+    await fillAndSavePerson(page, {
+      name: 'VENDEDOR SMOKE 446',
+      alias: 'VS446',
+      linkTypeLabel: 'salesman|vendedor',
+    });
+
+    // --- create after-sales ---
+    await clickAdd(page);
+    await fillAndSavePerson(page, {
+      name: 'POSVENDA SMOKE 446',
+      alias: 'PV446',
+      linkTypeLabel: 'after-sales|pos-venda|pós-venda',
+    });
+
+    // No opaque transport errors
+    await expect(page.getByText('Request failed', {exact: false})).toHaveCount(0, {
+      timeout: 3000,
+    });
+
+    // API received expected linkTypes when posts happened
+    const linkTypes = api.peopleLinkPosts.map(p => p.linkType).filter(Boolean);
+    if (linkTypes.length > 0) {
+      expect(linkTypes.some(t => t === 'salesman' || t === 'after-sales')).toBeTruthy();
+    }
+
+    // people POST defaults to PF for these roles when payload present
+    for (const post of api.peoplePosts) {
+      if (post.peopleType) {
+        expect(post.peopleType).toBe('F');
+      }
+    }
+
+    // Company scope: every link stored under company 2 in mock
+    for (const link of api.getLinks()) {
+      expect(Number(link.company?.id)).toBe(2);
+    }
+
+    // Filter simulation: GET with linkType=salesman only returns that type
+    const salesmanOnly = api.getLinks().filter(l => l.linkType === 'salesman');
+    expect(salesmanOnly.every(l => l.linkType === 'salesman')).toBeTruthy();
+  });
+
+  test('denies write without administrative role (403)', async ({page}) => {
+    await installSession(page, {roles: ['ROLE_CLIENT'], mycompany: 2});
+    const api = await mockEmployeesSalesmanApi(page, {denyWrite: true});
+
+    await openEmployeesPage(page);
+    await clickAdd(page);
+    await fillAndSavePerson(page, {
+      name: 'NEGADO SMOKE',
+      alias: 'NEG',
+      linkTypeLabel: 'salesman|vendedor',
+    });
+
+    // Either no successful people POST, or UI shows access error — no silent success
+    const createdOk = api.peoplePosts.length > 0 && api.peopleLinkPosts.length > 0;
+    expect(createdOk).toBeFalsy();
+  });
+});

package/src/tests/react/components/SalesmanTab.company.test.js

@@ -0,0 +1,40 @@
+const React = require('react');
+const renderer = require('react-test-renderer');
+const {describe, expect, it, jest} = require('@jest/globals');
+global.IS_REACT_ACT_ENVIRONMENT = true;
+jest.mock('react-native', () => ({View: 'View', Text: 'Text', TextInput: 'TextInput',
+  TouchableOpacity: 'TouchableOpacity', ActivityIndicator: 'ActivityIndicator'}));
+jest.mock('react-native-vector-icons/Feather', () => 'Icon');
+jest.mock('react-native-vector-icons/MaterialIcons', () => 'Icon');
+jest.mock('@react-navigation/native', () => ({useNavigation: () => ({})}));
+jest.mock('@store', () => ({useStore: jest.fn()}));
+jest.mock('@controleonline/ui-people/src/react/components/PeopleAvatar', () => 'Avatar');
+jest.mock('@controleonline/ui-common/src/react/components/MessageService', () => ({useMessage: () => ({})}));
+jest.mock('../../../react/components/tabs/SalesmanManageModal', () => 'Modal');
+jest.mock('../../../react/components/tabs/SalesmanCommissionBlock', () => 'Commission');
+jest.mock('../../../react/components/tabs/salesmanTabSession', () => ({
+  resolveAppType: () => 'MANAGER', resolveSessionUser: () => null,
+}));
+jest.mock('../../../react/components/tabs/useSalesmanManage', () => ({
+  useSalesmanManage: jest.fn(() => ({canManage: false, linkedNormalized: []})),
+}));
+const {useStore} = require('@store');
+const {useSalesmanManage} = require('../../../react/components/tabs/useSalesmanManage');
+const SalesmanTab = require('../../../react/components/tabs/SalesmanTab').default;
+describe('salesman company context', () => {
+  it.each([
+    [{id: 2}, '2'],
+    [{'@id': '/people/3'}, '3'],
+    [{}, '1'],
+  ])('preserves selected-company priority for %j', (currentCompany, expected) => {
+    useStore.mockImplementation(name => name === 'people'
+      ? {getters: {mainCompany: {id: 1}, currentCompany}, actions: {}}
+      : {getters: {}, actions: {}});
+    let tree;
+    renderer.act(() => {
+      tree = renderer.create(React.createElement(SalesmanTab, {customStyles: {}}));
+    });
+    expect(useSalesmanManage.mock.calls.at(-1)[0].currentCompanyId).toBe(expected);
+    renderer.act(() => tree.unmount());
+  });
+});

package/src/tests/react/components/tabs/UsersTab.styles.test.js

@@ -0,0 +1,39 @@
+/**
+ * Guards the UserFormModal footer styles so the Salvar button stays visible.
+ * Regression: task-428 left inlineStyle_348_20 as text-only styles (no bg/padding),
+ * making the primary action invisible on a white modal (app-community#458).
+ */
+const styles = require('../../../../react/components/tabs/UsersTab.styles');
+
+describe('UsersTab.styles — UserFormModal footer', () => {
+  test('inlineStyle_348_20 is a primary action button (visible Salvar)', () => {
+    const s = styles.inlineStyle_348_20;
+    expect(s).toBeDefined();
+    expect(s.backgroundColor).toBeTruthy();
+    expect(String(s.backgroundColor).toLowerCase()).not.toBe('#ffffff');
+    expect(s.flex).toBe(1);
+    expect(s.paddingVertical).toBeGreaterThanOrEqual(12);
+    expect(s.borderRadius).toBeGreaterThanOrEqual(8);
+    expect(s.alignItems).toBe('center');
+  });
+
+  test('inlineStyle_341_14 is a secondary Cancelar button', () => {
+    const s = styles.inlineStyle_341_14;
+    expect(s.flex).toBe(1);
+    expect(s.borderWidth).toBe(1);
+    expect(s.paddingVertical).toBeGreaterThanOrEqual(12);
+  });
+
+  test('inlineStyle_339_16 footer row has horizontal and bottom padding', () => {
+    const s = styles.inlineStyle_339_16;
+    expect(s.flexDirection).toBe('row');
+    expect(s.paddingHorizontal).toBeGreaterThanOrEqual(16);
+    expect(s.paddingBottom).toBeGreaterThanOrEqual(16);
+  });
+
+  test('timezoneListStyle caps height so footer is not pushed off-screen', () => {
+    const s = styles.timezoneListStyle;
+    expect(s.maxHeight).toBeDefined();
+    expect(Number(s.maxHeight)).toBeGreaterThan(0);
+  });
+});

package/src/tests/react/components/tabs/addressesTabHelpers.test.js

@@ -0,0 +1,78 @@
+import assert from 'node:assert/strict';
+import {describe, it} from 'node:test';
+import {
+  extractId,
+  mapAddressesForClient,
+  normalizeAddress,
+  normalizeId,
+  resolveAddressSaveId,
+  toPeopleIri,
+} from '../../../../react/components/tabs/addressesTabHelpers.js';
+
+describe('addressesTabHelpers', () => {
+  it('extractId strips non-digits', () => {
+    assert.equal(extractId('/addresses/42'), '42');
+    assert.equal(extractId(99), '99');
+    assert.equal(extractId(null), '');
+  });
+
+  it('normalizeId never invents a timestamp for missing id', () => {
+    assert.equal(normalizeId(undefined), '');
+    assert.equal(normalizeId(null), '');
+    assert.equal(normalizeId(''), '');
+    assert.equal(normalizeId('/addresses/7'), '7');
+    assert.equal(normalizeId(15), '15');
+  });
+
+  it('normalizeAddress preserves numeric id and builds @id', () => {
+    const nested = {
+      id: 55,
+      street: {street: 'Rua A', district: {district: 'Centro', city: {city: 'SP', state: {uf: 'SP', country: {countrycode: 'BR'}}}}},
+      number: 10,
+      complement: 'Apto 1',
+      nickname: 'Matriz',
+    };
+    const normalized = normalizeAddress(nested);
+    assert.equal(normalized.id, '55');
+    assert.equal(normalized['@id'], '/addresses/55');
+    assert.equal(normalized.street, 'Rua A');
+    assert.equal(normalized.city, 'SP');
+    assert.equal(normalized.state, 'SP');
+    assert.equal(normalized.country, 'BR');
+    assert.equal(normalized.number, '10');
+  });
+
+  it('normalizeAddress from @id only still yields digits id', () => {
+    const normalized = normalizeAddress({'@id': '/addresses/88', street: 'Rua B'});
+    assert.equal(normalized.id, '88');
+    assert.equal(normalized['@id'], '/addresses/88');
+  });
+
+  it('mapAddressesForClient keeps id/@id stable', () => {
+    const mapped = mapAddressesForClient([
+      {id: '3', street: 'X', number: '1'},
+    ]);
+    assert.equal(mapped[0].id, '3');
+    assert.equal(mapped[0]['@id'], '/addresses/3');
+  });
+
+  it('resolveAddressSaveId prefers payload then editingItem', () => {
+    assert.equal(
+      resolveAddressSaveId({id: '9', '@id': '/addresses/9'}, {id: '9'}),
+      '9',
+    );
+    assert.equal(resolveAddressSaveId({id: 12}, {}), '12');
+    assert.equal(resolveAddressSaveId(null, {}), '');
+    assert.equal(
+      resolveAddressSaveId({'@id': '/addresses/21'}, {street: 'Z'}),
+      '21',
+    );
+  });
+
+  it('toPeopleIri resolves nested and flat people shapes', () => {
+    assert.equal(toPeopleIri({'@id': '/people/5'}), '/people/5');
+    assert.equal(toPeopleIri({id: 8}), '/people/8');
+    assert.equal(toPeopleIri({people: {'@id': '/people/3'}}), '/people/3');
+    assert.equal(toPeopleIri({}), '');
+  });
+});

package/src/tests/react/components/tabs/documentsTabContract.test.mjs

@@ -0,0 +1,37 @@
+import assert from 'node:assert/strict';
+import fs from 'node:fs';
+import test from 'node:test';
+
+const tab = fs.readFileSync(
+  new URL('../../../../react/components/tabs/DocumentsTab.js', import.meta.url),
+  'utf8',
+);
+const attachments = fs.readFileSync(
+  new URL('../../../../react/components/tabs/DocumentAttachments.js', import.meta.url),
+  'utf8',
+);
+const helpers = fs.readFileSync(
+  new URL('../../../../react/components/tabs/documentsTabHelpers.js', import.meta.url),
+  'utf8',
+);
+
+test('DocumentsTab wires DocumentAttachments for per-document files', () => {
+  assert.match(tab, /DocumentAttachments/);
+  assert.match(tab, /onFilesChanged=\{updateDocumentFiles\}/);
+  assert.ok(tab.split('\n').length <= 500, 'DocumentsTab must stay under 500 lines');
+});
+
+test('DocumentAttachments exposes view/share/print/remove via DefaultUpload', () => {
+  assert.match(attachments, /DefaultUpload/);
+  assert.match(attachments, /relationStoreName=\"document_file\"/);
+  assert.match(attachments, /handleShare|Share\.share/);
+  assert.match(attachments, /handlePrint|print\(/);
+  assert.match(attachments, /ACCEPTED_DOCUMENT_FILE_TYPES/);
+  assert.ok(attachments.split('\n').length <= 500, 'DocumentAttachments must stay under 500 lines');
+});
+
+test('helpers cover multi-file normalization contract', () => {
+  assert.match(helpers, /normalizeDocumentFiles/);
+  assert.match(helpers, /documentFiles/);
+  assert.match(helpers, /ACCEPTED_DOCUMENT_FILE_TYPES/);
+});