@bit.rhplus/ui.grid-layout 0.0.3 → 0.0.4

package/useGridLayoutApi.js

@@ -1,296 +1,382 @@
-/* eslint-disable */
-/**
- * Hook pro komunikaci s Grid Layout API službou
- * Poskytuje funkcionalitu pro načítání a ukládání personalizovaných nastavení gridů
- */
-
-import { useCallback, useMemo } from 'react';
-import { useQueryClient } from '@tanstack/react-query';
-import { useApiQuery, useApiQuerySilence } from '@bit.rhplus/data';
-import { 
-  userFieldsApi, 
-  getSingleGridApi, 
-  getUserGridsApi, 
-  saveGridLayoutApi 
-} from './gridLayout';
-import useData from '@bit.rhplus/data';
-
-/**
- * Hook pro práci s Grid Layout API
- * @param {Object} config - Konfigurace gridu
- * @param {string} config.userKey - Klíč uživatele
- * @param {string} config.applicationName - Název aplikace
- * @param {string} config.gridName - Název gridu
- * @param {string} [config.filterName] - Název filtru (volitelné)
- * @param {string} [config.accessToken] - Přístupový token
- * @returns {Object} API methods pro grid layout
- */
-export const useGridLayoutApi = ({
-  userKey,
-  applicationName,
-  gridName,
-  filterName = null,
-  accessToken = null
-}) => {
-  const { fetchDataUIAsync } = useData();
-  const queryClient = useQueryClient();
-
-  // Základní identifikace pro API volání
-  const baseParams = useMemo(() => ({
-    userKey,
-    applicationName,
-    gridName,
-    ...(filterName && { filterName })
-  }), [userKey, applicationName, gridName, filterName]);
-
-  // Query key pro caching
-  const gridQueryKey = useMemo(() => 
-    `grid_layout_${userKey}_${applicationName}_${gridName}_${filterName || 'default'}`,
-    [userKey, applicationName, gridName, filterName]
-  );
-
-  /**
-   * Načte seznam polí pro konkrétní grid s personalizací uživatele
-   * @param {Array} fields - Definice polí gridu
-   * @param {Object} options - React Query options
-   */
-  const useUserFields = (fields = [], options = {}) => {
-    const params = useMemo(() => ({
-      ...baseParams,
-      fields
-    }), [baseParams, fields]);
-
-    return useApiQuery(
-      `${gridQueryKey}_fields`,
-      userFieldsApi,
-      params,
-      accessToken,
-      null,
-      options?.enabled ?? true,
-      5, // 5 minut stale time
-      options
-    );
-  };
-
-  /**
-   * Načte konkrétní jeden grid pro uživatele
-   * @param {Object} options - React Query options
-   */
-  const useSingleGrid = (options = {}) => {
-    return useApiQuery(
-      gridQueryKey,
-      getSingleGridApi,
-      baseParams,
-      accessToken,
-      null,
-      true,
-      5 // 5 minut stale time
-    );
-  };
-
-  /**
-   * Načte seznam všech gridů uživatele v aplikaci
-   * @param {Object} options - React Query options
-   */
-  const useUserGrids = (options = {}) => {
-    const params = useMemo(() => ({
-      userKey,
-      applicationName
-    }), [userKey, applicationName]);
-
-    return useApiQuery(
-      `user_grids_${userKey}_${applicationName}`,
-      getUserGridsApi,
-      params,
-      accessToken,
-      null,
-      true,
-      10 // 10 minut stale time
-    );
-  };
-
-  /**
-   * Uloží personalizované nastavení gridu pomocí SaveUserFields endpoint
-   * @param {Array} userFields - UserFieldModel array pro uložení
-   * @returns {Promise} Promise s výsledkem
-   */
-  const saveGridLayout = useCallback(async (userFields) => {
-    try {
-      const params = {
-        ...baseParams,
-        userFields // Nová struktura pro SaveUserFieldsCommand
-      };
-
-      const result = await fetchDataUIAsync(saveGridLayoutApi, params, accessToken);
-      
-      if (result.success) {
-        // Invalidujeme cache pro načtení čerstvých dat z API - všechny queries související s tímto gridem
-        await queryClient.invalidateQueries({
-          predicate: (query) => {
-            // Invalidujeme všechny queries které začínají našim gridQueryKey
-            const queryKey = query.queryKey?.[0];
-            return queryKey && typeof queryKey === 'string' && queryKey.startsWith(gridQueryKey);
-          }
-        });
-        
-        console.log("✅ Grid layout uložen a cache invalidován pro pattern:", gridQueryKey);
-        
-        return {
-          success: true,
-          data: result.data,
-          message: result.message
-        };
-      } else {
-        throw new Error(result.message || result.error?.message || 'Chyba při ukládání grid layoutu');
-      }
-    } catch (error) {
-      console.error('Chyba při ukládání grid layout:', error);
-      throw error;
-    }
-  }, [baseParams, fetchDataUIAsync, accessToken, queryClient, gridQueryKey]);
-
-  /**
-   * Transformuje AG-Grid column state na UserFieldModel format
-   * @param {Array} columnState - AG-Grid column state
-   * @param {Array} columnDefs - Původní column definitions
-   * @returns {Array} UserFieldModel array pro SaveUserFields API
-   */
-  const transformColumnStateToFields = useCallback((columnState, columnDefs) => {
-    if (!columnState || !columnDefs) return [];
-    if (!Array.isArray(columnDefs)) {
-      console.error('transformColumnStateToFields: columnDefs musí být array, získán:', typeof columnDefs);
-      return [];
-    }
-
-    return columnState.map((columnStateItem, index) => {
-      // Najdeme odpovídající column definition podle colId
-      const colDef = columnDefs.find(cd => cd.field === columnStateItem.colId) || {};
-      
-      return {
-        // Mapování na UserFieldModel strukturu
-        Id: 0, // Nové pole má ID = 0, existující budou mít správné ID z API
-        UserKey: baseParams.userKey,
-        ApplicationName: baseParams.applicationName,
-        GridName: baseParams.gridName,
-        FilterName: baseParams.filterName || null,
-        FieldName: columnStateItem.colId,
-        HeaderName: colDef.headerName || columnStateItem.colId || `Column ${index + 1}`,
-        Order: index, // Pořadí podle pozice v column state
-        Show: columnStateItem.hide !== true,
-        Width: columnStateItem.width || colDef.width || null,
-        System: colDef.system || false // Systémové sloupce nejde skrývat/editovat
-      };
-    });
-  }, [baseParams]);
-
-  /**
-   * Transformuje UserFieldModel array na AG-Grid column state
-   * Používá columnDefs jako primární zdroj a userFields jen pro úpravy
-   * @param {Array} userFields - UserFieldModel array z API (pro úpravy)
-   * @param {Array} columnDefs - Původní column definitions (primární)
-   * @returns {Array} Column state pro AG-Grid
-   */
-  const transformFieldsToColumnState = useCallback((userFields, columnDefs) => {
-    if (!columnDefs || !Array.isArray(columnDefs)) {
-      return [];
-    }
-
-    // Pokud nemáme userFields, vrátíme default column state z columnDefs
-    if (!userFields || !Array.isArray(userFields)) {
-      return columnDefs.map((colDef, index) => ({
-        colId: colDef.field,
-        width: colDef.width || 100,
-        hide: colDef.hide || false,
-        pinned: colDef.pinned || null,
-        sort: null,
-        sortIndex: null
-      }));
-    }
-
-    // Vytvoříme mapu userFields pro rychlé vyhledávání
-    const userFieldsMap = new Map();
-    userFields.forEach(userField => {
-      // API používá lowercase názvy (fieldName, order, show) místo uppercase (FieldName, Order, Show)
-      const fieldName = userField.fieldName || userField.FieldName;
-      userFieldsMap.set(fieldName, userField);
-    });
-
-    console.log("🔍 transformFieldsToColumnState debug:", {
-      userFields: userFields.map(uf => ({
-        fieldName: uf.fieldName || uf.FieldName,
-        order: uf.order ?? uf.Order,
-        show: uf.show ?? uf.Show,
-        width: uf.width ?? uf.Width
-      })),
-      columnDefs: columnDefs.map(cd => ({ field: cd.field, headerName: cd.headerName })),
-      userFieldsMapKeys: Array.from(userFieldsMap.keys())
-    });
-
-    // Vytvoříme column state POUZE pro sloupce, které mají záznam v userFields
-    const columnStateWithUserFields = columnDefs
-      .map((colDef, defaultIndex) => {
-        const userField = userFieldsMap.get(colDef.field);
-        
-        // Pokud pro tento sloupec není userField, vracíme null (bude odfiltrován)
-        if (!userField) {
-          console.log(`🔍 No userField for ${colDef.field} - skipping`);
-          return null;
-        }
-
-        const result = {
-          colId: colDef.field,
-          // API používá lowercase názvy polí
-          width: userField.width ?? userField.Width ?? colDef.width ?? 100,
-          hide: !(userField.show ?? userField.Show ?? true),
-          pinned: colDef.pinned || null, // Pinning z columnDefs, userFields to zatím nepodporuje
-          sort: null, // Sorting není součástí layout managementu
-          sortIndex: null,
-          // Pořadí z userFields (lowercase/uppercase)
-          __order: userField.order ?? userField.Order ?? defaultIndex
-        };
-
-        console.log(`🔍 Column mapping for ${colDef.field}:`, {
-          colDefField: colDef.field,
-          foundUserField: true,
-          userFieldOrder: userField.order ?? userField.Order,
-          defaultIndex,
-          finalOrder: result.__order,
-          userFieldData: userField
-        });
-
-        return result;
-      })
-      .filter(Boolean); // Odfiltrujeme null hodnoty
-
-    // Seřadíme podle pořadí z userFields
-    const sortedColumnState = columnStateWithUserFields.sort((a, b) => (a.__order || 0) - (b.__order || 0));
-    
-    console.log("🔍 Sorting result:", {
-      beforeSort: columnStateWithUserFields.map(c => ({ colId: c.colId, order: c.__order })),
-      afterSort: sortedColumnState.map(c => ({ colId: c.colId, order: c.__order }))
-    });
-    
-    const finalResult = sortedColumnState.map(({ __order, ...columnState }) => columnState);
-    
-    console.log("🔍 Final column state:", finalResult.map(c => c.colId));
-    
-    return finalResult;
-  }, []);
-
-  return {
-    // Query hooks
-    useUserFields,
-    useSingleGrid,
-    useUserGrids,
-    // Mutation methods
-    saveGridLayout,
-    // Transform utilities
-    transformColumnStateToFields,
-    transformFieldsToColumnState,
-    // Config
-    gridQueryKey,
-    baseParams
-  };
-};
-
-export default useGridLayoutApi;
+/* eslint-disable */
+/**
+ * Hook pro komunikaci s Grid Layout API službou
+ * Poskytuje funkcionalitu pro načítání a ukládání personalizovaných nastavení gridů
+ */
+
+import { useCallback, useMemo } from 'react';
+import { useQueryClient } from '@tanstack/react-query';
+import { useApiQuery, useApiQuerySilence } from '@bit.rhplus/data';
+import {
+  userFieldsApi,
+  getSingleGridApi,
+  getUserGridsApi,
+  saveGridLayoutApi,
+} from './gridLayout';
+import useData from '@bit.rhplus/data';
+
+/**
+ * Hook pro práci s Grid Layout API
+ * @param {Object} config - Konfigurace gridu
+ * @param {string} config.userKey - Klíč uživatele
+ * @param {string} config.applicationName - Název aplikace
+ * @param {string} config.gridName - Název gridu
+ * @param {string} [config.filterName] - Název filtru (volitelné)
+ * @param {string} [config.accessToken] - Přístupový token
+ * @returns {Object} API methods pro grid layout
+ */
+export const useGridLayoutApi = ({
+  userKey,
+  applicationName,
+  gridName,
+  filterName = null,
+  accessToken = null,
+}) => {
+  const { fetchDataUIAsync } = useData();
+  const queryClient = useQueryClient();
+
+  // Základní identifikace pro API volání
+  const baseParams = useMemo(
+    () => ({
+      userKey,
+      applicationName,
+      gridName,
+      ...(filterName && { filterName }),
+    }),
+    [userKey, applicationName, gridName, filterName]
+  );
+
+  // Query key pro caching
+  const gridQueryKey = useMemo(
+    () =>
+      `grid_layout_${userKey}_${applicationName}_${gridName}_${
+        filterName || 'default'
+      }`,
+    [userKey, applicationName, gridName, filterName]
+  );
+
+  /**
+   * Načte seznam polí pro konkrétní grid s personalizací uživatele
+   * @param {Array} fields - Definice polí gridu
+   * @param {Object} options - React Query options
+   */
+  const useUserFields = (fields = [], options = {}) => {
+    const params = useMemo(
+      () => ({
+        ...baseParams,
+        fields,
+      }),
+      [baseParams, fields]
+    );
+
+    return useApiQuery(
+      `${gridQueryKey}_fields`,
+      userFieldsApi,
+      params,
+      accessToken,
+      null,
+      options?.enabled ?? true,
+      5, // 5 minut stale time
+      options
+    );
+  };
+
+  /**
+   * Načte konkrétní jeden grid pro uživatele
+   * @param {Object} options - React Query options
+   */
+  const useSingleGrid = (options = {}) => {
+    return useApiQuery(
+      gridQueryKey,
+      getSingleGridApi,
+      baseParams,
+      accessToken,
+      null,
+      true,
+      5 // 5 minut stale time
+    );
+  };
+
+  /**
+   * Načte seznam všech gridů uživatele v aplikaci
+   * @param {Object} options - React Query options
+   */
+  const useUserGrids = (options = {}) => {
+    const params = useMemo(
+      () => ({
+        userKey,
+        applicationName,
+      }),
+      [userKey, applicationName]
+    );
+
+    return useApiQuery(
+      `user_grids_${userKey}_${applicationName}`,
+      getUserGridsApi,
+      params,
+      accessToken,
+      null,
+      true,
+      10 // 10 minut stale time
+    );
+  };
+
+  /**
+   * Uloží personalizované nastavení gridu pomocí SaveUserFields endpoint
+   * @param {Array} userFields - UserFieldModel array pro uložení
+   * @returns {Promise} Promise s výsledkem
+   */
+  const saveGridLayout = useCallback(
+    async (userFields) => {
+      try {
+        const params = {
+          ...baseParams,
+          userFields, // Nová struktura pro SaveUserFieldsCommand
+        };
+
+        // Vrátíme Promise z fetchDataUIAsync
+        return fetchDataUIAsync(saveGridLayoutApi, params, accessToken)
+          .then((result) => {
+            // Invalidujeme cache pro načtení čerstvých dat z API - všechny queries související s tímto gridem
+            queryClient
+              .invalidateQueries({
+                predicate: (query) => {
+                  // Invalidujeme všechny queries které začínají našim gridQueryKey
+                  const queryKey = query.queryKey?.[0];
+                  return (
+                    queryKey &&
+                    typeof queryKey === 'string' &&
+                    queryKey.startsWith(gridQueryKey)
+                  );
+                },
+              })
+              .then();
+
+            return {
+              success: true,
+              data: result.data,
+              message: result.message,
+            };
+          })
+          .catch((error) => {
+            throw new Error(error?.message ||
+                'Chyba při ukládání grid layoutu'
+            );
+          });
+      } catch (error) {
+        // Removed console.error for production
+        throw error;
+      }
+    },
+    [baseParams, fetchDataUIAsync, accessToken, queryClient, gridQueryKey]
+  );
+
+  /**
+   * Transformuje AG-Grid column state na UserFieldModel format
+   * @param {Array} columnState - AG-Grid column state
+   * @param {Array} columnDefs - Původní column definitions
+   * @returns {Array} UserFieldModel array pro SaveUserFields API
+   */
+  const transformColumnStateToFields = useCallback(
+    (columnState, columnDefs) => {
+      if (!columnState) return [];
+      if (!columnDefs || !Array.isArray(columnDefs)) {
+        console.error(
+          '[GridLayoutApi] transformColumnStateToFields: columnDefs is not a valid array:',
+          columnDefs
+        );
+        return [];
+      }
+
+      // Filtrujeme pouze validní column state položky s platným colId
+      const validColumnState = columnState.filter((columnStateItem, index) => {
+        const hasValidColId =
+          columnStateItem &&
+          typeof columnStateItem.colId === 'string' &&
+          columnStateItem.colId.trim() !== '';
+
+        if (!hasValidColId) {
+          console.warn(
+            `[GridLayoutApi] Ignoring invalid column state at index ${index}:`,
+            {
+              colId: columnStateItem?.colId,
+              typeof_colId: typeof columnStateItem?.colId,
+              fullItem: columnStateItem,
+            }
+          );
+        }
+
+        return hasValidColId;
+      });
+
+      var resultColumnState = validColumnState.map((columnStateItem, index) => {
+        // Najdeme odpovídající column definition podle field
+        let colDef = columnDefs.find(
+          (cd) => cd.field === columnStateItem.colId
+        );
+
+        // Pokud nebyl nalezen podle field, zkusíme hledat podle colId
+        if (!colDef) {
+          colDef = columnDefs.find((cd) => cd.colId === columnStateItem.colId);
+        }
+        if (!colDef) {
+          return {};
+        }
+
+        // Bezpečné určení HeaderName - používáme aktuální hodnotu z columnStateItem, pokud existuje
+        const headerName =
+          (columnStateItem.headerName !== undefined
+            ? columnStateItem.headerName
+            : colDef.headerName) || columnStateItem.colId;
+
+        return {
+          // Mapování na UserFieldModel strukturu
+          Id: 0, // Nové pole má ID = 0, existující budou mít správné ID z API
+          UserKey: baseParams.userKey,
+          ApplicationName: baseParams.applicationName,
+          GridName: baseParams.gridName,
+          FilterName: baseParams.filterName || null,
+          FieldName: columnStateItem.colId,
+          HeaderName: headerName,
+          Order: index, // Pořadí podle pozice v validním column state
+          Show: columnStateItem.hide !== true,
+          Width: columnStateItem.width != null ? columnStateItem.width : (colDef.width || null),
+          System: colDef.system || false, // Systémové sloupce nejde skrývat/editovat
+        };
+      });
+
+      return resultColumnState.filter((f) => Object.keys(f).length > 0);
+    },
+    [baseParams]
+  );
+
+  /**
+   * Transformuje UserFieldModel array na AG-Grid column state
+   * Používá columnDefs jako primární zdroj a userFields jen pro úpravy
+   * @param {Array} userFields - UserFieldModel array z API (pro úpravy)
+   * @param {Array} columnDefs - Původní column definitions (primární)
+   * @returns {Array} Column state pro AG-Grid
+   */
+  const transformFieldsToColumnState = useCallback((userFields, columnDefs) => {
+    if (!columnDefs || !Array.isArray(columnDefs)) {
+      console.warn(
+        '[GridLayoutApi] transformFieldsToColumnState: invalid columnDefs, returning empty array'
+      );
+      return [];
+    }
+    // Pokud nemáme userFields, vrátíme default column state z columnDefs
+    if (!userFields || !Array.isArray(userFields)) {
+      return columnDefs.map((colDef, index) => ({
+        colId: colDef.field || colDef.colId,
+        width: colDef.width || 100,
+        hide: colDef.hide || false,
+        pinned: colDef.pinned || null,
+        sort: null,
+        sortIndex: null,
+      }));
+    }
+
+    // Vytvoříme mapu userFields pro rychlé vyhledávání - pouze s validními fieldName
+    const userFieldsMap = new Map();
+    const invalidUserFields = [];
+
+    userFields.forEach((userField, index) => {
+      // API používá lowercase názvy (fieldName, order, show) místo uppercase (FieldName, Order, Show)
+      const fieldName = userField.fieldName || userField.FieldName;
+
+      // Validace fieldName - musí být neprázdný string
+      if (typeof fieldName === 'string' && fieldName.trim() !== '') {
+        userFieldsMap.set(fieldName, userField);
+      } else {
+        invalidUserFields.push({ index, userField, fieldName });
+        console.warn(
+          `[GridLayoutApi] Ignoring userField with invalid fieldName at index ${index}:`,
+          {
+            fieldName,
+            typeof_fieldName: typeof fieldName,
+            userField,
+          }
+        );
+      }
+    });
+
+    if (invalidUserFields.length > 0) {
+      console.warn(
+        `[GridLayoutApi] Found ${invalidUserFields.length} userFields with invalid fieldNames:`,
+        invalidUserFields
+      );
+    }
+
+    // Removed console.log debug for production
+
+    // Vytvoříme column state POUZE pro sloupce, které mají záznam v userFields
+    const columnStateWithUserFields = columnDefs
+      .map((colDef, defaultIndex) => {
+        // Získat userField podle field nebo colId
+        const fieldName = colDef.field || colDef.colId;
+        const userField = userFieldsMap.get(fieldName);
+
+        // Pokud pro tento sloupec není userField, vracíme null (bude odfiltrován)
+        if (!userField) {
+          // Removed console.log for production
+          return null;
+        }
+
+        // Získáme hodnotu show z API - musíme kontrolovat explicitně false hodnoty
+        const showValue =
+          userField.show !== undefined
+            ? userField.show
+            : userField.Show !== undefined
+            ? userField.Show
+            : !colDef.hide; // Fallback na opak column def hide hodnoty
+
+        const result = {
+          colId: colDef.field || colDef.colId,
+          // API používá lowercase názvy polí - správně zachováváme i nulové hodnoty
+          width: (userField.width != null) ? userField.width : 
+                 (userField.Width != null) ? userField.Width : 
+                 (colDef.width ?? 100),
+          hide: !showValue, // Respektujeme přesně hodnotu show z API
+          pinned: colDef.pinned || null, // Pinning z columnDefs, userFields to zatím nepodporuje
+          sort: null, // Sorting není součástí layout managementu
+          sortIndex: null,
+          // Pořadí z userFields (lowercase/uppercase)
+          __order: userField.order ?? userField.Order ?? defaultIndex,
+        };
+
+        // Removed console.log for production
+
+        return result;
+      })
+      .filter(Boolean); // Odfiltrujeme null hodnoty
+
+    // Seřadíme podle pořadí z userFields
+    const sortedColumnState = columnStateWithUserFields.sort(
+      (a, b) => (a.__order || 0) - (b.__order || 0)
+    );
+
+    // Removed console.log for production
+
+    const finalResult = sortedColumnState.map(
+      ({ __order, ...columnState }) => columnState
+    );
+    return finalResult;
+  }, []);
+
+  return {
+    // Query hooks
+    useUserFields,
+    useSingleGrid,
+    useUserGrids,
+    // Mutation methods
+    saveGridLayout,
+    // Transform utilities
+    transformColumnStateToFields,
+    transformFieldsToColumnState,
+    // Config
+    gridQueryKey,
+    baseParams,
+  };
+};
+
+export default useGridLayoutApi;