@controleonline/ui-common 1.2.70

package/src/react/utils/storeColumns.js

@@ -0,0 +1,427 @@
+import { getAllStores } from '@store';
+import { formatHumanLabel } from '@controleonline/ui-common/src/react/utils/entityDisplay';
+
+const normalizeText = value => String(value || '').trim();
+
+const singularizeResourceName = resourceName => {
+  const normalized = normalizeText(resourceName).replace(/^\/+|\/+$/g, '');
+  if (!normalized) {
+    return '';
+  }
+
+  if (normalized.endsWith('ies')) {
+    return `${normalized.slice(0, -3)}y`;
+  }
+
+  if (normalized.endsWith('sses') || normalized.endsWith('ses')) {
+    return normalized.slice(0, -2);
+  }
+
+  if (normalized.endsWith('s') && !normalized.endsWith('ss')) {
+    return normalized.slice(0, -1);
+  }
+
+  return normalized;
+};
+
+const normalizeKey = value =>
+  normalizeText(value)
+    .replace(/[^a-zA-Z0-9]/g, '')
+    .toLowerCase();
+
+const extractEntityResource = entityIri => {
+  const normalizedIri = normalizeText(entityIri);
+  if (!normalizedIri) {
+    return '';
+  }
+
+  const segments = normalizedIri.split('/').filter(Boolean);
+  if (segments.length < 2) {
+    return '';
+  }
+
+  return normalizeText(segments[segments.length - 2]);
+};
+
+const getStoreColumns = store => {
+  const columns = store?.getters?.columns || store?.columns;
+  return Array.isArray(columns) ? columns.filter(Boolean) : [];
+};
+
+const getStoreEndpoint = store =>
+  normalizeText(store?.getters?.resourceEndpoint || store?.resourceEndpoint).replace(
+    /^\/+|\/+$/g,
+    '',
+  );
+
+const normalizeComparableValue = value => {
+  if (value === null || value === undefined || value === '') {
+    return '';
+  }
+
+  if (typeof value === 'object' && !Array.isArray(value)) {
+    return normalizeComparableValue(
+      value?.value ?? value?.['@id'] ?? value?.id ?? value?.label ?? '',
+    );
+  }
+
+  return normalizeText(value);
+};
+
+const buildRowContext = (row, fieldName, value) => {
+  if (!fieldName) {
+    return row || {};
+  }
+
+  if (!row || typeof row !== 'object' || Array.isArray(row)) {
+    return {[fieldName]: value};
+  }
+
+  return {
+    ...row,
+    [fieldName]: value,
+  };
+};
+
+const resolveListValue = ({column, value, row}) => {
+  if (!Array.isArray(column?.list) || !column.list.length) {
+    return value;
+  }
+
+  const comparableValue = normalizeComparableValue(value);
+  const matchedItem = column.list.find(item => {
+    const currentValue =
+      item?.value ?? item?.['@id'] ?? item?.id ?? item?.label ?? item;
+
+    return normalizeComparableValue(currentValue) === comparableValue;
+  });
+
+  if (!matchedItem) {
+    return value;
+  }
+
+  if (typeof column.formatList === 'function') {
+    const formattedItem = column.formatList(matchedItem, column, row);
+    if (formattedItem && typeof formattedItem === 'object' && !Array.isArray(formattedItem)) {
+      return formattedItem?.label ?? formattedItem?.value ?? matchedItem?.label ?? value;
+    }
+
+    return formattedItem;
+  }
+
+  return matchedItem?.label ?? value;
+};
+
+const normalizeFormattedValue = value => {
+  if (value === null || value === undefined) {
+    return value;
+  }
+
+  if (typeof value === 'object' && !Array.isArray(value)) {
+    return value?.label ?? value?.value ?? value?.name ?? value;
+  }
+
+  return value;
+};
+
+const DEFAULT_TRANSLATABLE_FIELDS = new Set([
+  'active',
+  'app',
+  'channel',
+  'displaytype',
+  'featured',
+  'frequency',
+  'invoicetype',
+  'installments',
+  'ordertype',
+  'peopletype',
+  'pricecalculation',
+  'productcondition',
+  'realstatus',
+  'status',
+]);
+
+const shouldTranslateColumnValue = ({column, storeName, value}) => {
+  if (column?.translate === false || typeof value !== 'string' || !normalizeText(storeName)) {
+    return false;
+  }
+
+  if (column?.translate === true || Array.isArray(column?.list)) {
+    return true;
+  }
+
+  const candidates = [column?.key, column?.name, column?.label]
+    .map(normalizeKey)
+    .filter(Boolean);
+
+  return candidates.some(candidate => DEFAULT_TRANSLATABLE_FIELDS.has(candidate));
+};
+
+const translateColumnValue = ({column, storeName, value}) => {
+  if (!shouldTranslateColumnValue({column, storeName, value})) {
+    return value;
+  }
+
+  const translateFn =
+    typeof globalThis !== 'undefined' && typeof globalThis?.t?.t === 'function'
+      ? globalThis.t.t.bind(globalThis.t)
+      : null;
+
+  return translateFn ? translateFn(storeName, 'span', value) : value;
+};
+
+const translateColumnLabel = ({column, fieldName, storeName, fallbackLabel = ''}) => {
+  if (!normalizeText(storeName)) {
+    return fallbackLabel;
+  }
+
+  const translateFn =
+    typeof globalThis !== 'undefined' && typeof globalThis?.t?.t === 'function'
+      ? globalThis.t.t.bind(globalThis.t)
+      : null;
+  if (!translateFn) {
+    return fallbackLabel;
+  }
+
+  const candidates = [
+    normalizeText(fieldName),
+    normalizeText(column?.name),
+    normalizeText(column?.key),
+    normalizeText(column?.label),
+  ].filter(Boolean);
+
+  for (const candidate of candidates) {
+    const translated = translateFn(storeName, 'label', candidate);
+    if (normalizeText(translated) && normalizeText(translated) !== formatHumanLabel(candidate)) {
+      return translated;
+    }
+  }
+
+  return fallbackLabel;
+};
+
+export const resolveStoreConfigByName = storeName => {
+  const normalizedStoreName = normalizeText(storeName);
+  const stores = getAllStores();
+  const store = stores?.[normalizedStoreName];
+  const resourceEndpoint = getStoreEndpoint(store);
+
+  return {
+    columns: getStoreColumns(store),
+    resourceEndpoint,
+    resourceName: resourceEndpoint,
+    store,
+    storeName: normalizedStoreName,
+  };
+};
+
+export const resolveStoreConfigByClassName = className => {
+  const normalizedClassKey = normalizeKey(
+    String(className || '').split('\\').filter(Boolean).pop(),
+  );
+  if (!normalizedClassKey) {
+    return {
+      columns: [],
+      resourceEndpoint: '',
+      resourceName: '',
+      store: null,
+      storeName: '',
+    };
+  }
+
+  const stores = getAllStores();
+  const candidates = Object.entries(stores || {})
+    .map(([storeName, store]) => {
+      const resourceEndpoint = getStoreEndpoint(store);
+      const normalizedEndpoint = singularizeResourceName(resourceEndpoint);
+      const columns = getStoreColumns(store);
+      const endpointKey = normalizeKey(normalizedEndpoint);
+      const resourceKey = normalizeKey(resourceEndpoint);
+      const storeKey = normalizeKey(storeName);
+
+      let score = 0;
+      if (endpointKey === normalizedClassKey) score += 4;
+      if (storeKey === normalizedClassKey) score += 3;
+      if (resourceKey === normalizedClassKey) score += 2;
+      if (!score) {
+        return null;
+      }
+
+      if (columns.length) score += 1;
+
+      return {
+        columns,
+        resourceEndpoint,
+        resourceName: resourceEndpoint,
+        score,
+        store,
+        storeName,
+      };
+    })
+    .filter(Boolean)
+    .sort((left, right) => {
+      if (right.score !== left.score) {
+        return right.score - left.score;
+      }
+
+      return right.columns.length - left.columns.length;
+    });
+
+  return candidates[0] || {
+    columns: [],
+    resourceEndpoint: '',
+    resourceName: '',
+    store: null,
+    storeName: '',
+  };
+};
+
+export const resolveStoreConfigByEntity = ({entity = null, entityIri = ''} = {}) => {
+  const resolvedEntityIri =
+    normalizeText(entity?.['@id']) || normalizeText(entityIri);
+  const resourceName = extractEntityResource(resolvedEntityIri);
+  if (!resourceName) {
+    return {
+      columns: [],
+      resourceEndpoint: '',
+      resourceName: '',
+      store: null,
+      storeName: '',
+    };
+  }
+
+  const normalizedResourceName = singularizeResourceName(resourceName);
+  const stores = getAllStores();
+
+  const candidates = Object.entries(stores || {})
+    .map(([storeName, store]) => {
+      const resourceEndpoint = getStoreEndpoint(store);
+      const normalizedEndpoint = singularizeResourceName(resourceEndpoint);
+      const columns = getStoreColumns(store);
+
+      if (
+        !resourceEndpoint ||
+        (resourceEndpoint !== resourceName && normalizedEndpoint !== normalizedResourceName)
+      ) {
+        return null;
+      }
+
+      let score = 0;
+      if (resourceEndpoint === resourceName) score += 4;
+      if (storeName === resourceName) score += 3;
+      if (storeName === normalizedResourceName) score += 2;
+      if (resourceEndpoint === storeName) score += 1;
+      if (columns.length) score += 1;
+
+      return {
+        columns,
+        resourceEndpoint,
+        resourceName,
+        score,
+        store,
+        storeName,
+      };
+    })
+    .filter(Boolean)
+    .sort((left, right) => {
+      if (right.score !== left.score) {
+        return right.score - left.score;
+      }
+
+      return right.columns.length - left.columns.length;
+    });
+
+  return candidates[0] || {
+    columns: [],
+    resourceEndpoint: '',
+    resourceName,
+    store: null,
+    storeName: '',
+  };
+};
+
+export const resolveStoreColumn = (columns = [], fieldName = '') => {
+  const normalizedFieldName = normalizeKey(fieldName);
+  if (!normalizedFieldName) {
+    return null;
+  }
+
+  return columns.find(column => {
+    const candidateNames = [
+      column?.key,
+      column?.name,
+      column?.label,
+    ]
+      .map(normalizeKey)
+      .filter(Boolean);
+
+    return candidateNames.includes(normalizedFieldName);
+  }) || null;
+};
+
+export const formatStoreColumnLabel = ({
+  columns = [],
+  fieldName = '',
+  fallbackLabel = '',
+  storeName = '',
+} = {}) => {
+  const column = resolveStoreColumn(columns, fieldName);
+  if (!column?.label) {
+    return fallbackLabel;
+  }
+
+  const normalizedLabel = normalizeText(column.label);
+  if (!normalizedLabel) {
+    return fallbackLabel;
+  }
+
+  const directTranslatedLabel = translateColumnLabel({
+    column,
+    fallbackLabel,
+    fieldName,
+    storeName,
+  });
+  if (directTranslatedLabel) {
+    return formatHumanLabel(directTranslatedLabel) || directTranslatedLabel;
+  }
+
+  const resolvedLabel = translateColumnValue({
+    column,
+    storeName,
+    value: normalizedLabel,
+  });
+
+  return formatHumanLabel(resolvedLabel) || resolvedLabel;
+};
+
+// Replica a logica central de columns do store para usos fora das listagens padrao.
+export const formatStoreColumnValue = ({
+  columns = [],
+  fieldName = '',
+  row = null,
+  storeName = '',
+  value,
+} = {}) => {
+  const column = resolveStoreColumn(columns, fieldName);
+  if (!column) {
+    return undefined;
+  }
+
+  const rowContext = buildRowContext(row, fieldName, value);
+  const resolvedValue = resolveListValue({
+    column,
+    row: rowContext,
+    value,
+  });
+
+  let formattedValue = resolvedValue;
+  if (typeof column.format === 'function') {
+    formattedValue = column.format(resolvedValue, column, rowContext, false);
+  }
+
+  return translateColumnValue({
+    column,
+    storeName,
+    value: normalizeFormattedValue(formattedValue),
+  });
+};

package/src/react/utils/systemErrorChannel.js

@@ -0,0 +1,109 @@
+import {resolveSystemErrorMessage} from './systemErrorMessage'
+
+export const DEFAULT_SYSTEM_ERROR_DEDUPE_WINDOW_MS = 1200
+
+const listeners = new Set()
+const pendingPayloads = []
+
+let lastFingerprint = ''
+let lastPublishedAt = 0
+
+const resolveDedupeWindow = options => {
+  const value = Number(options?.dedupeWindowMs)
+  if (Number.isFinite(value) && value >= 0) {
+    return value
+  }
+
+  return DEFAULT_SYSTEM_ERROR_DEDUPE_WINDOW_MS
+}
+
+export const getSystemErrorFingerprint = (error, options = {}) => {
+  const message = resolveSystemErrorMessage(error)
+
+  if (!message) {
+    return ''
+  }
+
+  return JSON.stringify({
+    message,
+    position: String(options?.position || ''),
+    providerKey: String(options?.providerKey || ''),
+  })
+}
+
+const shouldSkipDuplicate = (fingerprint, options = {}) => {
+  if (!fingerprint || options?.dedupe === false) {
+    return false
+  }
+
+  const now = Date.now()
+  const dedupeWindowMs = resolveDedupeWindow(options)
+
+  if (
+    lastFingerprint === fingerprint &&
+    now - lastPublishedAt < dedupeWindowMs
+  ) {
+    return true
+  }
+
+  lastFingerprint = fingerprint
+  lastPublishedAt = now
+  return false
+}
+
+const emitPayload = payload => {
+  if (listeners.size === 0) {
+    pendingPayloads.push(payload)
+    return true
+  }
+
+  listeners.forEach(listener => listener(payload))
+  return true
+}
+
+export const publishSystemError = (error, options = {}) => {
+  const message = resolveSystemErrorMessage(error)
+
+  if (!message) {
+    return false
+  }
+
+  const fingerprint =
+    options?.dedupeKey || getSystemErrorFingerprint(message, options)
+
+  if (shouldSkipDuplicate(fingerprint, options)) {
+    return false
+  }
+
+  return emitPayload({
+    error,
+    message,
+    options,
+  })
+}
+
+export const subscribeSystemErrors = listener => {
+  if (typeof listener !== 'function') {
+    return () => {}
+  }
+
+  listeners.add(listener)
+
+  if (pendingPayloads.length > 0) {
+    const queuedPayloads = pendingPayloads.splice(0, pendingPayloads.length)
+    queuedPayloads.forEach(payload => listener(payload))
+  }
+
+  return () => {
+    listeners.delete(listener)
+  }
+}
+
+export const resetSystemErrorChannel = () => {
+  listeners.clear()
+  pendingPayloads.length = 0
+  lastFingerprint = ''
+  lastPublishedAt = 0
+}
+
+export default publishSystemError

package/src/react/utils/systemErrorMessage.js

@@ -0,0 +1,67 @@
+const normalizeText = value => String(value || '').trim()
+
+const resolveMessageList = items =>
+  (Array.isArray(items) ? items : [])
+    .map(item =>
+      normalizeText(
+        item?.['hydra:description'] ||
+          item?.['hydra:title'] ||
+          item?.message ||
+          item?.title ||
+          item?.detail ||
+          item?.description ||
+          item,
+      ),
+    )
+    .filter(Boolean)
+    .join('\n')
+    .trim()
+
+export const resolveSystemErrorMessage = error => {
+  if (error === undefined || error === null) {
+    return ''
+  }
+
+  if (typeof error === 'string') {
+    return error.trim()
+  }
+
+  if (Array.isArray(error)) {
+    return resolveMessageList(error)
+  }
+
+  if (Array.isArray(error?.message)) {
+    return resolveMessageList(error.message)
+  }
+
+  if (Array.isArray(error?.violations)) {
+    return resolveMessageList(error.violations)
+  }
+
+  if (error?.response?.data) {
+    const responseMessage = resolveSystemErrorMessage(error.response.data)
+    if (responseMessage) {
+      return responseMessage
+    }
+  }
+
+  if (error?.body) {
+    const bodyMessage = resolveSystemErrorMessage(error.body)
+    if (bodyMessage) {
+      return bodyMessage
+    }
+  }
+
+  return normalizeText(
+    error?.['hydra:description'] ||
+      error?.['hydra:title'] ||
+      error?.detail ||
+      error?.description ||
+      error?.errmsg ||
+      error?.error ||
+      error?.message ||
+      error?.title,
+  )
+}
+
+export default resolveSystemErrorMessage

package/src/react/utils/toastPresentation.js

@@ -0,0 +1,53 @@
+const TOAST_STYLE_KEYS = ['pressable', 'view', 'text', 'indicator']
+
+const isPlainObject = value =>
+  value && typeof value === 'object' && !Array.isArray(value)
+
+export const TOAST_ERROR_STYLES = {
+  pressable: {
+    backgroundColor: '#FFF7F7',
+    borderColor: '#FECACA',
+    borderWidth: 1,
+  },
+  indicator: {
+    backgroundColor: '#DC2626',
+  },
+}
+
+export const TOAST_WARNING_STYLES = {
+  indicator: {
+    backgroundColor: '#e67e22',
+  },
+}
+
+export const mergeToastStyles = (...styleSets) =>
+  styleSets.reduce((mergedStyles, currentStyleSet) => {
+    if (!isPlainObject(currentStyleSet)) {
+      return mergedStyles
+    }
+
+    TOAST_STYLE_KEYS.forEach(styleKey => {
+      if (!isPlainObject(currentStyleSet[styleKey])) {
+        return
+      }
+
+      mergedStyles[styleKey] = {
+        ...(mergedStyles[styleKey] || {}),
+        ...currentStyleSet[styleKey],
+      }
+    })
+
+    return mergedStyles
+  }, {})
+
+export const withErrorToastStyles = (options = {}) => ({
+  ...options,
+  styles: mergeToastStyles(TOAST_ERROR_STYLES, options?.styles),
+})
+
+export const withWarningToastStyles = (options = {}) => ({
+  ...options,
+  styles: mergeToastStyles(TOAST_WARNING_STYLES, options?.styles),
+})
+
+export default withErrorToastStyles