@tap-payments/os-micro-frontend-shared 0.1.136-test.1 → 0.1.136-test.3

package/build/components/VirtualTables/SheetViewVirtualTable/hooks/usePerformanceOptimizations.d.ts

@@ -5,7 +5,7 @@ export declare const usePerformanceOptimizations: (columns: readonly IColumnProp
         visibleColumns: IColumnProps<any>[];
         totalWidth: number;
         columnCount: number;
-        firstColumnId: string | number | symbol | undefined;
-        lastColumnId: string | number | symbol | undefined;
+        firstColumnId: string | number | symbol;
+        lastColumnId: string | number | symbol;
     };
 };

package/build/components/VirtualTables/SheetViewVirtualTable/hooks/usePerformanceOptimizations.js

@@ -1,108 +1,37 @@
 import { useMemo, useRef } from 'react';
-import { isEqual, pick, has, sumBy, first, last, forEach } from 'lodash';
-// Deep comparison helper for filter data
-const areFilterDataEqual = (filter1, filter2) => {
-    if (filter1 === filter2)
-        return true;
-    if (!filter1 || !filter2 || filter1.type === 'custom' || filter2.type === 'custom')
-        return false;
-    console.log({ filter1, filter2 });
-    // Extract comparable properties (excluding functions) using lodash
-    const getComparableProps = (filter) => {
-        if (!filter)
-            return null;
-        // Pick only the data properties we want to compare, excluding functions
-        const baseProps = pick(filter, ['type', 'data', 'options', 'isOnlyOneFilter']);
-        // Conditionally add properties that might not exist
-        const conditionalProps = {};
-        if (has(filter, 'apiKey'))
-            conditionalProps.apiKey = filter.apiKey;
-        if (has(filter, 'countries'))
-            conditionalProps.countries = filter.countries;
-        if (has(filter, 'isCountriesLoading'))
-            conditionalProps.isCountriesLoading = filter.isCountriesLoading;
-        return Object.assign(Object.assign({}, baseProps), conditionalProps);
-    };
-    const props1 = getComparableProps(filter1);
-    const props2 = getComparableProps(filter2);
-    // Use lodash's deep equality check instead of manual comparison
-    return isEqual(props1, props2);
-};
 export const usePerformanceOptimizations = (columns) => {
     // Create stable column references to prevent unnecessary re-renders
     const stableColumnsRef = useRef([]);
-    const isFirstRenderRef = useRef(true);
-    const filterChangeTrackingRef = useRef(new Map());
     const stableColumns = useMemo(() => {
-        // On first render, just initialize and return columns
-        if (isFirstRenderRef.current) {
-            isFirstRenderRef.current = false;
-            stableColumnsRef.current = [...columns];
-            // Initialize filter tracking using lodash forEach
-            forEach(columns, (col) => {
-                filterChangeTrackingRef.current.set(col.id, col === null || col === void 0 ? void 0 : col.filter);
-            });
-            return stableColumnsRef.current;
-        }
-        // After first render, only update if structural changes or filter changes occurred
-        const structurallyChanged = columns.length !== stableColumnsRef.current.length ||
+        // Only update if columns have actually changed (deep comparison of essential properties)
+        const hasChanged = columns.length !== stableColumnsRef.current.length ||
             columns.some((col, index) => {
                 const prevCol = stableColumnsRef.current[index];
-                if (!prevCol)
-                    return true;
-                // Extract structural properties and compare using lodash
-                const currentStructure = pick(col, ['id', 'width', 'pinned', 'hidden', 'order']);
-                const prevStructure = pick(prevCol, ['id', 'width', 'pinned', 'hidden', 'order']);
-                return !isEqual(currentStructure, prevStructure);
+                return (!prevCol ||
+                    col.id !== prevCol.id ||
+                    col.width !== prevCol.width ||
+                    col.pinned !== prevCol.pinned ||
+                    col.hidden !== prevCol.hidden ||
+                    col.order !== prevCol.order ||
+                    col.filter !== prevCol.filter);
             });
-        // Check for filter-only changes using lodash forEach
-        const columnsWithFilterChanges = new Set();
-        forEach(columns, (col) => {
-            const colId = col.id;
-            const prevFilter = filterChangeTrackingRef.current.get(colId);
-            const currentFilter = col === null || col === void 0 ? void 0 : col.filter;
-            console.log({ col });
-            if (!areFilterDataEqual(prevFilter, currentFilter)) {
-                columnsWithFilterChanges.add(colId);
-                filterChangeTrackingRef.current.set(colId, currentFilter);
-            }
-        });
-        // Only update if there are structural changes or filter changes
-        if (structurallyChanged || columnsWithFilterChanges.size > 0) {
-            // For filter-only changes, update only the affected columns
-            if (!structurallyChanged && columnsWithFilterChanges.size > 0) {
-                // Create a new array but preserve references for unchanged columns
-                const updatedColumns = stableColumnsRef.current.map((stableCol, index) => {
-                    const newCol = columns[index];
-                    const colId = newCol === null || newCol === void 0 ? void 0 : newCol.id;
-                    // Only replace if this column's filter changed
-                    if (columnsWithFilterChanges.has(colId)) {
-                        return newCol;
-                    }
-                    // Keep the stable reference for unchanged columns
-                    return stableCol;
-                });
-                stableColumnsRef.current = updatedColumns;
-            }
-            else {
-                // Full update for structural changes
-                stableColumnsRef.current = [...columns];
-            }
+        if (hasChanged) {
+            stableColumnsRef.current = [...columns];
         }
         return stableColumnsRef.current;
     }, [columns]);
-    // Memoize frequently used column calculations using lodash utilities
+    // Memoize frequently used column calculations
     const columnMetrics = useMemo(() => {
         var _a, _b;
         const visibleColumns = stableColumns.filter((col) => !col.hidden);
-        const totalWidth = sumBy(visibleColumns, (col) => +((col === null || col === void 0 ? void 0 : col.width) || 100));
+        const totalWidth = visibleColumns.reduce((sum, col) => sum + +((col === null || col === void 0 ? void 0 : col.width) || 100), 0);
         const columnCount = visibleColumns.length;
         return {
             visibleColumns,
             totalWidth,
             columnCount,
-            firstColumnId: (_a = first(visibleColumns)) === null || _a === void 0 ? void 0 : _a.id,
-            lastColumnId: (_b = last(visibleColumns)) === null || _b === void 0 ? void 0 : _b.id,
+            firstColumnId: (_a = visibleColumns[0]) === null || _a === void 0 ? void 0 : _a.id,
+            lastColumnId: (_b = visibleColumns[columnCount - 1]) === null || _b === void 0 ? void 0 : _b.id,
         };
     }, [stableColumns]);
     return {

package/build/components/index.d.ts

@@ -1,7 +1,10 @@
 export { default as AccordionAdapter } from './AccordionAdapter';
 export { default as ActionMenu, ActionMenuDropDown, ActionMenuItem, type ActionMenuProps } from './ActionMenu';
 export { default as ActivityAreaChart, type ActivityAreaChartProps, type ChartDataPoint, ChartTooltip, type ChartTooltipProps, LoadingChart, type PayloadItem, } from './ActivityAreaChart';
-export { default as AppWindowWrapper, type AccountHeaderProps, AccountHeaderTitle, AppWindowHeader, type AppWindowHeaderProps, type AppWindowHeaderBaseProps, AppWindow, type AccountHeaderTitleProps, type AppWindowProps, type WindowProps, AppWindowContext, AppWindowContextProvider, LEFT_SIDEBAR, RIGHT_SIDEBAR, VIEWER_HEIGHT, VIEWER_WIDTH, animationDuration, StyledFooter, StyledHideButton, StyledMenuLink, StyledSubmitButton, SubmitButtonWrapper, } from './AppWindowWrapper';
+export { default as AppWindowWrapper, type AccountHeaderProps, AccountHeaderTitle, AppWindowHeader, type AppWindowHeaderProps, type AppWindowHeaderBaseProps, AppWindow, type AccountHeaderTitleProps, type AppWindowProps, type WindowProps, AppWindowContext, AppWindowContextProvider, LEFT_SIDEBAR, RIGHT_SIDEBAR, VIEWER_HEIGHT, VIEWER_WIDTH, animationDuration, StyledFooter, // used account , leads
+StyledHideButton, StyledMenuLink, // used account only
+StyledSubmitButton, // used account , leads
+SubmitButtonWrapper, } from './AppWindowWrapper';
 export { default as BackgroundAnimation, type BlobGradient, type Blob } from './BackgroundAnimation';
 export { default as Button, PlusButton, StyledButton } from './Button';
 export { default as Calender, type CalenderProps, type DateObject } from './Calender';
@@ -13,7 +16,9 @@ export { default as Dialog, DialogToolbar } from './Dialog';
 export { default as Tooltip } from './Tooltip';
 export * from './RFH';
 export { VirtualTable, TableRowLoading, TableHeader as VirtualTableHeader, // To not to be confused/conflicted with the other seperated `components/TableHeader`
-TableLastItem, TableLoading, TableLoadingWithCard, TableNoData, TableNoDataWithCard, LastRowContent, ListItemWrapperWithCard, RowErrorState, StyledItemWrapper, TableRow, TableRowLoadingWithCard, TableRowWithCard, VirtualScrollInner, VirtualScrollList, VirtualScrollOuter, VirtualTableWithCard, Inputs, List, ColumnFilter, StyledCell, TableFooter, TableError, } from './VirtualTables';
+TableLastItem, TableLoading, TableLoadingWithCard, TableNoData, TableNoDataWithCard, LastRowContent, // used src\features\shared\MerchantsDropdown\MerchantsDropdown.tsx only
+ListItemWrapperWithCard, RowErrorState, StyledItemWrapper, TableRow, TableRowLoadingWithCard, TableRowWithCard, VirtualScrollInner, VirtualScrollList, VirtualScrollOuter, VirtualTableWithCard, Inputs, List, ColumnFilter, StyledCell, // used src\features\shared\Account\UserDetailsContent\components\TableCell\TableCell.tsx only
+TableFooter, TableError, } from './VirtualTables';
 export { default as SheetViewVirtualTable } from './VirtualTables/SheetViewVirtualTable/SheetViewVirtualTable';
 export { default as Widget, ListItem, WidgetHeader, WidgetList } from './Widget';
 export { default as TapLogo } from './TapLogo';

package/build/components/index.js

@@ -1,7 +1,11 @@
 export { default as AccordionAdapter } from './AccordionAdapter';
 export { default as ActionMenu, ActionMenuDropDown, ActionMenuItem } from './ActionMenu';
 export { default as ActivityAreaChart, ChartTooltip, LoadingChart, } from './ActivityAreaChart';
-export { default as AppWindowWrapper, AccountHeaderTitle, AppWindowHeader, AppWindow, AppWindowContext, AppWindowContextProvider, LEFT_SIDEBAR, RIGHT_SIDEBAR, VIEWER_HEIGHT, VIEWER_WIDTH, animationDuration, StyledFooter, StyledHideButton, StyledMenuLink, StyledSubmitButton, SubmitButtonWrapper, } from './AppWindowWrapper';
+export { default as AppWindowWrapper, AccountHeaderTitle, AppWindowHeader, AppWindow, AppWindowContext, AppWindowContextProvider, LEFT_SIDEBAR, RIGHT_SIDEBAR, VIEWER_HEIGHT, VIEWER_WIDTH, animationDuration, StyledFooter, // used account , leads
+StyledHideButton, StyledMenuLink, // used account only
+StyledSubmitButton, // used account , leads
+SubmitButtonWrapper, // used account , leads
+ } from './AppWindowWrapper';
 export { default as BackgroundAnimation } from './BackgroundAnimation';
 export { default as Button, PlusButton, StyledButton } from './Button';
 export { default as Calender } from './Calender';
@@ -13,7 +17,9 @@ export { default as Dialog, DialogToolbar } from './Dialog';
 export { default as Tooltip } from './Tooltip';
 export * from './RFH';
 export { VirtualTable, TableRowLoading, TableHeader as VirtualTableHeader, // To not to be confused/conflicted with the other seperated `components/TableHeader`
-TableLastItem, TableLoading, TableLoadingWithCard, TableNoData, TableNoDataWithCard, LastRowContent, ListItemWrapperWithCard, RowErrorState, StyledItemWrapper, TableRow, TableRowLoadingWithCard, TableRowWithCard, VirtualScrollInner, VirtualScrollList, VirtualScrollOuter, VirtualTableWithCard, Inputs, List, ColumnFilter, StyledCell, TableFooter, TableError, } from './VirtualTables';
+TableLastItem, TableLoading, TableLoadingWithCard, TableNoData, TableNoDataWithCard, LastRowContent, // used src\features\shared\MerchantsDropdown\MerchantsDropdown.tsx only
+ListItemWrapperWithCard, RowErrorState, StyledItemWrapper, TableRow, TableRowLoadingWithCard, TableRowWithCard, VirtualScrollInner, VirtualScrollList, VirtualScrollOuter, VirtualTableWithCard, Inputs, List, ColumnFilter, StyledCell, // used src\features\shared\Account\UserDetailsContent\components\TableCell\TableCell.tsx only
+TableFooter, TableError, } from './VirtualTables';
 export { default as SheetViewVirtualTable } from './VirtualTables/SheetViewVirtualTable/SheetViewVirtualTable';
 export { default as Widget, ListItem, WidgetHeader, WidgetList } from './Widget';
 export { default as TapLogo } from './TapLogo';
@@ -29,6 +35,7 @@ export { default as WindowSideBar, TITLE_BAR_HEIGHT } from './WindowSideBar';
 export { default as WindowAppIcon } from './WindowAppIcon';
 export { default as Window } from './Window';
 export * from './ToolbarIcon';
+// StyledHeaderWrapper used src\features\AppWindow\components\AppWindowHeader\AppWindowHeader.tsx only
 export { default as Toolbar, StyledHeaderWrapper, StyledHeaderWrapperStyled } from './Toolbar';
 export { default as ToggleButtons } from './ToggleButtons';
 export { default as Text } from './Text';
@@ -59,6 +66,7 @@ export * from './Inputs';
 export { default as JSONViewer, FooterButton, JSONTitleBar, JsonViewerDialogContext, JSONViewerList, useJsonViewerContext, JsonViewerDialogContextProvider, } from './JSONViewer';
 export { default as Loader } from './Loader';
 export { default as MUIThemeProvider } from './MUIThemeProvider';
+// ImageWrapper used src\features\shared\Account\BrandDetails\components\AppsIcons\AppsIcons.tsx only
 export { default as ImageWrapper } from './ImageWrapper';
 export { default as Input } from './Input';
 export { default as IconGallery } from './IconGallery';

package/package.json

@@ -1,8 +1,8 @@
 {
   "name": "@tap-payments/os-micro-frontend-shared",
   "description": "Shared components and utilities for Tap Payments micro frontends",
-  "version": "0.1.136-test.1",
-  "testVersion": 1,
+  "version": "0.1.136-test.3",
+  "testVersion": 3,
   "type": "module",
   "main": "build/index.js",
   "module": "build/index.js",