@controleonline/ui-default 1.0.263

package/src/react/utils/tableVisibleColumnsPreferences.js

@@ -0,0 +1,264 @@
+export const TABLE_VISIBLE_COLUMNS_PREFERENCES_KEY = 'tableVisibleColumns';
+export const TABLE_VIEW_MODE_PREFERENCES_KEY = 'tableViewModes';
+export const TABLE_SORT_PREFERENCES_KEY = 'tableSorts';
+export const TABLE_SORT_FIELD_PREFERENCES_KEY = 'tableSortFields';
+export const TABLE_SORT_DIRECTION_PREFERENCES_KEY = 'tableSortDirections';
+export const DEFAULT_TABLE_PREFERENCES_STORAGE_KEY = 'DefaultTablePreferences';
+
+const isPlainObject = value =>
+  !!value && typeof value === 'object' && !Array.isArray(value);
+
+const getColumnKey = column => column?.key || column?.name || '';
+
+const readStoredPreferences = () => {
+  try {
+    const rawValue = globalThis?.localStorage?.getItem?.(
+      DEFAULT_TABLE_PREFERENCES_STORAGE_KEY,
+    );
+
+    if (!rawValue) {
+      return {};
+    }
+
+    const parsedValue = JSON.parse(rawValue);
+    return isPlainObject(parsedValue) ? parsedValue : {};
+  } catch {
+    return {};
+  }
+};
+
+const writeStoredPreferences = preferences => {
+  try {
+    globalThis?.localStorage?.setItem?.(
+      DEFAULT_TABLE_PREFERENCES_STORAGE_KEY,
+      JSON.stringify(preferences),
+    );
+  } catch {
+    // localStorage can be unavailable in some runtimes
+  }
+};
+
+export const buildDefaultVisibleColumns = columns =>
+  (Array.isArray(columns) ? columns : []).reduce((accumulator, column) => {
+    const key = getColumnKey(column);
+    if (key) {
+      accumulator[key] = column?.visible !== false;
+    }
+    return accumulator;
+  }, {});
+
+export const sanitizeVisibleColumnsPreference = ({
+  columns = [],
+  visibleColumns = null,
+}) => {
+  const defaultVisibleColumns = buildDefaultVisibleColumns(columns);
+
+  if (!isPlainObject(visibleColumns)) {
+    return defaultVisibleColumns;
+  }
+
+  return Object.keys(defaultVisibleColumns).reduce((accumulator, key) => {
+    accumulator[key] =
+      typeof visibleColumns[key] === 'boolean'
+        ? visibleColumns[key]
+        : defaultVisibleColumns[key];
+    return accumulator;
+  }, {});
+};
+
+export const resolveStoredVisibleColumnsPreference = preferenceKey => {
+  if (!preferenceKey) {
+    return null;
+  }
+
+  const storedPreferences = readStoredPreferences();
+  const tableVisibleColumns = storedPreferences[TABLE_VISIBLE_COLUMNS_PREFERENCES_KEY];
+
+  if (!isPlainObject(tableVisibleColumns)) {
+    return null;
+  }
+
+  const pagePreference = tableVisibleColumns[preferenceKey];
+  return isPlainObject(pagePreference) ? pagePreference : null;
+};
+
+export const persistVisibleColumnsPreference = (
+  preferenceKey = '',
+  visibleColumns = {},
+) => {
+  if (!preferenceKey || !isPlainObject(visibleColumns)) {
+    return;
+  }
+
+  const storedPreferences = readStoredPreferences();
+  const tableVisibleColumns = isPlainObject(
+    storedPreferences[TABLE_VISIBLE_COLUMNS_PREFERENCES_KEY],
+  )
+    ? storedPreferences[TABLE_VISIBLE_COLUMNS_PREFERENCES_KEY]
+    : {};
+
+  writeStoredPreferences({
+    ...storedPreferences,
+    [TABLE_VISIBLE_COLUMNS_PREFERENCES_KEY]: {
+      ...tableVisibleColumns,
+      [preferenceKey]: visibleColumns,
+    },
+  });
+};
+
+export const resolveStoredTableViewModePreference = (
+  preferenceKey = '',
+  fallbackViewMode = 'table',
+) => {
+  if (!preferenceKey) {
+    return fallbackViewMode;
+  }
+
+  const storedPreferences = readStoredPreferences();
+  const tableViewModes = storedPreferences[TABLE_VIEW_MODE_PREFERENCES_KEY];
+
+  if (!isPlainObject(tableViewModes)) {
+    return fallbackViewMode;
+  }
+
+  const resolvedViewMode = tableViewModes[preferenceKey];
+  return resolvedViewMode === 'cards' || resolvedViewMode === 'table'
+    ? resolvedViewMode
+    : fallbackViewMode;
+};
+
+export const persistTableViewModePreference = (
+  preferenceKey = '',
+  viewMode = 'table',
+) => {
+  if (!preferenceKey || (viewMode !== 'cards' && viewMode !== 'table')) {
+    return;
+  }
+
+  const storedPreferences = readStoredPreferences();
+  const tableViewModes = isPlainObject(
+    storedPreferences[TABLE_VIEW_MODE_PREFERENCES_KEY],
+  )
+    ? storedPreferences[TABLE_VIEW_MODE_PREFERENCES_KEY]
+    : {};
+
+  writeStoredPreferences({
+    ...storedPreferences,
+    [TABLE_VIEW_MODE_PREFERENCES_KEY]: {
+      ...tableViewModes,
+      [preferenceKey]: viewMode,
+    },
+  });
+};
+
+export const resolveStoredTableSortPreference = (preferenceKey = '') => {
+  if (!preferenceKey) {
+    return null;
+  }
+
+  const storedPreferences = readStoredPreferences();
+  const tableSortFields =
+    storedPreferences[TABLE_SORT_FIELD_PREFERENCES_KEY];
+  const tableSortDirections =
+    storedPreferences[TABLE_SORT_DIRECTION_PREFERENCES_KEY];
+
+  const resolvedField = isPlainObject(tableSortFields)
+    ? tableSortFields[preferenceKey]
+    : '';
+  const resolvedDirection = isPlainObject(tableSortDirections)
+    ? tableSortDirections[preferenceKey]
+    : '';
+
+  if (
+    typeof resolvedField === 'string' &&
+    resolvedField.trim() &&
+    (resolvedDirection === 'asc' || resolvedDirection === 'desc')
+  ) {
+    return {
+      direction: resolvedDirection,
+      field: resolvedField.trim(),
+    };
+  }
+
+  const tableSorts = storedPreferences[TABLE_SORT_PREFERENCES_KEY];
+
+  if (!isPlainObject(tableSorts)) {
+    return null;
+  }
+
+  const resolvedSort = tableSorts[preferenceKey];
+
+  if (!isPlainObject(resolvedSort)) {
+    return null;
+  }
+
+  const direction =
+    resolvedSort.direction === 'asc' || resolvedSort.direction === 'desc'
+      ? resolvedSort.direction
+      : null;
+  const field =
+    typeof resolvedSort.field === 'string' && resolvedSort.field.trim()
+      ? resolvedSort.field.trim()
+      : '';
+
+  if (!direction || !field) {
+    return null;
+  }
+
+  return {
+    direction,
+    field,
+  };
+};
+
+export const persistTableSortPreference = (
+  preferenceKey = '',
+  sort = null,
+) => {
+  if (
+    !preferenceKey ||
+    !isPlainObject(sort) ||
+    (sort.direction !== 'asc' && sort.direction !== 'desc') ||
+    typeof sort.field !== 'string' ||
+    !sort.field.trim()
+  ) {
+    return;
+  }
+
+  const storedPreferences = readStoredPreferences();
+  const tableSortFields = isPlainObject(
+    storedPreferences[TABLE_SORT_FIELD_PREFERENCES_KEY],
+  )
+    ? storedPreferences[TABLE_SORT_FIELD_PREFERENCES_KEY]
+    : {};
+  const tableSortDirections = isPlainObject(
+    storedPreferences[TABLE_SORT_DIRECTION_PREFERENCES_KEY],
+  )
+    ? storedPreferences[TABLE_SORT_DIRECTION_PREFERENCES_KEY]
+    : {};
+  const legacyTableSorts = isPlainObject(
+    storedPreferences[TABLE_SORT_PREFERENCES_KEY],
+  )
+    ? storedPreferences[TABLE_SORT_PREFERENCES_KEY]
+    : {};
+
+  writeStoredPreferences({
+    ...storedPreferences,
+    [TABLE_SORT_FIELD_PREFERENCES_KEY]: {
+      ...tableSortFields,
+      [preferenceKey]: sort.field.trim(),
+    },
+    [TABLE_SORT_DIRECTION_PREFERENCES_KEY]: {
+      ...tableSortDirections,
+      [preferenceKey]: sort.direction,
+    },
+    [TABLE_SORT_PREFERENCES_KEY]: {
+      ...legacyTableSorts,
+      [preferenceKey]: {
+        direction: sort.direction,
+        field: sort.field.trim(),
+      },
+    },
+  });
+};
+

package/src/store/default/actions.js

@@ -0,0 +1,444 @@
+import {api} from '@controleonline/ui-common/src/api';
+import localDB from '@controleonline/ui-common/src/api/localDB';
+import {queue} from '@controleonline/ui-common/src/api/queue';
+import * as types from '@controleonline/ui-default/src/store/default/mutation_types';
+
+let db = null;
+
+export const STORE_ACTION_META_KEY = '__storeMeta'
+
+const isPlainObject = value =>
+  Object.prototype.toString.call(value) === '[object Object]'
+
+const normalizeText = value => String(value ?? '').trim()
+
+const stableSerialize = value => {
+  if (value === null || value === undefined) {
+    return 'null'
+  }
+
+  if (Array.isArray(value)) {
+    return `[${value.map(item => stableSerialize(item)).join(',')}]`
+  }
+
+  if (value instanceof Date) {
+    return JSON.stringify(value.toISOString())
+  }
+
+  if (isPlainObject(value)) {
+    return `{${Object.keys(value)
+      .sort()
+      .map(key => `${JSON.stringify(key)}:${stableSerialize(value[key])}`)
+      .join(',')}}`
+  }
+
+  return JSON.stringify(value)
+}
+
+const normalizeCollectionItems = response => {
+  if (Array.isArray(response)) return response
+  if (Array.isArray(response?.member)) return response.member
+  if (Array.isArray(response?.['hydra:member'])) return response['hydra:member']
+
+  return []
+}
+
+const resolveCollectionTotalItems = (response, items) =>
+  Number(
+    response?.totalItems ||
+      response?.['hydra:totalItems'] ||
+      items?.length ||
+      0,
+  )
+
+const normalizeCollectionItemId = item =>
+  normalizeText(item?.['@id'] || item?.id || '').replace(/\D+/g, '')
+
+const appendCollectionItems = (currentItems, nextItems) => {
+  const mergedItems = Array.isArray(currentItems) ? [...currentItems] : []
+  const incomingItems = Array.isArray(nextItems) ? nextItems : []
+
+  incomingItems.forEach(item => {
+    const itemId = normalizeCollectionItemId(item)
+    const existingIndex = mergedItems.findIndex(
+      currentItem => normalizeCollectionItemId(currentItem) === itemId,
+    )
+
+    if (existingIndex >= 0) {
+      mergedItems[existingIndex] = item
+      return
+    }
+
+    mergedItems.push(item)
+  })
+
+  return mergedItems
+}
+
+export const splitStoreActionPayload = value => {
+  if (!isPlainObject(value)) {
+    return {
+      payload: value,
+      storeMeta: {},
+    }
+  }
+
+  const payload = {...value}
+  const rawStoreMeta = payload[STORE_ACTION_META_KEY]
+  delete payload[STORE_ACTION_META_KEY]
+
+  return {
+    payload,
+    storeMeta: isPlainObject(rawStoreMeta) ? rawStoreMeta : {},
+  }
+}
+
+export const buildStoreErrorCommitOptions = storeMeta => {
+  if (!isPlainObject(storeMeta)) {
+    return {}
+  }
+
+  const options = {}
+
+  if (storeMeta.skipSystemError === true) {
+    options.skipSystemError = true
+  }
+
+  if (typeof storeMeta.dedupeKey === 'string' && storeMeta.dedupeKey.trim()) {
+    options.dedupeKey = storeMeta.dedupeKey.trim()
+  }
+
+  if (typeof storeMeta.providerKey === 'string' && storeMeta.providerKey.trim()) {
+    options.providerKey = storeMeta.providerKey.trim()
+  }
+
+  if (typeof storeMeta.position === 'string' && storeMeta.position.trim()) {
+    options.position = storeMeta.position.trim()
+  }
+
+  return options
+}
+
+const commitStoreError = (commit, error, storeMeta) => {
+  commit(
+    types.SET_ERROR,
+    error?.message || error,
+    buildStoreErrorCommitOptions(storeMeta),
+  )
+}
+
+export const executeQueue = ({commit, getters}, func, callback) => {
+  queue.executeQueue(func, callback);
+};
+
+export const addToQueue = ({commit, getters}, func) => {
+  queue.addToQueue(func);
+};
+export const initQueue = ({commit, getters}, func) => {
+  queue.initQueue(func);
+  return queue;
+};
+
+export const saveOffline = ({commit, getters}, data) => {
+  return;
+};
+
+export const getOfflineItems = ({commit, getters}, params = {}) => {
+  const {storeMeta} = splitStoreActionPayload(params)
+  commit(types.SET_ISLOADING, true);
+  commit(types.SET_ERROR, null);
+  commit(types.SET_SUMMARY, {});
+
+  db = new localDB(getters);
+
+  return db
+    .getItemsByFilters()
+    .then(async data => {
+      if (!data || (Array.isArray(data) && data.length === 0))
+        return getOnlineItems({commit, getters}, params).then(data => {
+          commit(types.SET_ITEM, data);
+          if (getters.offline) saveOffline({commit, getters}, data);
+          return data;
+        });
+    })
+    .catch(e => {
+      commitStoreError(commit, e, storeMeta)
+      throw e;
+    })
+    .finally(() => {
+      commit(types.SET_ISLOADING, false);
+    });
+};
+
+export const getOnlineItems = ({commit, getters}, params = {}) => {
+  const {payload: requestParams, storeMeta} = splitStoreActionPayload(params)
+  const {append: shouldAppend = false, ...queryParams} = isPlainObject(requestParams)
+    ? requestParams
+    : {}
+  const requestKey = stableSerialize({
+    append: Boolean(shouldAppend),
+    endpoint: getters.resourceEndpoint,
+    params: queryParams,
+  })
+
+  commit(types.SET_ACTIVE_REQUEST_KEY, requestKey)
+  commit(types.SET_ISLOADING, true);
+  commit(types.SET_ISLOADINGLIST, true)
+  commit(types.SET_ERROR, null);
+  if (!shouldAppend) {
+    if (getters.items != null) commit(types.SET_ITEMS, []);
+    commit(types.SET_TOTALITEMS, 0);
+    commit(types.SET_SUMMARY, {});
+  }
+  return api
+    .fetch(getters.resourceEndpoint, {params: queryParams})
+    .then(data => {
+      const pageItems = normalizeCollectionItems(data)
+
+      if (getters.activeRequestKey !== requestKey) {
+        return pageItems
+      }
+
+      const nextItems = shouldAppend
+        ? appendCollectionItems(getters.items, pageItems)
+        : pageItems
+
+      commit(types.SET_ERROR, null);
+      commit(types.SET_ITEMS, nextItems);
+      commit(types.SET_TOTALITEMS, resolveCollectionTotalItems(data, nextItems));
+      commit(types.SET_SUMMARY, data['summary'] || data?.['hydra:summary'] || {});
+      commit(types.SET_LAST_COMPLETED_REQUEST, {
+        completedAt: Date.now(),
+        requestKey,
+        status: 'success',
+      });
+
+      return pageItems;
+    })
+    .catch(e => {
+      if (getters.activeRequestKey === requestKey) {
+        commitStoreError(commit, e, storeMeta)
+        commit(types.SET_LAST_COMPLETED_REQUEST, {
+          completedAt: Date.now(),
+          error: e?.message || String(e || ''),
+          requestKey,
+          status: 'error',
+        });
+      }
+      throw e;
+    })
+    .finally(() => {
+      if (getters.activeRequestKey === requestKey) {
+        commit(types.SET_ACTIVE_REQUEST_KEY, '')
+        commit(types.SET_ISLOADING, false);
+        commit(types.SET_ISLOADINGLIST, false)
+      }
+    });
+};
+
+export const getItems = ({commit, getters}, params = {}) => {
+  //if (getters.offline) return getOfflineItems({commit, getters}, params); else
+  return getOnlineItems({commit, getters}, params);
+};
+
+export const get = ({commit, getters}, id) => {
+  const {payload: requestId, storeMeta} = splitStoreActionPayload(id)
+  const normalizedId = String(requestId?.id ?? requestId ?? '').replace(/\D/g, '')
+  commit(types.SET_ISLOADING, true);
+  commit(types.SET_ERROR, null);
+  // Refreshes that need the current record to stay mounted can opt out of the
+  // destructive intermediate clear by passing `__storeMeta.preserveItem = true`.
+  if (storeMeta.preserveItem !== true && getters.item != null) commit(types.SET_ITEM, {});
+  return api
+    .fetch(
+      getters.resourceEndpoint + '/' + normalizedId,
+
+      {},
+    )
+    .then(data => {
+      commit(types.SET_ERROR, null);
+      commit(types.SET_ITEM, data);
+      if (normalizedId) {
+        commit(types.SET_LOADED_KEY, normalizedId);
+        commit(types.SET_LOADED_AT, Date.now());
+      }
+      if (getters.offline) saveOffline({commit, getters}, data);
+      return data;
+    })
+    .catch(e => {
+      commitStoreError(commit, e, storeMeta)
+      throw e;
+    })
+    .finally(() => {
+      commit(types.SET_ISLOADING, false);
+    });
+};
+
+export const save = ({commit, getters}, params) => {
+  const {payload: requestParams, storeMeta} = splitStoreActionPayload(params)
+  let id = requestParams?.id?.toString().replace(/\D/g, '');
+  delete requestParams.id;
+
+  let options = {
+    method: id ? 'PUT' : 'POST',
+    body: requestParams,
+  };
+  commit(types.SET_ISSAVING, true);
+  commit(types.SET_ERROR, null);
+
+  return api
+    .fetch(getters.resourceEndpoint + (id ? '/' + id : ''), options)
+    .then(data => {
+      commit(types.SET_ERROR, null);
+      delete data['@context'];
+      let items = getters.items ? [...getters.items] : [];
+      if (id) {
+        const index = items.findIndex(i => {
+          return i['@id'].replace(/\D/g, '') === id;
+        });
+        if (index >= 0) items[index] = data;
+        else items.push(data);
+      } else items.push(data);
+      commit(types.SET_ITEMS, items);
+      return data;
+    })
+    .catch(e => {
+      commitStoreError(commit, e, storeMeta)
+      throw e;
+    })
+    .finally(() => {
+      commit(types.SET_ISSAVING, false);
+    });
+};
+
+export const remove = ({commit, getters}, id) => {
+  const {payload: requestId, storeMeta} = splitStoreActionPayload(id)
+  id = String(requestId?.id ?? requestId ?? '').replace(/\D/g, '');
+  let options = {
+    method: 'DELETE',
+  };
+  commit(types.SET_ISSAVING, true);
+  commit(types.SET_ERROR, null);
+
+  return api
+    .fetch(getters.resourceEndpoint + '/' + id, options)
+    .then(() => {
+      commit(types.SET_ERROR, null);
+      let items = getters.items ? [...getters.items] : [];
+      const index = items.findIndex(i => {
+        if (i && i['@id']) return i['@id'].toString().replace(/\D/g, '') === id;
+      });
+
+      if (index >= 0) items.splice(index, 1);
+      else items = [];
+      commit(types.SET_ITEMS, items);
+      return;
+    })
+    .catch(e => {
+      commitStoreError(commit, e, storeMeta)
+      throw e;
+    })
+    .finally(() => {
+      commit(types.SET_ISSAVING, false);
+    });
+};
+
+export const setFilters = ({commit, getters}, params) => {
+  commit(types.SET_FILTERS, params);
+};
+
+export const setItem = ({commit, getters}, params) => {
+  commit(types.SET_ITEM, params);
+};
+
+export const setItems = ({commit, getters}, params) => {
+  commit(types.SET_ITEMS, params);
+};
+
+export const setPrint = ({commit, getters}, params) => {
+  commit(types.SET_PRINT, params);
+};
+
+export const setReload = ({commit, getters}, reload) => {
+  commit(types.SET_RELOAD, reload);
+};
+
+export const setError = ({commit, getters}, error) => {
+  commit(types.SET_ERROR, error);
+};
+
+export const setIsSaving = ({commit, getters}, IsSaving) => {
+  commit(types.SET_ISSAVING, IsSaving);
+};
+export const setIsLoading = ({commit, getters}, IsLoading) => {
+  commit(types.SET_ISLOADING, IsLoading);
+};
+
+export const setTotalItems = ({commit, getters}, totalItems) => {
+  commit(types.SET_TOTALITEMS, totalItems);
+};
+
+export const setSummary = ({commit, getters}, summary) => {
+  commit(types.SET_SUMMARY, summary);
+};
+
+export const setColumns = ({commit, getters}, columns) => {
+  commit(types.SET_COLUMNS, columns);
+};
+
+export const setResourceEndpoint = (
+  {commit, getters},
+  resourceEndpoint = null,
+) => {
+  commit(types.SET_RESOURCE_ENDPOINT, resourceEndpoint);
+};
+
+export const setSelected = ({commit, getters}, selected) => {
+  commit(types.SET_SELECTED, selected);
+};
+
+export const setMessage = ({commit, getters}, message) => {
+  commit(types.SET_MESSAGE, message);
+};
+
+export const setMessages = ({commit, getters}, messages) => {
+  commit(types.SET_MESSAGES, messages);
+};
+
+export const setSelections = ({commit, getters}, selections) => {
+  commit(types.SET_SELECTIONS, selections);
+};
+
+export const setSelectorModalKey = ({commit, getters}, selectorModalKey) => {
+  commit(types.SET_SELECTOR_MODAL_KEY, selectorModalKey);
+};
+
+export const setActiveRequestKey = ({commit, getters}, activeRequestKey) => {
+  commit(types.SET_ACTIVE_REQUEST_KEY, activeRequestKey);
+};
+
+export const setLastCompletedRequest = (
+  {commit, getters},
+  lastCompletedRequest,
+) => {
+  commit(types.SET_LAST_COMPLETED_REQUEST, lastCompletedRequest);
+};
+
+export const setVisibleColumns = ({commit, getters}, visibleColumns) => {
+  commit(types.SET_VISIBLECOLUMNS, visibleColumns);
+};
+
+export const setIsLoadingList = ({commit, getters}, isLoadingList) => {
+  commit(types.SET_ISLOADINGLIST, isLoadingList);
+};
+
+export const setStore = ({commit, getters}, store) => {
+  commit(types.SET_STORE, store);
+};
+
+export const setOffline = ({commit, getters}, offline) => {
+  commit(types.SET_OFFLINE, offline);
+};
+export const setPayable = ({commit, getters}, payable) => {
+  commit(types.SET_PAYABLE, payable);
+};