@controleonline/ui-customers 1.0.88 → 1.0.89

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@controleonline/ui-customers",
-  "version": "1.0.88",
+  "version": "1.0.89",
   "author": "ControleOnline",
   "description": "ControleOnline customers Quasar UI Component",
   "license": "MIT",

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

@@ -14,7 +14,7 @@ import {
 import Icon from 'react-native-vector-icons/MaterialIcons';
 import { useMessage } from '@controleonline/ui-common/src/react/components/MessageService';
 import { resolveFileDownloadUrl } from '@controleonline/ui-common/src/react/utils/fileUrl';
-import { colors } from '@controleonline/ui-layout/src/styles/colors';
+import { colors } from '@controleonline/../../src/styles/colors';
 import DefaultUpload from '@controleonline/ui-default/src/react/components/upload/DefaultUpload';
 import {
   extractId,

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

@@ -63,11 +63,24 @@ const DocumentsTab = ({ client, customStyles, isEditing, onUpdateClient }) => {
   const getters = documentsTypesStore.getters || {};
   const { items = [] } = getters;
 
-  const resolveTypeLabel = typeIri =>
-    items.find(item => item['@id'] === typeIri)?.documentType || String(typeIri || '');
+  const resolveTypeLabel = (typeIri, rawDocument) => {
+    const rawType = rawDocument?.documentType;
+    const embeddedLabel =
+      rawType && typeof rawType === 'object' ? rawType.documentType : '';
+    if (embeddedLabel) {
+      return String(embeddedLabel);
+    }
+    const storeLabel = items.find(item => item['@id'] === typeIri)?.documentType;
+    if (storeLabel) {
+      return String(storeLabel);
+    }
+    return /^\/?document_types\/\d+$/.test(String(typeIri || ''))
+      ? ''
+      : String(typeIri || '');
+  };
 
-  const applyMask = (value, type) =>
-    applyDocumentMask(value, resolveTypeLabel(type));
+  const applyMask = (value, type, rawDocument) =>
+    applyDocumentMask(value, resolveTypeLabel(type, rawDocument));
 
   const syncClientDocuments = nextDocuments => {
     if (typeof onUpdateClient !== 'function') {
@@ -77,7 +90,10 @@ const DocumentsTab = ({ client, customStyles, isEditing, onUpdateClient }) => {
       '@id': `/documents/${documentItem.id}`,
       id: documentItem.id,
       document: documentItem.value,
-      documentType: documentItem.type,
+      documentType:
+        documentItem.raw?.documentType?.['@id'] === documentItem.type
+          ? documentItem.raw.documentType
+          : documentItem.type,
       documentFiles: documentItem.files || [],
       file: documentItem.files?.[0]?.file || null,
     }));
@@ -122,7 +138,7 @@ const DocumentsTab = ({ client, customStyles, isEditing, onUpdateClient }) => {
     setEditingItem(item);
     setFormData(
       item
-        ? { type: item.type, value: applyMask(String(item.value || ''), item.type) }
+        ? { type: item.type, value: applyMask(String(item.value || ''), item.type, item.raw) }
         : { type: '', value: '' },
     );
     setShowModal(true);
@@ -320,9 +336,13 @@ const DocumentsTab = ({ client, customStyles, isEditing, onUpdateClient }) => {
                     <Icon name="description" size={20} color={customStyles.cardItemIcon.color} />
                     <View>
                       <Text style={customStyles.itemText}>
-                        {applyMask(String(doc.value || ''), doc.type)}
+                        {[
+                          resolveTypeLabel(doc.type, doc.raw),
+                          applyMask(String(doc.value || ''), doc.type, doc.raw),
+                        ]
+                          .filter(Boolean)
+                          .join(': ')}
                       </Text>
-                      <Text style={customStyles.itemSubtext}>{resolveTypeLabel(doc.type)}</Text>
                     </View>
                   </View>
                   {isEditing && (

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

@@ -10,7 +10,7 @@ import {
 import { Picker } from '@react-native-picker/picker';
 import Icon from 'react-native-vector-icons/MaterialIcons';
 import AnimatedModal from '@controleonline/ui-common/src/react/components/AnimatedModal';
-import { colors } from '@controleonline/ui-layout/src/styles/colors';
+import { colors } from '@controleonline/../../src/styles/colors';
 
 const styles = {
   modalCard: {

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

@@ -13,7 +13,7 @@ import { useStore } from '@store';
 import PeopleAvatar from '@controleonline/ui-people/src/react/components/PeopleAvatar';
 import { useMessage } from '@controleonline/ui-common/src/react/components/MessageService';
 import Icon from 'react-native-vector-icons/MaterialIcons';
-import { colors } from '@controleonline/ui-layout/src/styles/colors';
+import { colors } from '@controleonline/../../src/styles/colors';
 
 import {
   buildFranchiseLinkReadParams,

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

@@ -7,11 +7,10 @@ import {
 } from 'react-native';
 import { useStore } from '@store';
 import DefaultUpload from '@controleonline/ui-default/src/react/components/upload/DefaultUpload';
-import DefaultFile from '@controleonline/ui-default/src/react/components/files/DefaultFile';
 import { extractFileId } from '@controleonline/ui-default/src/react/components/upload/fileUpload';
 import { useMessage } from '@controleonline/ui-common/src/react/components/MessageService';
-import { resolveThemePalette, withOpacity } from '@controleonline/ui-layout/src/styles/branding';
-import { colors } from '@controleonline/ui-layout/src/styles/colors';
+import { resolveThemePalette, withOpacity } from '@controleonline/../../src/styles/branding';
+import { colors } from '@controleonline/../../src/styles/colors';
 
 const COMPANY_MEDIA_ACCEPT_ATTRIBUTE = 'image/png,image/jpeg,.png,.jpg,.jpeg';
 
@@ -215,46 +214,6 @@ const MediaTab = ({ client, onChanged = null }) => {
                     },
                   ]}
                 >
-                  <View
-                    style={[
-                      styles.mediaPreviewFrame,
-                      styles.mediaPreviewTransparencyGrid,
-                      {
-                        borderColor: withOpacity(palette.primary || '#2563EB', 0.14),
-                      },
-                    ]}>
-                    {(() => {
-                      const rawFile = currentMedia?.file;
-                      const fileId = extractFileId(rawFile);
-                      const file =
-                        rawFile && typeof rawFile === 'object' && !Array.isArray(rawFile)
-                          ? rawFile
-                          : fileId
-                            ? {id: fileId, '@id': `/files/${fileId}`}
-                            : null;
-                      if (!file) {
-                        return (
-                          <View style={styles.mediaEmptyState}>
-                            <Text
-                              style={[
-                                styles.mediaEmptyText,
-                                {color: palette.textSecondary || '#64748B'},
-                              ]}>
-                              Sem imagem
-                            </Text>
-                          </View>
-                        );
-                      }
-                      return (
-                        <DefaultFile
-                          file={file}
-                          company={client}
-                          resizeMode="cover"
-                          style={styles.mediaPreviewImage}
-                        />
-                      );
-                    })()}
-                  </View>
                   <DefaultUpload
                     relationStoreName="people"
                     relationField="people"
@@ -360,38 +319,6 @@ const styles = StyleSheet.create({
     fontSize: 12,
     fontWeight: '700',
   },
-  // app-community#813: preview 320x320
-  mediaPreviewFrame: {
-    width: 320,
-    height: 320,
-    maxWidth: 320,
-    alignSelf: 'center',
-    borderRadius: 14,
-    borderWidth: 1,
-    overflow: 'hidden',
-    alignItems: 'center',
-    justifyContent: 'center',
-  },
-  mediaPreviewTransparencyGrid: {
-    // RN StyleSheet (web) rejects multi-value backgroundPosition / CSS backgroundImage gradients.
-    // Keep solid preview background; checkerboard was cosmetic only.
-    backgroundColor: '#F8FAFC',
-  },
-  mediaPreviewImage: {
-    width: 320,
-    height: 320,
-  },
-  mediaEmptyState: {
-    width: 320,
-    height: 320,
-    alignItems: 'center',
-    justifyContent: 'center',
-    gap: 8,
-  },
-  mediaEmptyText: {
-    fontSize: 13,
-    fontWeight: '500',
-  },
   mediaHelpText: {
     fontSize: 12,
     lineHeight: 18,

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

@@ -2,7 +2,7 @@ import React, { useMemo, useCallback } from 'react';
 import { Text, TouchableOpacity, View } from 'react-native';
 import { useNavigation } from '@react-navigation/native';
 import Icon from 'react-native-vector-icons/MaterialIcons';
-import { colors } from '@controleonline/ui-layout/src/styles/colors';
+import { colors } from '@controleonline/../../src/styles/colors';
 import styles from './ProductsTab.styles';
 import {
   buildCreateProductParams,

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

@@ -10,7 +10,7 @@ import {
 import { Picker } from '@react-native-picker/picker';
 import Icon from 'react-native-vector-icons/MaterialIcons';
 import AnimatedModal from '@controleonline/ui-common/src/react/components/AnimatedModal';
-import { colors } from '@controleonline/ui-layout/src/styles/colors';
+import { colors } from '@controleonline/../../src/styles/colors';
 
 const styles = {
   modalCard: {

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

@@ -31,7 +31,7 @@ import { normalizeSalesmanLink } from './salesmanTab.helpers';
 import SalesmanManageModal from './SalesmanManageModal';
 import { useSalesmanManage } from './useSalesmanManage';
 import Icon from 'react-native-vector-icons/MaterialIcons';
-import { colors } from '@controleonline/ui-layout/src/styles/colors';
+import { colors } from '@controleonline/../../src/styles/colors';
 import SalesmanCommissionBlock from './SalesmanCommissionBlock';
 
 import {

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

@@ -1,5 +1,5 @@
 import { StyleSheet } from 'react-native';
-import { colors } from '@controleonline/ui-layout/src/styles/colors';
+import { colors } from '@controleonline/../../src/styles/colors';
 
 const styles = StyleSheet.create({
   container: {
@@ -28,6 +28,20 @@ const styles = StyleSheet.create({
     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',