cloud-ide-element 1.1.84 → 1.1.86

package/fesm2022/cloud-ide-element.mjs

@@ -9390,6 +9390,7 @@ class CideEleDataGridComponent {
     showManageColumnsModal = signal(false, ...(ngDevMode ? [{ debugName: "showManageColumnsModal" }] : [])); // Show manage columns modal
     groupedColumns = signal([], ...(ngDevMode ? [{ debugName: "groupedColumns" }] : [])); // Columns to group by
     expandedGroups = signal(new Set(), ...(ngDevMode ? [{ debugName: "expandedGroups" }] : [])); // Expanded group keys
+    hasAutoExpandedGroups = false; // Track if we've auto-expanded groups on initial load
     // Export menu state
     showExportMenu = signal(false, ...(ngDevMode ? [{ debugName: "showExportMenu" }] : [])); // Show/hide export format dropdown
     showFilterDropdown = signal(false, ...(ngDevMode ? [{ debugName: "showFilterDropdown" }] : [])); // Show/hide filter dropdown
@@ -9600,16 +9601,34 @@ class CideEleDataGridComponent {
             if (groupableColumns.length > 0) {
                 console.log('🔍 Auto-applying grouping for columns:', groupableColumns);
                 this.groupedColumns.set(groupableColumns);
-                // Expand all groups by default for each grouped column
-                groupableColumns.forEach(columnKey => {
-                    const column = columns.find(c => c.key === columnKey);
-                    if (column) {
-                        this.expandAllGroupsForColumn(columnKey);
-                    }
-                });
+                // Reset auto-expand flag so groups will be expanded on first render
+                this.hasAutoExpandedGroups = false;
             }
         }
     }
+    /**
+     * Check if groups should be auto-expanded (only on initial load)
+     */
+    shouldAutoExpandGroups() {
+        // Auto-expand only once on initial load when default grouping is applied
+        if (this.groupedColumns().length > 0) {
+            // Check if this is default grouping (all groupable columns are grouped)
+            const columns = this.mergedConfig().columns || [];
+            const groupableColumns = columns
+                .filter(col => col.groupable === true)
+                .map(col => col.key);
+            const grouped = this.groupedColumns();
+            // If all groupable columns are grouped, this is likely default grouping
+            const isDefaultGrouping = groupableColumns.length > 0 &&
+                groupableColumns.every(key => grouped.includes(key));
+            // Only auto-expand if it's default grouping and we haven't marked it as done yet
+            if (isDefaultGrouping && !this.hasAutoExpandedGroups) {
+                // Mark as done after first check, but allow all groups in this grouping pass to be expanded
+                return true;
+            }
+        }
+        return false;
+    }
     /**
      * Get the unique identifier for an item
      */
@@ -9878,7 +9897,8 @@ class CideEleDataGridComponent {
             itemsToProcess.forEach(item => {
                 const itemId = String(this.getNestedValue(item, primaryKey) || '');
                 const parentIdValue = this.getNestedValue(item, foreignKey);
-                const parentId = parentIdValue !== null && parentIdValue !== undefined ? String(parentIdValue) : '';
+                // Extract parent ID generically - handle both string IDs and nested objects
+                const parentId = this.extractIdFromForeignKey(parentIdValue, primaryKey);
                 const treeItem = itemMap.get(itemId);
                 // Skip if already processed
                 if (processedItems.has(itemId)) {
@@ -9887,7 +9907,8 @@ class CideEleDataGridComponent {
                 if (treeItem && parentId && itemMap.has(parentId)) {
                     // This is a child item - check if parent is processed or is a root
                     const parent = itemMap.get(parentId);
-                    const parentParentId = this.getNestedValue(parent, foreignKey);
+                    const parentParentIdValue = this.getNestedValue(parent, foreignKey);
+                    const parentParentId = this.extractIdFromForeignKey(parentParentIdValue, primaryKey);
                     const isParentRoot = !parentParentId || parentParentId === null || parentParentId === undefined;
                     if (isParentRoot || processedItems.has(parentId)) {
                         // Parent is processed or is root, we can process this child
@@ -9994,7 +10015,8 @@ class CideEleDataGridComponent {
         // Get parent information
         const itemId = String(this.getNestedValue(item, primaryKey) || '');
         const parentIdValue = this.getNestedValue(item, foreignKey);
-        const parentId = parentIdValue !== null && parentIdValue !== undefined ? String(parentIdValue) : '';
+        // Extract parent ID generically - handle both string IDs and nested objects
+        const parentId = this.extractIdFromForeignKey(parentIdValue, primaryKey);
         // If no parent, this is a root item (level 0)
         if (!parentId || !itemMap.has(parentId)) {
             return 0;
@@ -10034,6 +10056,109 @@ class CideEleDataGridComponent {
         console.log('flattenTreeForDisplay - result:', result.length, 'items');
         return result;
     }
+    /**
+     * Flatten tree structure for grouping while preserving parent-child relationships
+     */
+    flattenTreeForGrouping(treeItems) {
+        const result = [];
+        const treeConfig = this.mergedConfig().tree;
+        if (!treeConfig)
+            return treeItems;
+        const { childrenKey = 'children' } = treeConfig;
+        // Flatten all items (both expanded and collapsed) for grouping
+        const flatten = (items) => {
+            items.forEach(item => {
+                result.push(item);
+                const children = this.getNestedValue(item, childrenKey) || [];
+                if (children.length > 0) {
+                    flatten(children);
+                }
+            });
+        };
+        flatten(treeItems);
+        return result;
+    }
+    /**
+     * Restore tree structure within grouped data
+     * This method processes grouped data and restores parent-child relationships
+     */
+    restoreTreeStructureInGroups(groupedData) {
+        const treeConfig = this.mergedConfig().tree;
+        if (!treeConfig)
+            return groupedData;
+        const { primaryKey = '_id', foreignKey, childrenKey = 'children' } = treeConfig;
+        const result = [];
+        const processedItems = new Set();
+        // Helper to find parent in result array (including nested in group headers)
+        const findParentInResult = (parentId) => {
+            const searchInArray = (items) => {
+                for (const item of items) {
+                    // Skip group headers for parent search
+                    if (item?._isGroupHeader) {
+                        continue;
+                    }
+                    const itemId = String(this.getNestedValue(item, primaryKey) || '');
+                    if (itemId === parentId) {
+                        return item;
+                    }
+                    // Check children recursively
+                    const children = this.getNestedValue(item, childrenKey) || [];
+                    if (children.length > 0) {
+                        const found = searchInArray(children);
+                        if (found)
+                            return found;
+                    }
+                }
+                return null;
+            };
+            return searchInArray(result);
+        };
+        // Process each item in grouped data
+        groupedData.forEach(item => {
+            // If it's a group header, add it directly
+            if (item?._isGroupHeader) {
+                result.push(item);
+                return;
+            }
+            const itemId = String(this.getNestedValue(item, primaryKey) || '');
+            if (!itemId || processedItems.has(itemId)) {
+                return;
+            }
+            const parentIdValue = this.getNestedValue(item, foreignKey);
+            // Extract parent ID generically - handle both string IDs and nested objects
+            const parentId = this.extractIdFromForeignKey(parentIdValue, primaryKey);
+            if (parentId) {
+                // Item has a parent - try to find parent
+                const parent = findParentInResult(parentId);
+                if (parent) {
+                    // Parent found - add as child
+                    let children = this.getNestedValue(parent, childrenKey) || [];
+                    if (!Array.isArray(children)) {
+                        children = [];
+                    }
+                    // Check if already added
+                    const exists = children.some(child => String(this.getNestedValue(child, primaryKey) || '') === itemId);
+                    if (!exists) {
+                        children.push(item);
+                        this.setNestedValue(parent, childrenKey, children);
+                        this.setNestedValue(parent, 'hasChildren', true);
+                        processedItems.add(itemId);
+                    }
+                }
+                else {
+                    // Parent not found yet - add as root for now (will be moved if parent appears later)
+                    result.push(item);
+                    processedItems.add(itemId);
+                }
+            }
+            else {
+                // No parent - add as root
+                result.push(item);
+                processedItems.add(itemId);
+            }
+        });
+        return result;
+    }
     /**
      * Toggle expand/collapse state of a tree item with unlimited nesting support
      */
@@ -11327,6 +11452,30 @@ class CideEleDataGridComponent {
             return current && typeof current === 'object' ? current[key] : undefined;
         }, obj);
     }
+    /**
+     * Extract ID from foreign key value generically
+     * Handles both string IDs and nested objects (e.g., { _id: "...", name: "..." })
+     * @param foreignKeyValue - The foreign key value (can be string, object, or null/undefined)
+     * @param primaryKey - The primary key field name (defaults to '_id')
+     * @returns The extracted ID as a string, or empty string if not found
+     */
+    extractIdFromForeignKey(foreignKeyValue, primaryKey = '_id') {
+        if (foreignKeyValue === null || foreignKeyValue === undefined) {
+            return '';
+        }
+        // If it's already a string, return it
+        if (typeof foreignKeyValue === 'string') {
+            return foreignKeyValue.trim();
+        }
+        // If it's an object, extract the ID using the primary key
+        if (typeof foreignKeyValue === 'object' && foreignKeyValue !== null) {
+            const id = foreignKeyValue[primaryKey];
+            if (id !== null && id !== undefined) {
+                return String(id);
+            }
+        }
+        return '';
+    }
     /**
      * Set a nested value in an object using dot notation
      * @param obj The object to modify
@@ -11541,11 +11690,23 @@ class CideEleDataGridComponent {
             console.log('🔍 Using local reordered data for display:', this.localReorderedData.length, 'items');
             return this.localReorderedData;
         }
-        const data = this.filteredData();
+        let data = this.filteredData();
         // Apply grouping if any columns are grouped
         const grouped = this.groupedColumns();
         if (grouped.length > 0 && !this.serverSidePagination) {
-            return this.getGroupedData(data, grouped);
+            // If tree is enabled, we need to flatten tree first for grouping, then preserve structure
+            const treeConfig = this.mergedConfig().tree;
+            if (treeConfig?.enabled) {
+                // Flatten tree structure for grouping, but preserve parent-child relationships
+                data = this.flattenTreeForGrouping(data);
+            }
+            // Apply grouping
+            data = this.getGroupedData(data, grouped);
+            // If tree is enabled, restore tree structure within groups
+            if (treeConfig?.enabled) {
+                data = this.restoreTreeStructureInGroups(data);
+            }
+            return data;
         }
         // For server-side pagination, the server already provides the correct page of data
         // For client-side pagination, we need to slice the data
@@ -11587,6 +11748,9 @@ class CideEleDataGridComponent {
         const displayValueGetter = column.valueGetter || column.key;
         const groupKeyGetter = column.dataValueGetter || column.valueGetter || column.key;
         const groups = new Map();
+        // Check if tree structure is enabled
+        const treeConfig = this.mergedConfig().tree;
+        const childrenKey = treeConfig?.childrenKey || 'children';
         // Group the data by current column
         data.forEach(row => {
             // Get raw value for grouping key
@@ -11609,9 +11773,36 @@ class CideEleDataGridComponent {
             if (column.formatter) {
                 displayValue = this.formatValue(displayValue, column);
             }
-            // If display value is still an object, convert to string
+            // If display value is still an object, try to extract a meaningful value
             if (typeof displayValue === 'object' && displayValue !== null && !Array.isArray(displayValue) && !(displayValue instanceof Date)) {
-                displayValue = String(displayValue);
+                // Try to get a name/title property from the object
+                const obj = displayValue;
+                if (obj['name']) {
+                    displayValue = obj['name'];
+                }
+                else if (obj['title']) {
+                    displayValue = obj['title'];
+                }
+                else if (obj['acabrn_name']) {
+                    displayValue = obj['acabrn_name'];
+                }
+                else if (obj['acacpm_alise_title']) {
+                    displayValue = obj['acacpm_alise_title'];
+                }
+                else if (obj['acacpm_name']) {
+                    displayValue = obj['acacpm_name'];
+                }
+                else {
+                    displayValue = String(displayValue);
+                }
+            }
+            // Handle null/undefined/empty values for optional fields (e.g., optional specialization)
+            // Use a consistent label for null/undefined values to group them together
+            if (displayValue === null || displayValue === undefined || displayValue === '') {
+                displayValue = 'No Specialization';
+            }
+            if (rawValue === null || rawValue === undefined || rawValue === '') {
+                rawValue = 'No Specialization';
             }
             const groupKey = `${groupColumnKey}:${this.getFilterValueKey(rawValue)}`;
             const existing = groups.get(groupKey);
@@ -11624,6 +11815,9 @@ class CideEleDataGridComponent {
         });
         // Flatten groups into display array
         const result = [];
+        const expanded = this.expandedGroups();
+        const newExpanded = new Set(expanded);
+        const shouldAutoExpand = this.shouldAutoExpandGroups();
         groups.forEach((group, groupKey) => {
             // Add group header row
             const groupHeader = {
@@ -11637,19 +11831,58 @@ class CideEleDataGridComponent {
                 _groupPath: level > 0 ? this.buildGroupPath(group.rows[0], groupColumns, level) : []
             };
             result.push(groupHeader);
-            // Add group rows if expanded
-            if (this.isGroupExpanded(groupKey)) {
-                // If there are more grouping levels, recursively group the rows
+            // Auto-expand groups by default if they're not explicitly collapsed
+            // This ensures groups are expanded on initial load
+            const isExpanded = expanded.has(groupKey);
+            if (shouldAutoExpand && !isExpanded) {
+                // Add to expanded set if auto-expanding
+                newExpanded.add(groupKey);
+            }
+            // Show group rows if expanded or should be auto-expanded
+            if (isExpanded || (shouldAutoExpand && !isExpanded)) {
+                // Process rows while preserving tree structure
+                const processedRows = [];
+                group.rows.forEach(row => {
+                    // Check if this row has children (tree structure)
+                    const children = treeConfig?.enabled ? this.getNestedValue(row, childrenKey) : undefined;
+                    if (children && Array.isArray(children) && children.length > 0) {
+                        // This row has children - preserve tree structure
+                        const processedRow = { ...row };
+                        // Recursively process children if there are more grouping levels
+                        if (level + 1 < groupColumns.length) {
+                            // Apply grouping to children
+                            const groupedChildren = this.groupDataRecursive(children, groupColumns, level + 1);
+                            // Update the row with grouped children
+                            this.setNestedValue(processedRow, childrenKey, groupedChildren);
+                        }
+                        else {
+                            // No more grouping levels, but preserve children structure
+                            this.setNestedValue(processedRow, childrenKey, children);
+                        }
+                        processedRows.push(processedRow);
+                    }
+                    else {
+                        // Regular row without children
+                        processedRows.push(row);
+                    }
+                });
+                // If there are more grouping levels, recursively group the processed rows
                 if (level + 1 < groupColumns.length) {
-                    const nestedGroups = this.groupDataRecursive(group.rows, groupColumns, level + 1);
+                    const nestedGroups = this.groupDataRecursive(processedRows, groupColumns, level + 1);
                     result.push(...nestedGroups);
                 }
                 else {
-                    // Last level, just add the rows
-                    result.push(...group.rows);
+                    // Last level, add the processed rows (with preserved tree structure)
+                    result.push(...processedRows);
                 }
             }
         });
+        // Update expanded groups set if we auto-expanded any
+        if (shouldAutoExpand && newExpanded.size > expanded.size) {
+            this.expandedGroups.set(newExpanded);
+            // Mark that we've auto-expanded groups so we don't do it again on subsequent renders
+            this.hasAutoExpandedGroups = true;
+        }
         return result;
     }
     /**