@controleonline/ui-customers 1.0.81 → 1.0.83

package/src/react/components/tabs/generalTabHelpers.js

@@ -3,6 +3,11 @@
  * Extracted to keep GeneralTab.js under the absolute 500-line limit.
  */
 
+import {
+  HUMAN_COMPANY_LINK_TYPES,
+  HUMAN_COMPANY_LINK_TYPE_OPTIONS,
+} from '../../utils/humanCompanyLinkTypes';
+
 const normalizeText = value => String(value || '').replace(/\s+/g, ' ').trim();
 const normalizeIdentityValue = value => normalizeText(value);
 const extractId = value => String(value || '').replace(/\D/g, '');
@@ -81,21 +86,31 @@ const parseBrDateToYmd = value => {
     .padStart(2, '0')}-${day.toString().padStart(2, '0')}`;
 };
 
-const LINK_TYPE_OPTIONS = [
-  { value: 'employee', translationKey: 'employee' },
-  { value: 'owner', translationKey: 'owner' },
-  { value: 'director', translationKey: 'director' },
-  { value: 'manager', translationKey: 'manager' },
-  { value: 'courier', translationKey: 'courier' },
-];
+const LINK_TYPE_OPTIONS = HUMAN_COMPANY_LINK_TYPE_OPTIONS;
 
 const normalizeLinkType = value => {
   const normalized = String(value || '').trim().toLowerCase();
-  return ['employee', 'owner', 'director', 'manager', 'courier'].includes(normalized)
+  return HUMAN_COMPANY_LINK_TYPES.includes(normalized)
     ? normalized
     : 'employee';
 };
 
+/** Canonical People.peopleType: F (PF) | J (PJ). API enum — do not invent values. */
+const PEOPLE_TYPE_OPTIONS = [
+  { value: 'F', label: 'Pessoa Física' },
+  { value: 'J', label: 'Pessoa Jurídica' },
+];
+
+const normalizePeopleType = value => {
+  const normalized = String(value || '')
+    .trim()
+    .toUpperCase();
+  if (normalized === 'J' || normalized === 'JURIDICA' || normalized === 'PJ') {
+    return 'J';
+  }
+  return 'F';
+};
+
 const toPeopleIri = value => {
   const directIri = String(value?.['@id'] || '').trim();
   if (directIri.startsWith('/people/')) {
@@ -106,6 +121,10 @@ const toPeopleIri = value => {
   return id ? `/people/${id}` : '';
 };
 
+/** Prefer client.linkType (post-save) over static route seed (#446). */
+const resolveSeededLinkType = (clientLinkType, routeLinkType) =>
+  normalizeLinkType(clientLinkType || routeLinkType);
+
 export {
   normalizeText,
   normalizeIdentityValue,
@@ -116,5 +135,8 @@ export {
   parseBrDateToYmd,
   LINK_TYPE_OPTIONS,
   normalizeLinkType,
+  resolveSeededLinkType,
+  PEOPLE_TYPE_OPTIONS,
+  normalizePeopleType,
   toPeopleIri,
 };

package/src/react/components/tabs/useGeneralTabPeopleLink.js

@@ -0,0 +1,68 @@
+import {useEffect, useState} from 'react';
+import {extractId, resolveSeededLinkType} from './generalTabHelpers';
+
+/**
+ * Load people_link id + type for PF contact under a company.
+ * Prefers clientLinkType after save so UI does not snap back (#446).
+ */
+export default function useGeneralTabPeopleLink({
+  canEditLinkType,
+  getItems,
+  contactPeopleIri,
+  parentCompanyIri,
+  clientLinkType,
+  setRegistrationForm,
+  setOriginalRegistrationForm,
+}) {
+  const [peopleLinkId, setPeopleLinkId] = useState('');
+
+  useEffect(() => {
+    if (!canEditLinkType || typeof getItems !== 'function') {
+      return undefined;
+    }
+
+    let cancelled = false;
+
+    getItems({
+      people: extractId(contactPeopleIri),
+      company: extractId(parentCompanyIri),
+    })
+      .then(items => {
+        if (cancelled || !Array.isArray(items) || items.length === 0) {
+          return;
+        }
+
+        const link = items[0];
+        const nextLinkType = resolveSeededLinkType(
+          clientLinkType,
+          link?.linkType,
+        );
+        const nextLinkId = String(link?.id || link?.['@id'] || '').replace(
+          /\D/g,
+          '',
+        );
+
+        setPeopleLinkId(nextLinkId);
+        setRegistrationForm(prev => ({...prev, linkType: nextLinkType}));
+        setOriginalRegistrationForm(prev => ({
+          ...prev,
+          linkType: nextLinkType,
+        }));
+      })
+      .catch(() => {});
+
+    return () => {
+      cancelled = true;
+    };
+  }, [
+    canEditLinkType,
+    getItems,
+    contactPeopleIri,
+    parentCompanyIri,
+    clientLinkType,
+    setRegistrationForm,
+    setOriginalRegistrationForm,
+  ]);
+
+  return {peopleLinkId, setPeopleLinkId};
+}

package/src/react/components/tabs/usersTabHelpers.js

@@ -1,3 +1,4 @@
+const { mapPasswordErrorMessage } = require('@controleonline/ui-common/src/react/utils/passwordPolicy');
 const extractId = value => String(value || '').replace(/\D/g, '');
 
 /** API Platform expects people as IRI (e.g. /people/106218), not a bare id. */
@@ -22,7 +23,6 @@ const buildUsersListQuery = client => {
   };
 };
 
-
 const normalizeUserItem = entry => {
   if (!entry) {
     return null;
@@ -109,35 +109,36 @@ const copyTextToClipboard = async text => {
 };
 
 const extractErrorMessage = error => {
+  let message = '';
   if (Array.isArray(error?.violations) && error.violations.length) {
-    return error.violations
+    message = error.violations
       .map(item => item?.message || item)
       .filter(Boolean)
       .join('\n');
-  }
-
-  if (Array.isArray(error?.message)) {
-    return error.message
+  } else if (Array.isArray(error?.message)) {
+    message = error.message
       .map(item => item?.message || item)
       .filter(Boolean)
       .join(', ');
-  }
-
-  const status = error?.response?.status || error?.status;
-  if (status === 401) {
-    return 'Autenticação necessária. Faça login novamente e tente criar o usuário.';
-  }
-
-  if (error?.response?.data?.message) {
-    return String(error.response.data.message);
-  }
-
-  const msg = error?.message || error?.error || (typeof error === 'string' ? error : '');
-  if (/authentication required/i.test(String(msg))) {
-    return 'Autenticação necessária. Faça login novamente e tente criar o usuário.';
-  }
-
-  return msg;
+  } else {
+    const status = error?.response?.status || error?.status;
+    if (status === 401) {
+      message =
+        'Autenticação necessária. Faça login novamente e tente criar o usuário.';
+    } else if (error?.response?.data?.message) {
+      message = String(error.response.data.message);
+    } else {
+      message =
+        error?.message ||
+        error?.error ||
+        (typeof error === 'string' ? error : '');
+      if (/authentication required/i.test(String(message))) {
+        message =
+          'Autenticação necessária. Faça login novamente e tente criar o usuário.';
+      }
+    }
+  }
+  return mapPasswordErrorMessage(message || '');
 };
 
 const apiKeyModalStyles = {

package/src/react/pages/details.page.styles.js

@@ -1,105 +1,119 @@
-import { StyleSheet } from 'react-native';
-import { colors } from '@controleonline/../../src/styles/colors';
-
-const styles = StyleSheet.create({
-  container: {
-    flex: 1,
-    backgroundColor: '#F8FAFC',
-  },
-  headerProfile: {
-    alignItems: 'center',
-    paddingVertical: 20,
-    backgroundColor: '#F8FAFC',
-  },
+import { StyleSheet } from 'react-native';
+import { colors } from '@controleonline/../../src/styles/colors';
+
+const styles = StyleSheet.create({
+  container: {
+    flex: 1,
+    backgroundColor: '#F8FAFC',
+  },
+  headerProfile: {
+    alignItems: 'center',
+    paddingVertical: 20,
+    backgroundColor: '#F8FAFC',
+  },
   avatarContainer: {
     position: 'relative',
     marginBottom: 12,
   },
   profileName: {
-    fontSize: 20,
-    fontWeight: '700',
-    color: '#0F172A',
-    marginBottom: 4,
-    textAlign: 'center',
-    maxWidth: '86%',
-  },
-  profileId: {
-    fontSize: 14,
-    color: '#64748B',
-    fontWeight: '500',
-  },
-  tabsHeader: {
-    flexDirection: 'row',
-    backgroundColor: '#fff',
-    borderBottomWidth: 1,
-    borderBottomColor: '#F1F5F9',
-  },
-  tabButton: {
-    flex: 1,
-    alignItems: 'center',
-    paddingVertical: 16,
-    position: 'relative',
-  },
-  tabButtonText: {
-    fontSize: 14,
-    fontWeight: '600',
-    color: '#64748B',
-  },
-  tabButtonTextActive: {
-    color: colors.primary,
-    fontWeight: '700',
-  },
-  activeIndicator: {
-    position: 'absolute',
-    bottom: 0,
-    width: '60%',
-    height: 3,
-    backgroundColor: colors.primary,
-    borderTopLeftRadius: 3,
-    borderTopRightRadius: 3,
-  },
-  contentContainer: {
-    flex: 1,
-  },
-  scrollContent: {
-    flexGrow: 1,
-  },
-  tabPane: {
-    height: '100%',
-  },
-  tabScroll: {
-    flex: 1,
-  },
-  skeletonContent: {
-    paddingHorizontal: 16,
-    paddingTop: 16,
-  },
-  skeletonCircle: {
-    backgroundColor: '#E2E8F0',
-  },
-  skeletonLine: {
-    backgroundColor: '#E2E8F0',
-    borderRadius: 8,
-  },
-  skeletonTab: {
-    flex: 1,
-    height: 36,
-    marginHorizontal: 8,
-    marginVertical: 10,
-    borderRadius: 10,
-    backgroundColor: '#E2E8F0',
-  },
-  skeletonCard: {
-    backgroundColor: '#FFFFFF',
-    borderRadius: 14,
-    padding: 16,
-    marginBottom: 12,
-    shadowColor: '#000',
-    shadowOffset: { width: 0, height: 2 },
-    shadowOpacity: 0.06,
-    shadowRadius: 6,
-    elevation: 2,
-  },
-});
-
-export default styles;
+    fontSize: 20,
+    fontWeight: '700',
+    color: '#0F172A',
+    marginBottom: 4,
+    textAlign: 'center',
+    maxWidth: '86%',
+  },
+  profileId: {
+    fontSize: 14,
+    color: '#64748B',
+    fontWeight: '500',
+  },
+  removeButton: {
+    marginTop: 12,
+    paddingHorizontal: 16,
+    paddingVertical: 8,
+    borderRadius: 8,
+    borderWidth: 1,
+    borderColor: '#FECACA',
+    backgroundColor: '#FEF2F2',
+  },
+  removeButtonText: {
+    fontSize: 14,
+    fontWeight: '600',
+    color: '#B91C1C',
+  },
+  tabsHeader: {
+    flexDirection: 'row',
+    backgroundColor: '#fff',
+    borderBottomWidth: 1,
+    borderBottomColor: '#F1F5F9',
+  },
+  tabButton: {
+    flex: 1,
+    alignItems: 'center',
+    paddingVertical: 16,
+    position: 'relative',
+  },
+  tabButtonText: {
+    fontSize: 14,
+    fontWeight: '600',
+    color: '#64748B',
+  },
+  tabButtonTextActive: {
+    color: colors.primary,
+    fontWeight: '700',
+  },
+  activeIndicator: {
+    position: 'absolute',
+    bottom: 0,
+    width: '60%',
+    height: 3,
+    backgroundColor: colors.primary,
+    borderTopLeftRadius: 3,
+    borderTopRightRadius: 3,
+  },
+  contentContainer: {
+    flex: 1,
+  },
+  scrollContent: {
+    flexGrow: 1,
+  },
+  tabPane: {
+    height: '100%',
+  },
+  tabScroll: {
+    flex: 1,
+  },
+  skeletonContent: {
+    paddingHorizontal: 16,
+    paddingTop: 16,
+  },
+  skeletonCircle: {
+    backgroundColor: '#E2E8F0',
+  },
+  skeletonLine: {
+    backgroundColor: '#E2E8F0',
+    borderRadius: 8,
+  },
+  skeletonTab: {
+    flex: 1,
+    height: 36,
+    marginHorizontal: 8,
+    marginVertical: 10,
+    borderRadius: 10,
+    backgroundColor: '#E2E8F0',
+  },
+  skeletonCard: {
+    backgroundColor: '#FFFFFF',
+    borderRadius: 14,
+    padding: 16,
+    marginBottom: 12,
+    shadowColor: '#000',
+    shadowOffset: { width: 0, height: 2 },
+    shadowOpacity: 0.06,
+    shadowRadius: 6,
+    elevation: 2,
+  },
+});
+
+export default styles;

package/src/react/pages/employees.js

@@ -47,6 +47,10 @@ export const buildEmployeesContext = routeParams => {
     modalTitleByType,
      detailsRouteName: 'EmployeeDetails',
      useStoreExternalFilter: true,
+     // Collaborators = PF people linked to the currentCompany (PJ) via peopleLink,
+     // whatever the link type, until a concrete link type is picked in the filter.
+     peopleType: 'F',
+     anyLinkType: true,
      detailsRouteParams: (person, selectedLinkType) => ({
        employeeId: normalizeEntityId(person?.id ?? person?.['@id']),
        contextKey: selectedLinkType === 'all' ? '' : String(selectedLinkType || ''),

package/src/react/utils/humanCompanyLinkTypes.js

@@ -0,0 +1,28 @@
+/**
+ * Canonical human↔company link-type catalog for Contatos/Colaboradores.
+ * Values stay aligned with ui-people HUMAN_COMPANY_LINK_TYPES.
+ * Single source for create/edit/list/filter UI options in ui-customers.
+ */
+export const HUMAN_COMPANY_LINK_TYPES = [
+  'employee',
+  'owner',
+  'director',
+  'manager',
+  'salesman',
+  'after-sales',
+  'courier',
+];
+
+export const HUMAN_COMPANY_LINK_TYPE_OPTIONS = HUMAN_COMPANY_LINK_TYPES.map(
+  value => ({
+    value,
+    translationKey: value,
+  }),
+);
+
+export const isHumanCompanyLinkType = value =>
+  HUMAN_COMPANY_LINK_TYPES.includes(
+    String(value || '')
+      .trim()
+      .toLowerCase(),
+  );