@tap-payments/os-micro-frontend-shared 0.1.415 → 0.1.417-test.1

package/build/components/TableHeader/TableView/ViewsMenu.js

@@ -1,12 +1,3 @@
-var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
-    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
-    return new (P || (P = Promise))(function (resolve, reject) {
-        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
-        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
-        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
-        step((generator = generator.apply(thisArg, _arguments || [])).next());
-    });
-};
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import { memo, useCallback, useState } from 'react';
 import { useTranslation } from 'react-i18next';
@@ -18,8 +9,7 @@ import CreateViewDialog from './CreateViewDialog';
 import { ViewWrapper } from './styles';
 import { useViewsManager } from './hooks';
 import { useViewsMenu } from './hooks/useViewsMenu';
-import { mapColumnsToLayoutSection } from './utils';
-function ViewsMenu({ onViewChange, templates, onCreateCustomView, onEditCustomView, onDeleteCustomView, tableMode = 'default', lang = 'en', }) {
+function ViewsMenu({ templates, setTemplates, createTemplate, updateTemplate, deleteTemplate, onSelectedTemplateIdChange, tableMode = 'default', lang = 'en', setTableViews, }) {
     var _a;
     const { t } = useTranslation();
     const [modifiedModes, setModifiedModes] = useState({});
@@ -28,29 +18,26 @@ function ViewsMenu({ onViewChange, templates, onCreateCustomView, onEditCustomVi
         templates,
         lang,
     });
-    const { anchorEl, isCreateDialogOpen, editingView, selectedViewInfo, shouldUseCurrentState, currentViewColumns, initialColumnsForCreate, handleViewButtonClick, handleCloseViewDropdown, handleSelectedViewInfo, handleOpenCreateDialog, handleOpenEditDialog, handleCloseCreateDialog, handleSaveView, handleDeleteView, updateSelectedView, } = useViewsMenu({
+    const { anchorEl, isCreateDialogOpen, editingView, selectedViewInfo, shouldUseCurrentState, currentViewColumns, initialColumnsForCreate, handleViewButtonClick, handleCloseViewDropdown, handleSelectedViewInfo, handleOpenCreateDialog, handleOpenEditDialog, handleCloseCreateDialog, handleSaveView, handleDeleteView, updateSelectedView, saveDefaultColumns, } = useViewsMenu({
         mode: tableMode,
-        onViewChange,
-        onCreateCustomView,
-        onEditCustomView,
-        onDeleteCustomView,
+        lang,
+        templates,
+        setTemplates,
+        createTemplate,
+        updateTemplate,
+        deleteTemplate,
+        onSelectedTemplateIdChange,
+        setTableViews,
         defaultColumns,
         defaultTemplate,
         allTemplates,
     });
-    const handleSaveDefaultColumns = useCallback((columns) => __awaiter(this, void 0, void 0, function* () {
-        if (!(defaultTemplate === null || defaultTemplate === void 0 ? void 0 : defaultTemplate.templateId))
-            return;
-        const layout = mapColumnsToLayoutSection(columns, tableMode, lang);
-        yield (onEditCustomView === null || onEditCustomView === void 0 ? void 0 : onEditCustomView(defaultTemplate.templateId, {
-            name: defaultTemplate.label,
-            selectedColumns: columns,
-            layout,
-        }));
+    const handleSaveDefaultColumns = useCallback((columns) => {
+        saveDefaultColumns(columns);
         setModifiedModes((current) => (Object.assign(Object.assign({}, current), { [tableMode]: true })));
-    }), [defaultTemplate, tableMode, lang, onEditCustomView]);
+    }, [saveDefaultColumns, tableMode]);
     return (_jsxs(_Fragment, { children: [_jsx(ClickAwayListener, Object.assign({ onClickAway: handleCloseViewDropdown }, { children: _jsxs(ViewWrapper, Object.assign({ sx: { width: '32px' }, "data-testid": "ViewsMenu" }, { children: [_jsx(StyledButton, Object.assign({ title: t('tableView'), "data-testid": "ViewsMenu_button", onClick: handleViewButtonClick }, { children: _jsx(Icon, { src: viewIcon, alt: "view", sx: { width: 14, height: 14 } }) })), _jsx(ViewsDropdown, { open: Boolean(anchorEl), anchorEl: anchorEl, onClose: handleCloseViewDropdown, defaultModified: (_a = modifiedModes[tableMode]) !== null && _a !== void 0 ? _a : false, onMarkDefaultModified: () => {
                                 setModifiedModes((current) => (Object.assign(Object.assign({}, current), { [tableMode]: true })));
-                            }, setSelectedViewInfo: handleSelectedViewInfo, selectedViewInfo: selectedViewInfo, onCreateCustomView: handleOpenCreateDialog, customViews: customViews, onEditCustomView: handleOpenEditDialog, onSaveDefaultColumns: handleSaveDefaultColumns, defaultColumns: defaultColumns, updateSelectedView: updateSelectedView, baseDefaultColumns: baseDefaultColumns, mode: tableMode, defaultTemplate: defaultTemplate })] })) })), _jsx(CreateViewDialog, { open: isCreateDialogOpen, onClose: handleCloseCreateDialog, availableColumns: defaultColumns, defaultColumns: defaultColumns, onCreate: handleSaveView, editingView: editingView, onDelete: handleDeleteView, tableViews: shouldUseCurrentState ? initialColumnsForCreate !== null && initialColumnsForCreate !== void 0 ? initialColumnsForCreate : currentViewColumns : undefined, mode: tableMode })] }));
+                            }, setSelectedViewInfo: handleSelectedViewInfo, selectedViewInfo: selectedViewInfo, onCreateCustomView: handleOpenCreateDialog, customViews: customViews, onEditCustomView: handleOpenEditDialog, onSaveDefaultColumns: handleSaveDefaultColumns, defaultColumns: defaultColumns, updateSelectedView: updateSelectedView, baseDefaultColumns: baseDefaultColumns, mode: tableMode, defaultTemplate: defaultTemplate })] })) })), _jsx(CreateViewDialog, { open: isCreateDialogOpen, onClose: handleCloseCreateDialog, availableColumns: defaultColumns, defaultColumns: defaultColumns, onCreate: handleSaveView, editingView: editingView, onDelete: handleDeleteView, tableViews: shouldUseCurrentState ? (initialColumnsForCreate !== null && initialColumnsForCreate !== void 0 ? initialColumnsForCreate : currentViewColumns) : undefined, mode: tableMode })] }));
 }
 export default memo(ViewsMenu);

package/build/components/TableHeader/TableView/hooks/useViewsMenu.d.ts

@@ -1,29 +1,28 @@
 import { type MouseEvent } from 'react';
 import type { ColumnViewProps, TableMode } from '../../../../types/index.js';
-import type { ViewMenuItem, LayoutSection } from '../types';
+import type { ViewMenuItem, LayoutSection, Template } from '../types';
 import type { ViewOption } from '../../type';
 export interface UseViewsMenuProps {
     mode: TableMode;
-    onViewChange?: (selectedView?: ViewMenuItem) => void;
-    onCreateCustomView?: (data: {
+    lang?: string;
+    templates: Template[];
+    setTemplates: React.Dispatch<React.SetStateAction<Template[]>>;
+    createTemplate: (data: {
         name: string;
-        selectedColumns: ColumnViewProps[];
-        layout: LayoutSection;
-    }) => Promise<{
-        templateId: string;
-        name: string;
-    } | void>;
-    onEditCustomView?: (viewId: string, data: {
+        layout: LayoutSection[];
+    }) => Promise<Template | undefined>;
+    updateTemplate: (templateId: string, data: {
         name: string;
-        selectedColumns: ColumnViewProps[];
-        layout: LayoutSection;
-    }) => Promise<void>;
-    onDeleteCustomView?: (viewId: string) => Promise<void>;
+        layout: LayoutSection[];
+    }) => Promise<Template | undefined>;
+    deleteTemplate: (templateId: string) => Promise<void>;
+    onSelectedTemplateIdChange?: (templateId: string | null) => void;
+    setTableViews?: (columns: ColumnViewProps[]) => void;
     defaultColumns: ColumnViewProps[];
     defaultTemplate?: ViewMenuItem;
     allTemplates: ViewMenuItem[];
 }
-export declare const useViewsMenu: ({ mode, onViewChange, onCreateCustomView, onEditCustomView, onDeleteCustomView, defaultColumns, defaultTemplate, allTemplates, }: UseViewsMenuProps) => {
+export declare const useViewsMenu: ({ mode, lang, templates, setTemplates, createTemplate, updateTemplate, deleteTemplate, onSelectedTemplateIdChange, setTableViews, defaultColumns, defaultTemplate, allTemplates, }: UseViewsMenuProps) => {
     anchorEl: HTMLDivElement | null;
     isCreateDialogOpen: boolean;
     editingView: ViewMenuItem | null;
@@ -45,4 +44,5 @@ export declare const useViewsMenu: ({ mode, onViewChange, onCreateCustomView, on
     }) => Promise<void>;
     handleDeleteView: (viewId: string) => Promise<void>;
     updateSelectedView: (updatedView: ViewMenuItem) => void;
+    saveDefaultColumns: (columns: ColumnViewProps[]) => void;
 };

package/build/components/TableHeader/TableView/hooks/useViewsMenu.js

@@ -8,8 +8,8 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
     });
 };
 import { useState, useCallback, useEffect, useRef, useMemo } from 'react';
-import { deepCloneColumns } from '../utils';
-export const useViewsMenu = ({ mode, onViewChange, onCreateCustomView, onEditCustomView, onDeleteCustomView, defaultColumns, defaultTemplate, allTemplates, }) => {
+import { deepCloneColumns, updateTemplate as normalizeTemplate, mergeTemplateEdit, mapColumnsToLayoutSection } from '../utils';
+export const useViewsMenu = ({ mode, lang = 'en', templates, setTemplates, createTemplate, updateTemplate, deleteTemplate, onSelectedTemplateIdChange, setTableViews, defaultColumns, defaultTemplate, allTemplates, }) => {
     const [anchorEl, setAnchorEl] = useState(null);
     const [isCreateDialogOpen, setIsCreateDialogOpen] = useState(false);
     const [editingView, setEditingView] = useState(null);
@@ -18,35 +18,35 @@ export const useViewsMenu = ({ mode, onViewChange, onCreateCustomView, onEditCus
     const [selectedTemplateId, setSelectedTemplateId] = useState(null);
     const hasInitializedRef = useRef(false);
     const lastModeRef = useRef(null);
-    const getViewForParent = useCallback((view) => {
-        var _a;
-        const selectedColumns = ((_a = view.submenu) === null || _a === void 0 ? void 0 : _a.filter((col) => col.selected)) || [];
-        return Object.assign(Object.assign({}, view), { submenu: selectedColumns, columns: selectedColumns.map((col) => col.name) });
-    }, []);
+    const notifySelection = useCallback((id) => {
+        setSelectedTemplateId(id);
+        onSelectedTemplateIdChange === null || onSelectedTemplateIdChange === void 0 ? void 0 : onSelectedTemplateIdChange(id);
+    }, [onSelectedTemplateIdChange]);
     const selectedView = useMemo(() => {
         if (!selectedTemplateId)
             return defaultTemplate;
-        const found = allTemplates.find((t) => (t.templateId || t.id) === selectedTemplateId);
-        return found || defaultTemplate;
+        const selectedTemplate = allTemplates.find((t) => t.id === selectedTemplateId);
+        return selectedTemplate || defaultTemplate;
     }, [allTemplates, selectedTemplateId, defaultTemplate]);
     const currentViewColumns = useMemo(() => {
         return deepCloneColumns((selectedView === null || selectedView === void 0 ? void 0 : selectedView.submenu) || defaultColumns);
     }, [selectedView, defaultColumns]);
     const selectedViewInfo = useMemo(() => {
+        var _a, _b, _c;
         return {
-            id: (selectedView === null || selectedView === void 0 ? void 0 : selectedView.id) || 'default',
-            label: (selectedView === null || selectedView === void 0 ? void 0 : selectedView.label) || 'Default',
+            id: (_b = (_a = selectedView === null || selectedView === void 0 ? void 0 : selectedView.id) !== null && _a !== void 0 ? _a : defaultTemplate === null || defaultTemplate === void 0 ? void 0 : defaultTemplate.id) !== null && _b !== void 0 ? _b : 'default',
+            label: (_c = selectedView === null || selectedView === void 0 ? void 0 : selectedView.label) !== null && _c !== void 0 ? _c : 'Default',
         };
-    }, [selectedView]);
+    }, [selectedView, defaultTemplate]);
     useEffect(() => {
         if (hasInitializedRef.current)
             return;
         if (!defaultTemplate)
             return;
-        setSelectedTemplateId(defaultTemplate.templateId || null);
+        notifySelection(defaultTemplate.id);
         hasInitializedRef.current = true;
         lastModeRef.current = mode;
-    }, [defaultTemplate, mode]);
+    }, [defaultTemplate, mode, notifySelection]);
     useEffect(() => {
         if (!hasInitializedRef.current)
             return;
@@ -54,25 +54,20 @@ export const useViewsMenu = ({ mode, onViewChange, onCreateCustomView, onEditCus
             return;
         lastModeRef.current = mode;
         if (selectedTemplateId) {
-            const matchingView = allTemplates.find((t) => (t.templateId || t.id) === selectedTemplateId);
+            const matchingView = allTemplates.find((t) => t.id === selectedTemplateId);
             if (matchingView)
                 return;
         }
         if (defaultTemplate) {
-            setSelectedTemplateId(defaultTemplate.templateId || null);
+            notifySelection(defaultTemplate.id);
         }
         else {
-            setSelectedTemplateId(null);
+            notifySelection(null);
         }
-    }, [mode, selectedTemplateId, allTemplates, defaultTemplate]);
+    }, [mode, selectedTemplateId, allTemplates, defaultTemplate, notifySelection]);
     useEffect(() => {
-        if (selectedView) {
-            onViewChange === null || onViewChange === void 0 ? void 0 : onViewChange(getViewForParent(selectedView));
-        }
-        else {
-            onViewChange === null || onViewChange === void 0 ? void 0 : onViewChange(undefined);
-        }
-    }, [selectedView, onViewChange, getViewForParent]);
+        setTableViews === null || setTableViews === void 0 ? void 0 : setTableViews(currentViewColumns);
+    }, [currentViewColumns, setTableViews]);
     const handleViewButtonClick = useCallback((event) => {
         setAnchorEl((current) => (current ? null : event.currentTarget));
     }, []);
@@ -80,14 +75,49 @@ export const useViewsMenu = ({ mode, onViewChange, onCreateCustomView, onEditCus
         setAnchorEl(null);
     }, []);
     const handleSelectedViewInfo = useCallback((selected, viewMenuItem) => {
-        const templateId = (viewMenuItem === null || viewMenuItem === void 0 ? void 0 : viewMenuItem.isCustom) ? viewMenuItem.templateId || viewMenuItem.id : (viewMenuItem === null || viewMenuItem === void 0 ? void 0 : viewMenuItem.templateId) || null;
-        setSelectedTemplateId(templateId);
+        var _a, _b;
+        const id = (_a = viewMenuItem === null || viewMenuItem === void 0 ? void 0 : viewMenuItem.id) !== null && _a !== void 0 ? _a : null;
+        notifySelection(id);
+        const columns = ((_b = viewMenuItem === null || viewMenuItem === void 0 ? void 0 : viewMenuItem.submenu) === null || _b === void 0 ? void 0 : _b.length)
+            ? deepCloneColumns(viewMenuItem.submenu)
+            : defaultColumns;
+        setTableViews === null || setTableViews === void 0 ? void 0 : setTableViews(columns);
         handleCloseViewDropdown();
-    }, [handleCloseViewDropdown]);
+    }, [handleCloseViewDropdown, notifySelection, setTableViews, defaultColumns]);
     const updateSelectedView = useCallback((updatedView) => {
-        const templateId = updatedView.templateId || updatedView.id;
-        setSelectedTemplateId((prev) => (prev !== templateId ? templateId : prev));
-    }, []);
+        var _a, _b, _c, _d, _e;
+        setSelectedTemplateId((prev) => (prev !== updatedView.id ? updatedView.id : prev));
+        onSelectedTemplateIdChange === null || onSelectedTemplateIdChange === void 0 ? void 0 : onSelectedTemplateIdChange(updatedView.id);
+        if (((_b = (_a = updatedView.submenu) === null || _a === void 0 ? void 0 : _a.length) !== null && _b !== void 0 ? _b : 0) === 0)
+            return;
+        if (updatedView.default) {
+            const defaultT = templates.find((t) => t.default);
+            if (defaultT) {
+                const layout = mapColumnsToLayoutSection((_c = updatedView.submenu) !== null && _c !== void 0 ? _c : [], mode, lang);
+                const { layout: mergedLayout } = mergeTemplateEdit(defaultT, { layout: [layout] });
+                setTemplates((prev) => prev.map((t) => (t.default ? Object.assign(Object.assign({}, t), { layout: mergedLayout }) : t)));
+            }
+        }
+        else {
+            const template = templates.find((t) => t.id === updatedView.id);
+            if (template) {
+                const layout = mapColumnsToLayoutSection((_d = updatedView.submenu) !== null && _d !== void 0 ? _d : [], mode, lang);
+                const { layout: mergedLayout } = mergeTemplateEdit(template, { layout: [layout] });
+                setTemplates((prev) => prev.map((t) => (t.id === updatedView.id ? Object.assign(Object.assign({}, t), { layout: mergedLayout }) : t)));
+            }
+        }
+        setTableViews === null || setTableViews === void 0 ? void 0 : setTableViews((_e = updatedView.submenu) !== null && _e !== void 0 ? _e : []);
+    }, [onSelectedTemplateIdChange, setTableViews, mode, lang, templates, setTemplates]);
+    const saveDefaultColumns = useCallback((columns) => {
+        var _a;
+        const defaultT = templates.find((t) => t.default);
+        if (!defaultT)
+            return;
+        const layout = mapColumnsToLayoutSection(columns, mode, lang);
+        const { layout: mergedLayout } = mergeTemplateEdit(defaultT, { layout: [layout] });
+        setTemplates((prev) => prev.map((t) => (t.default ? Object.assign(Object.assign({}, t), { layout: mergedLayout }) : t)));
+        notifySelection((_a = defaultTemplate === null || defaultTemplate === void 0 ? void 0 : defaultTemplate.id) !== null && _a !== void 0 ? _a : null);
+    }, [mode, lang, templates, setTemplates, defaultTemplate, notifySelection]);
     const handleOpenCreateDialog = useCallback((useCurrentState = false, initialColumns) => {
         setEditingView(null);
         setShouldUseCurrentState(useCurrentState);
@@ -107,27 +137,45 @@ export const useViewsMenu = ({ mode, onViewChange, onCreateCustomView, onEditCus
         setInitialColumnsForCreate(null);
     }, []);
     const handleSaveView = useCallback((data) => __awaiter(void 0, void 0, void 0, function* () {
+        const layoutPayload = [data.layout];
         if (editingView) {
-            const templateId = editingView.templateId || editingView.id;
-            yield (onEditCustomView === null || onEditCustomView === void 0 ? void 0 : onEditCustomView(templateId, data));
-            setSelectedTemplateId(templateId);
+            const isDefault = editingView.default === true;
+            if (isDefault) {
+                const defaultT = templates.find((t) => t.default);
+                const { name, layout } = mergeTemplateEdit(defaultT, { name: data.name, layout: data.layout });
+                setTemplates((prev) => prev.map((t) => (t.default ? Object.assign(Object.assign({}, t), { name, layout }) : t)));
+                notifySelection(editingView.id);
+            }
+            else {
+                const updated = yield updateTemplate(editingView.id, { name: data.name, layout: layoutPayload });
+                if (updated) {
+                    const normalized = normalizeTemplate(updated);
+                    setTemplates((prev) => prev.map((t) => (t.id === editingView.id ? normalized : t)));
+                    notifySelection(editingView.id);
+                }
+            }
             handleCloseViewDropdown();
         }
         else {
-            const created = yield (onCreateCustomView === null || onCreateCustomView === void 0 ? void 0 : onCreateCustomView(data));
-            if (created === null || created === void 0 ? void 0 : created.templateId) {
-                setSelectedTemplateId(created.templateId);
+            const created = yield createTemplate({ name: data.name, layout: layoutPayload });
+            if (created) {
+                const normalized = normalizeTemplate(created);
+                setTemplates((prev) => [...prev, normalized]);
+                notifySelection(created.id);
+                handleCloseViewDropdown();
             }
         }
-    }), [editingView, onEditCustomView, onCreateCustomView, handleCloseViewDropdown]);
+    }), [editingView, templates, setTemplates, createTemplate, updateTemplate, notifySelection, handleCloseViewDropdown]);
     const handleDeleteView = useCallback((viewId) => __awaiter(void 0, void 0, void 0, function* () {
-        const viewToDelete = allTemplates.find((view) => view.id === viewId || view.templateId === viewId);
-        const templateId = (viewToDelete === null || viewToDelete === void 0 ? void 0 : viewToDelete.templateId) || viewId;
-        yield (onDeleteCustomView === null || onDeleteCustomView === void 0 ? void 0 : onDeleteCustomView(templateId));
-        if (selectedTemplateId === templateId) {
-            setSelectedTemplateId((defaultTemplate === null || defaultTemplate === void 0 ? void 0 : defaultTemplate.templateId) || null);
+        var _a, _b;
+        const viewToDelete = allTemplates.find((view) => view.id === viewId);
+        const idToDelete = (_a = viewToDelete === null || viewToDelete === void 0 ? void 0 : viewToDelete.id) !== null && _a !== void 0 ? _a : viewId;
+        yield deleteTemplate(idToDelete);
+        setTemplates((prev) => prev.filter((t) => t.id !== idToDelete));
+        if (selectedTemplateId === idToDelete) {
+            notifySelection((_b = defaultTemplate === null || defaultTemplate === void 0 ? void 0 : defaultTemplate.id) !== null && _b !== void 0 ? _b : null);
         }
-    }), [allTemplates, onDeleteCustomView, selectedTemplateId, defaultTemplate]);
+    }), [allTemplates, deleteTemplate, setTemplates, selectedTemplateId, defaultTemplate, notifySelection]);
     return {
         anchorEl,
         isCreateDialogOpen,
@@ -146,5 +194,6 @@ export const useViewsMenu = ({ mode, onViewChange, onCreateCustomView, onEditCus
         handleSaveView,
         handleDeleteView,
         updateSelectedView,
+        saveDefaultColumns,
     };
 };

package/build/components/TableHeader/TableView/types.d.ts

@@ -59,7 +59,6 @@ export interface UpdateTemplatePayload extends TemplateAPIMetadata {
     layout: LayoutSection[];
 }
 export interface Template {
-    templateId: string;
     segment: string;
     app: string;
     service: string;
@@ -121,6 +120,7 @@ export interface ViewsMenuProps extends CustomViewsConfig {
     onViewChange?: TableHeaderProps['onViewChange'];
     tableMode?: TableMode;
     lang?: string;
+    setTableViews?: TableHeaderProps['setTableViews'];
 }
 export interface ViewsDropdownProps {
     open: boolean;

package/build/components/TableHeader/TableView/utils/columnState.js

@@ -1,3 +1,4 @@
+import cloneDeep from 'lodash/cloneDeep';
 import { isDateColumn } from './layoutTransform';
 export const getColumnCheckState = (column) => {
     var _a, _b;
@@ -55,10 +56,7 @@ export const areSomeColumnsSelected = (columns, allSelected) => {
     return hasAny && !allSelected;
 };
 export const isValidTemplateName = (name, maxLength) => name.trim().length > 0 && name.length <= maxLength;
-export const deepCloneColumns = (columns) => columns.map((col) => {
-    var _a, _b;
-    return (Object.assign(Object.assign({}, col), { selected: (_a = col.selected) !== null && _a !== void 0 ? _a : false, menuItems: (_b = col.menuItems) === null || _b === void 0 ? void 0 : _b.map((item) => { var _a; return (Object.assign(Object.assign({}, item), { selected: (_a = item.selected) !== null && _a !== void 0 ? _a : false })); }) }));
-});
+export const deepCloneColumns = (columns) => cloneDeep(columns);
 export const toggleSingleColumn = (columns, columnName) => columns.map((col) => {
     var _a;
     if (col.name !== columnName)

package/build/components/TableHeader/TableView/utils/index.d.ts

@@ -1,4 +1,4 @@
 export { isDateColumn, transformLayoutToColumns, getColumnsByMode, convertColumnsToLayoutSection, mapColumnsToLayoutSection, getLayoutDataFromTemplates, } from './layoutTransform';
 export { createCustomViewMenuItem, setViewAsDefault, transformTemplatesToViewMenuItems, mapTemplatesToMenuItems, getSubmenuItems, getSubmenuItemsForDisplay, hasSubmenu, } from './viewMenu';
 export { getColumnCheckState, toggleColumn, toggleSubItem, toggleAllColumns, areAllColumnsSelected, areSomeColumnsSelected, isValidTemplateName, deepCloneColumns, toggleSingleColumn, toggleAllCurrentColumns, areAllCurrentColumnsSelected, areSomeCurrentColumnsSelected, normalizeColumnsSelected, areColumnsEqual, resetColumnsToDefault, initializeEditingColumns, initializeCreateColumns, initializeCreateColumnsWithCurrentState, } from './columnState';
-export { getSubmenuFromTemplateLayout, getColumnOrder, updateTemplate, templateToViewMenuItem, convertTemplateToColumnsView, convertTemplatesToColumnsView, } from './templateToColumnsView';
+export { getSubmenuFromTemplateLayout, getColumnOrder, updateTemplate, mergeTemplateEdit, templateToViewMenuItem, convertTemplateToColumnsView, convertTemplatesToColumnsView, } from './templateToColumnsView';

package/build/components/TableHeader/TableView/utils/index.js

@@ -1,4 +1,4 @@
 export { isDateColumn, transformLayoutToColumns, getColumnsByMode, convertColumnsToLayoutSection, mapColumnsToLayoutSection, getLayoutDataFromTemplates, } from './layoutTransform';
 export { createCustomViewMenuItem, setViewAsDefault, transformTemplatesToViewMenuItems, mapTemplatesToMenuItems, getSubmenuItems, getSubmenuItemsForDisplay, hasSubmenu, } from './viewMenu';
 export { getColumnCheckState, toggleColumn, toggleSubItem, toggleAllColumns, areAllColumnsSelected, areSomeColumnsSelected, isValidTemplateName, deepCloneColumns, toggleSingleColumn, toggleAllCurrentColumns, areAllCurrentColumnsSelected, areSomeCurrentColumnsSelected, normalizeColumnsSelected, areColumnsEqual, resetColumnsToDefault, initializeEditingColumns, initializeCreateColumns, initializeCreateColumnsWithCurrentState, } from './columnState';
-export { getSubmenuFromTemplateLayout, getColumnOrder, updateTemplate, templateToViewMenuItem, convertTemplateToColumnsView, convertTemplatesToColumnsView, } from './templateToColumnsView';
+export { getSubmenuFromTemplateLayout, getColumnOrder, updateTemplate, mergeTemplateEdit, templateToViewMenuItem, convertTemplateToColumnsView, convertTemplatesToColumnsView, } from './templateToColumnsView';

package/build/components/TableHeader/TableView/utils/templateToColumnsView.d.ts

@@ -1,5 +1,5 @@
 import type { ColumnsView, TableMode, ColumnViewProps } from '../../../../types/index.js';
-import type { ViewMenuItem, Template } from '../types';
+import type { ViewMenuItem, Template, LayoutSection } from '../types';
 export declare function getSubmenuFromTemplateLayout(template: Template, tableMode: TableMode, lang?: string): ColumnViewProps[];
 export declare const getColumnOrder: (col: {
     order?: number | string | null;
@@ -9,6 +9,14 @@ export declare function updateTemplate<T extends {
         columns?: unknown[];
     }>;
 }>(template: T): T;
+/** Merge edit data (name + layout) into a template for local default updates. */
+export declare function mergeTemplateEdit(template: Template | undefined, edit: {
+    name?: string;
+    layout?: LayoutSection | LayoutSection[];
+}): {
+    name: string;
+    layout: LayoutSection[];
+};
 export declare function templateToViewMenuItem(template: Template, tableMode: TableMode): ViewMenuItem & {
     layout?: Template['layout'];
 };

package/build/components/TableHeader/TableView/utils/templateToColumnsView.js

@@ -38,6 +38,25 @@ export function updateTemplate(template) {
             return (Object.assign(Object.assign({}, section), { columns: [...((_a = section.columns) !== null && _a !== void 0 ? _a : [])] }));
         })) !== null && _b !== void 0 ? _b : [] });
 }
+/** Merge edit data (name + layout) into a template for local default updates. */
+export function mergeTemplateEdit(template, edit) {
+    var _a, _b, _c, _d;
+    const name = (_b = (_a = edit === null || edit === void 0 ? void 0 : edit.name) !== null && _a !== void 0 ? _a : template === null || template === void 0 ? void 0 : template.name) !== null && _b !== void 0 ? _b : '';
+    const rawLayout = edit === null || edit === void 0 ? void 0 : edit.layout;
+    const editedSection = Array.isArray(rawLayout) ? rawLayout[0] : (rawLayout !== null && rawLayout !== void 0 ? rawLayout : null);
+    const mergedLayout = [...((_c = template === null || template === void 0 ? void 0 : template.layout) !== null && _c !== void 0 ? _c : [])];
+    if (editedSection) {
+        const sectionCode = (_d = editedSection.code) === null || _d === void 0 ? void 0 : _d.toLowerCase();
+        const existingIndex = mergedLayout.findIndex((s) => { var _a; return ((_a = s.code) === null || _a === void 0 ? void 0 : _a.toLowerCase()) === sectionCode; });
+        if (existingIndex >= 0) {
+            mergedLayout[existingIndex] = editedSection;
+        }
+        else {
+            mergedLayout.push(editedSection);
+        }
+    }
+    return { name, layout: mergedLayout };
+}
 export function templateToViewMenuItem(template, tableMode) {
     var _a;
     const layout = (_a = template.layout) === null || _a === void 0 ? void 0 : _a.map((section) => {
@@ -45,10 +64,11 @@ export function templateToViewMenuItem(template, tableMode) {
         return (Object.assign(Object.assign({}, section), { columns: [...((_a = section.columns) !== null && _a !== void 0 ? _a : [])].sort((a, b) => getColumnOrder(a) - getColumnOrder(b)) }));
     });
     const submenu = getSubmenuFromTemplateLayout(template, tableMode);
+    const templateId = template.id;
     return {
-        id: template.templateId,
+        id: templateId,
         label: template.name,
-        templateId: template.templateId,
+        templateId,
         layout,
         submenu,
         columns: submenu.map((c) => c.name),
@@ -80,6 +100,13 @@ export const convertTemplateToColumnsView = (template, tableMode) => {
             });
         if (layoutForMode && layoutForMode.columns && layoutForMode.columns.length > 0) {
             const templateColumnsView = layoutForMode.columns
+                .filter((templateCol) => {
+                var _a;
+                const code = ((_a = templateCol.code) !== null && _a !== void 0 ? _a : '').toLowerCase();
+                if (code === 'date')
+                    return true;
+                return templateCol.default === true;
+            })
                 .map((templateCol) => {
                 var _a, _b;
                 return ({
@@ -104,7 +131,8 @@ export const convertTemplateToColumnsView = (template, tableMode) => {
         }
     }
     if (templateWithSubmenu.submenu && Array.isArray(templateWithSubmenu.submenu) && templateWithSubmenu.submenu.length > 0) {
-        const templateColumnsView = templateWithSubmenu.submenu.map((submenuItem, index) => {
+        const selectedSubmenu = templateWithSubmenu.submenu.filter((submenuItem) => submenuItem.selected);
+        const templateColumnsView = selectedSubmenu.map((submenuItem, index) => {
             const columnCode = submenuItem.name.toLowerCase();
             let selectedMenuItems;
             if (submenuItem.menuItems && submenuItem.menuItems.length > 0) {

package/build/components/TableHeader/TableView/utils/viewMenu.d.ts

@@ -3,28 +3,20 @@ import type { LayoutSection, ViewMenuItem } from '../types';
 export declare const createCustomViewMenuItem: (name: string, selectedColumns: ColumnViewProps[], isDefault?: boolean) => ViewMenuItem;
 export declare const setViewAsDefault: (views: ViewMenuItem[], viewId: string) => ViewMenuItem[];
 export declare const transformTemplatesToViewMenuItems: (templates: Array<{
-    id: string | {
-        timestamp: number;
-        date: string;
-    };
+    id: string;
     name: string;
     default: boolean;
     layout: LayoutSection[];
-    templateId: string;
 }>, mode?: TableMode, lang?: string) => {
     customViews: ViewMenuItem[];
     defaultTemplateColumns?: ColumnViewProps[] | undefined;
     defaultTemplate?: ViewMenuItem | undefined;
 };
 export declare const mapTemplatesToMenuItems: (templates: Array<{
-    id: string | {
-        timestamp: number;
-        date: string;
-    };
+    id: string;
     name: string;
     default: boolean;
     layout: LayoutSection[];
-    templateId: string;
 }>, mode?: TableMode, lang?: string) => {
     menuItems: ViewMenuItem[];
     defaultItem?: ViewMenuItem | undefined;

package/build/components/TableHeader/TableView/utils/viewMenu.js

@@ -17,7 +17,7 @@ export const transformTemplatesToViewMenuItems = (templates, mode = 'sheet', lan
         const sectionCode = mode === 'sheet' ? 'sheet' : 'advanced';
         const section = template.layout.find((s) => s.code.toLowerCase() === sectionCode);
         const columns = section ? transformLayoutToColumns([section], lang) : [];
-        const viewId = typeof template.id === 'string' ? template.id : template.templateId;
+        const templateId = template.id;
         const indexColumn = INDEX_COLUMN_CONFIG;
         const dateColumn = DATE_COLUMN_CONFIG;
         const withDate = columns.some((c) => { var _a; return ((_a = c.name) !== null && _a !== void 0 ? _a : '').toLowerCase() === 'date'; }) ? columns : [dateColumn, ...columns];
@@ -25,8 +25,8 @@ export const transformTemplatesToViewMenuItems = (templates, mode = 'sheet', lan
         const withDateFirst = dateIndex > 0 ? [withDate[dateIndex], ...withDate.filter((c) => { var _a; return ((_a = c.name) !== null && _a !== void 0 ? _a : '').toLowerCase() !== 'date'; })] : withDate;
         const finalColumns = [indexColumn, ...withDateFirst];
         const item = {
-            id: template.default ? 'default' : viewId,
-            templateId: template.templateId,
+            id: templateId,
+            templateId,
             label: template.name,
             isCustom: !template.default,
             default: !!template.default,
@@ -54,7 +54,7 @@ export const getSubmenuItems = (item, defaultColumns) => {
     if (item.isCustom && ((_a = item.submenu) === null || _a === void 0 ? void 0 : _a.length)) {
         columns = item.submenu;
     }
-    else if (item.id === 'default') {
+    else if (item.default) {
         columns = defaultColumns;
     }
     else {

package/build/components/TableHeader/type.d.ts

@@ -5,20 +5,17 @@ import { PartialExcept } from '../../types/index.js';
 import type { ViewMenuItem, LayoutSection, Template } from './TableView/types';
 export interface CustomViewsConfig {
     templates: Template[];
-    onCreateCustomView: (data: {
+    setTemplates: React.Dispatch<React.SetStateAction<Template[]>>;
+    createTemplate: (data: {
         name: string;
-        selectedColumns: ColumnViewProps[];
-        layout: LayoutSection;
-    }) => Promise<{
-        templateId: string;
+        layout: LayoutSection[];
+    }) => Promise<Template | undefined>;
+    updateTemplate: (templateId: string, data: {
         name: string;
-    } | void>;
-    onEditCustomView: (viewId: string, data: {
-        name: string;
-        selectedColumns: ColumnViewProps[];
-        layout: LayoutSection;
-    }) => Promise<void>;
-    onDeleteCustomView: (viewId: string) => Promise<void>;
+        layout: LayoutSection[];
+    }) => Promise<Template | undefined>;
+    deleteTemplate: (templateId: string) => Promise<void>;
+    onSelectedTemplateIdChange?: (templateId: string | null) => void;
 }
 type ViewsOptions = {
     default: {};

package/build/components/TableReports/components/DownloadButton/style.d.ts

@@ -1,5 +1,4 @@
 /// <reference types="react" />
-/// <reference types="react" />
 export declare const Button: import("@emotion/styled").StyledComponent<{
     hidden?: boolean | undefined;
     color?: string | undefined;

package/build/components/TableReports/style.d.ts

@@ -1,5 +1,4 @@
 /// <reference types="react" />
-/// <reference types="react" />
 type ExportButtonProps = {
     notificationState?: {
         success: boolean;

package/build/components/VirtualTables/components/style.d.ts

@@ -1,5 +1,4 @@
 /// <reference types="react" />
-/// <reference types="react" />
 interface TableWrapperProps {
     showNoDataView?: boolean;
 }

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.415",
-  "testVersion": 0,
+  "version": "0.1.417-test.1",
+  "testVersion": 1,
   "type": "module",
   "main": "build/index.js",
   "module": "build/index.js",
@@ -164,4 +164,4 @@
   "publishConfig": {
     "registry": "https://registry.npmjs.org/"
   }
-}
+}