@admin-layout/client 12.0.16-alpha.62 → 12.0.16-alpha.67

package/lib/__tests__/ConfigurationModelWrapper.test.d.ts

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=ConfigurationModelWrapper.test.d.ts.map

package/lib/__tests__/ConfigurationModelWrapper.test.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ConfigurationModelWrapper.test.d.ts","sourceRoot":"","sources":["../../src/__tests__/ConfigurationModelWrapper.test.ts"],"names":[],"mappings":""}

package/lib/components/UpdateSettings/UpdateSettings.server.d.ts

@@ -1,7 +1,62 @@
+/**
+ * Cookie configuration for storing user settings
+ * - Max age: 30 days
+ * - Client-side accessible for dynamic UI updates
+ * - Domain-scoped in production for subdomain sharing
+ */
 export declare const settingsCookie: import("@remix-run/server-runtime").Cookie;
+/**
+ * Fetches page settings from GraphQL backend with device/route-specific overrides
+ *
+ * @param request - The incoming HTTP request (used for forwarding cookies and headers)
+ * @param overrideIdentifier - Optional override identifier (e.g., "[mobile]", "[desktop]", "[/dashboard][mobile]")
+ * @returns GraphQL query result containing merged settings with overrides applied
+ *
+ * @remarks
+ * - The GraphQL backend implements Redis caching for performance
+ * - Settings are returned in a flat structure with bracket notation for overrides
+ * - Example structure: { logo: '...', theme: '...', '[mobile]': { ... }, '[/dashboard][mobile]': { ... } }
+ */
 export declare function fetchPageSettingsWithFetch(request: Request, overrideIdentifier?: string): Promise<{
     data: any;
 }>;
+/**
+ * Universal settings loader utility for both Remix loaders and actions
+ *
+ * @param params - Object containing request, context, and params
+ * @param params.request - The incoming HTTP request
+ * @param params.context - Optional Remix load context
+ * @param params.params - Optional route parameters
+ *
+ * @returns Object containing merged settings and cookie string
+ * @returns settings - Fully merged settings (GraphQL + env + cookies + request payload)
+ * @returns setCookie - Cookie string to set in response headers
+ *
+ * @remarks
+ * This utility handles both loader (GET) and action (POST/PUT/DELETE) requests:
+ * - **Loaders (GET)**: Fetches and merges settings from GraphQL, env, and cookies
+ * - **Actions (POST/PUT)**: Additionally processes request payload and updates cookies
+ *
+ * Settings merge order (later sources override earlier ones):
+ * 1. GraphQL backend settings (with device overrides)
+ * 2. Environment variable settings
+ * 3. Cookie settings (user preferences)
+ * 4. Request payload (only for actions)
+ *
+ * @example
+ * // In a Remix loader
+ * export const loader = async ({ request }) => {
+ *   const { settings, setCookie } = await settingsLoaderUtil({ request });
+ *   return json({ settings }, { headers: { 'Set-Cookie': setCookie } });
+ * };
+ *
+ * @example
+ * // In a Remix action
+ * export const action = async ({ request }) => {
+ *   const { settings, setCookie } = await settingsLoaderUtil({ request });
+ *   return json(settings, { headers: { 'Set-Cookie': setCookie } });
+ * };
+ */
 export declare function settingsLoaderUtil({ request, context, params }: {
     request: any;
     context: any;
@@ -10,4 +65,5 @@ export declare function settingsLoaderUtil({ request, context, params }: {
     settings: any;
     setCookie: string;
 }>;
+export declare function getDeviceType(userAgent: string): 'mobile' | 'desktop';
 //# sourceMappingURL=UpdateSettings.server.d.ts.map

package/lib/components/UpdateSettings/UpdateSettings.server.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"UpdateSettings.server.d.ts","sourceRoot":"","sources":["../../../src/components/UpdateSettings/UpdateSettings.server.ts"],"names":[],"mappings":"AAgBA,eAAO,MAAM,cAAc,4CAMzB,CAAC;AAIH,wBAAsB,0BAA0B,CAAC,OAAO,EAAE,OAAO,EAAE,kBAAkB,CAAC,EAAE,MAAM;;GAqF7F;AAED,wBAAsB,kBAAkB,CAAC,EAAE,OAAO,EAAE,OAAO,EAAE,MAAM,EAAE;;;;CAAA;;;GAqGpE"}
+{"version":3,"file":"UpdateSettings.server.d.ts","sourceRoot":"","sources":["../../../src/components/UpdateSettings/UpdateSettings.server.ts"],"names":[],"mappings":"AAgBA;;;;;GAKG;AACH,eAAO,MAAM,cAAc,4CAMzB,CAAC;AAEH;;;;;;;;;;;GAWG;AACH,wBAAsB,0BAA0B,CAAC,OAAO,EAAE,OAAO,EAAE,kBAAkB,CAAC,EAAE,MAAM;;GAuF7F;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAoCG;AACH,wBAAsB,kBAAkB,CAAC,EAAE,OAAO,EAAE,OAAO,EAAE,MAAM,EAAE;;;;CAAA;;;GA8GpE;AAED,wBAAgB,aAAa,CAAC,SAAS,EAAE,MAAM,GAAG,QAAQ,GAAG,SAAS,CAQrE"}

package/lib/components/UpdateSettings/UpdateSettings.server.js

@@ -1,14 +1,31 @@
-import {createCookie}from'@remix-run/node';import {ConfigCollectionName,ConfigFragmentName,ConfigurationSchemaId}from'common';import {GetPageSettingsDocument}from'common/graphql';import {merge}from'lodash-es';import {print}from'graphql';import {config}from'../../config/env-config.js';import'../../config/defaultSettings.js';import'react';import'@cdm-logger/client';import {compareAndSaveSettingsDifferences}from'../../utils/settingsDifference.js';import {generateCdecodeUri,DEFAULT_CONTRIBUTION_TENANT_ID}from'@adminide-stack/core';const settingsCookie = createCookie('settings', {
+import {createCookie}from'@remix-run/node';import {ConfigCollectionName,ConfigFragmentName,ConfigurationSchemaId}from'common';import {GetPageSettingsDocument}from'common/graphql';import {merge}from'lodash-es';import {print}from'graphql';import {parseEnvLayoutSettings}from'../../utils/parseEnvUiLayoutSettings.js';import {config}from'../../config/env-config.js';import'../../config/defaultSettings.js';import {generateCdecodeUri,DEFAULT_CONTRIBUTION_TENANT_ID}from'@adminide-stack/core';/**
+ * Cookie configuration for storing user settings
+ * - Max age: 30 days
+ * - Client-side accessible for dynamic UI updates
+ * - Domain-scoped in production for subdomain sharing
+ */
+const settingsCookie = createCookie('settings', {
     maxAge: 60 * 60 * 24 * 30, // 1 month
     httpOnly: false, // Allow client-side access
     sameSite: 'lax',
     path: '/', // Ensure cookie is available for all paths
     domain: config.isProd ? config.APP_DOMAIN : undefined,
 });
-// Direct fetch-based implementation for fetching settings from GraphQL
-// Note: GraphQL backend already has Redis caching, so no need for additional caching here
+/**
+ * Fetches page settings from GraphQL backend with device/route-specific overrides
+ *
+ * @param request - The incoming HTTP request (used for forwarding cookies and headers)
+ * @param overrideIdentifier - Optional override identifier (e.g., "[mobile]", "[desktop]", "[/dashboard][mobile]")
+ * @returns GraphQL query result containing merged settings with overrides applied
+ *
+ * @remarks
+ * - The GraphQL backend implements Redis caching for performance
+ * - Settings are returned in a flat structure with bracket notation for overrides
+ * - Example structure: { logo: '...', theme: '...', '[mobile]': { ... }, '[/dashboard][mobile]': { ... } }
+ */
 async function fetchPageSettingsWithFetch(request, overrideIdentifier) {
     console.log(`🔍 Fetching settings from GraphQL (Redis-cached backend)...`);
+    // Generate resource URI for the application settings
     const resource = generateCdecodeUri(DEFAULT_CONTRIBUTION_TENANT_ID, {
         resourceType: ConfigCollectionName.Applications,
         resourceId: config.APPLICATION_ID,
@@ -17,27 +34,26 @@ async function fetchPageSettingsWithFetch(request, overrideIdentifier) {
     const url = process.env.GRAPHQL_URL || 'http://localhost:8080/graphql';
     // Convert GraphQL DocumentNode to string
     const query = print(GetPageSettingsDocument);
-    // Prepare options with optional overrides
+    // Prepare GraphQL query options
     const options = {
         schemaId: ConfigurationSchemaId.UiLayout,
         target: 2 /* ConfigurationTarget.APPLICATION */,
         configKey: 'uilayout',
     };
-    // Add overrides if provided
+    // Add device/route overrides if provided
     if (overrideIdentifier) {
         options.overrides = {
+            strict: true,
             overrideIdentifier,
         };
     }
-    // Add timestamp to force cache invalidation
     const variables = {
         resourceUri: resource,
         options,
-        // _timestamp: Date.now(), // Force cache bust
     };
     console.log('🔍 Fetching settings with direct fetch to:', url);
-    console.log('🔍 Query variables:', JSON.stringify(variables, null, 2));
-    // Forward cookies from the incoming request
+    // console.log('🔍 Query variables:', JSON.stringify(variables, null, 2));
+    // Forward cookies and headers from the incoming request
     const headers = {
         'Content-Type': 'application/json',
         'Cache-Control': 'no-cache, no-store, must-revalidate',
@@ -78,85 +94,133 @@ async function fetchPageSettingsWithFetch(request, overrideIdentifier) {
         throw error;
     }
 }
+/**
+ * Universal settings loader utility for both Remix loaders and actions
+ *
+ * @param params - Object containing request, context, and params
+ * @param params.request - The incoming HTTP request
+ * @param params.context - Optional Remix load context
+ * @param params.params - Optional route parameters
+ *
+ * @returns Object containing merged settings and cookie string
+ * @returns settings - Fully merged settings (GraphQL + env + cookies + request payload)
+ * @returns setCookie - Cookie string to set in response headers
+ *
+ * @remarks
+ * This utility handles both loader (GET) and action (POST/PUT/DELETE) requests:
+ * - **Loaders (GET)**: Fetches and merges settings from GraphQL, env, and cookies
+ * - **Actions (POST/PUT)**: Additionally processes request payload and updates cookies
+ *
+ * Settings merge order (later sources override earlier ones):
+ * 1. GraphQL backend settings (with device overrides)
+ * 2. Environment variable settings
+ * 3. Cookie settings (user preferences)
+ * 4. Request payload (only for actions)
+ *
+ * @example
+ * // In a Remix loader
+ * export const loader = async ({ request }) => {
+ *   const { settings, setCookie } = await settingsLoaderUtil({ request });
+ *   return json({ settings }, { headers: { 'Set-Cookie': setCookie } });
+ * };
+ *
+ * @example
+ * // In a Remix action
+ * export const action = async ({ request }) => {
+ *   const { settings, setCookie } = await settingsLoaderUtil({ request });
+ *   return json(settings, { headers: { 'Set-Cookie': setCookie } });
+ * };
+ */
 async function settingsLoaderUtil({ request, context, params }) {
-    const cookieHeader = request.headers.get('Cookie');
-    // Detect device type from User-Agent (simplified detection)
+    // 1. Detect device type from User-Agent header
     const userAgent = request.headers.get('User-Agent') || '';
-    const isMobile = /mobile|android|iphone|ipad|ipod/i.test(userAgent);
-    const deviceType = isMobile ? 'mobile' : 'desktop';
-    // Fetch ALL settings for this device upfront (includes all route overrides)
-    // Pass device-level override to get all route-specific overrides for this device
+    const deviceType = getDeviceType(userAgent);
+    // 2. Fetch settings from GraphQL backend with device-specific overrides
+    // Override identifier format: "[desktop]" or "[mobile]"
     const overrideIdentifier = `[${deviceType}]`;
     const result = await fetchPageSettingsWithFetch(request, overrideIdentifier);
-    console.log('RESULT=========>', JSON.stringify(result));
-    const pageSettings = result?.data?.pageSettings?.settings
+    // console.log('ddRESULT=========>', JSON.stringify(result));
+    const pageBackendSettings = result?.data?.pageSettings?.settings
         ? JSON.parse(JSON.stringify(result?.data?.pageSettings?.settings))
         : null;
-    // pageSettings now contains flat structure:
-    // {
-    //   logo: '...', theme: '...', ...base settings,
-    //   [desktop]: { overrides for desktop },
-    //   [/dashboard][mobile]: { overrides for /dashboard on mobile },
-    //   ... etc
-    // }
-    // Add required keys that might not be in backend
-    let pageDefaultSettings = {
-        ...pageSettings,
-    };
-    console.log('🔍 DEBUG - final pageDefaultSettings:', JSON.stringify(pageDefaultSettings, null, 2));
-    // Fallback to config.LAYOUT_SETTINGS if backend returns empty
-    const settingsKeys = Object.keys(pageDefaultSettings);
-    const hasOnlyDefaultKeys = settingsKeys.length === 2 &&
-        settingsKeys.includes('hiddenMenuKeys') &&
-        settingsKeys.includes('hiddenMenuCategories');
-    if (hasOnlyDefaultKeys && config.LAYOUT_SETTINGS) {
-        const fallbackSettings = typeof config.LAYOUT_SETTINGS === 'string'
-            ? JSON.parse(config.LAYOUT_SETTINGS)
-            : { ...config.LAYOUT_SETTINGS };
-        pageDefaultSettings = {
-            ...fallbackSettings,
-        };
+    // 3. Parse request payload (only available for POST/PUT requests in actions)
+    let requestPayload = {};
+    try {
+        // Clone request to avoid "body already read" errors
+        const clonedRequest = request.clone();
+        const contentType = request.headers.get('content-type');
+        // Only parse JSON for non-GET requests with JSON content-type
+        if (request.method !== 'GET' && contentType?.includes('application/json')) {
+            const jsonData = await clonedRequest.json();
+            requestPayload = jsonData?.config || {};
+        }
+    }
+    catch (error) {
+        // Expected for GET requests (loaders) - no payload to parse
+        console.log('ℹ️ No request payload (likely a loader call)');
+        requestPayload = {};
     }
-    // Parse cookie settings
-    let settings;
+    // console.log('🔍 DEBUG - pageBackendSettings:', JSON.stringify(pageBackendSettings, null, 2));
+    // 4. Parse environment-based layout settings (fallback/default values)
+    const envLayoutSettings = parseEnvLayoutSettings();
+    // 5. Parse and validate existing cookie settings
+    const cookieHeader = request.headers.get('Cookie');
+    let existingCookieSettings;
+    let cookieUpdatedSettings;
     try {
-        settings = await settingsCookie.parse(cookieHeader);
-        // Remove any invalid numeric string keys from cookie
-        if (settings && typeof settings === 'object') {
-            Object.keys(settings).forEach((key) => {
+        existingCookieSettings = await settingsCookie.parse(cookieHeader);
+        // DEFENSIVE: Remove invalid numeric string keys (data corruption prevention)
+        if (existingCookieSettings && typeof existingCookieSettings === 'object') {
+            Object.keys(existingCookieSettings).forEach((key) => {
+                // Remove keys that are numeric strings (like "0", "1", etc.)
                 if (/^\d+$/.test(key)) {
-                    delete settings[key];
+                    console.warn(`⚠️ Removing invalid numeric key from cookie settings: "${key}" = ${JSON.stringify(existingCookieSettings[key])}`);
+                    delete existingCookieSettings[key];
                 }
             });
         }
+        // 6. Merge existing cookie settings with new request payload
+        cookieUpdatedSettings = merge({}, existingCookieSettings, requestPayload);
+        // Validate merge result - check for numeric key corruption
+        const numericKeysAfterMerge = Object.keys(cookieUpdatedSettings).filter((k) => /^\d+$/.test(k));
+        if (numericKeysAfterMerge.length > 0) {
+            console.error('❌ NUMERIC KEYS APPEARED AFTER MERGE!', numericKeysAfterMerge);
+            console.error('❌ Values:', numericKeysAfterMerge.map((k) => `${k}: ${JSON.stringify(cookieUpdatedSettings[k])}`));
+        }
     }
     catch (error) {
-        settings = null;
+        // If cookie parsing fails, use only the request payload
+        console.error('Error parsing settings cookie:', error);
+        existingCookieSettings = null;
+        cookieUpdatedSettings = requestPayload;
     }
-    // Generate default settings if no cookie exists
-    if (!settings) {
-        const fullSettings = merge({}, pageDefaultSettings, config.LAYOUT_SETTINGS);
-        // Only store differences to keep cookie size small
-        const diffSettings = await compareAndSaveSettingsDifferences(fullSettings, pageDefaultSettings);
-        const cookie = await settingsCookie.serialize(diffSettings);
-        return { settings: fullSettings, setCookie: cookie };
+    // 7. Merge all settings sources in priority order (later sources override earlier)
+    // Priority: GraphQL backend → Environment → Cookie + Request payload
+    const fullSettings = merge({}, pageBackendSettings, envLayoutSettings, cookieUpdatedSettings);
+    // 8. Validate final merged settings - detect and remove numeric key corruption
+    const numericKeysAfterFinalMerge = Object.keys(fullSettings).filter((k) => /^\d+$/.test(k));
+    if (numericKeysAfterFinalMerge.length > 0) {
+        console.error('❌ NUMERIC KEYS APPEARED AFTER FINAL MERGE!', numericKeysAfterFinalMerge);
+        console.error('❌ Values:', numericKeysAfterFinalMerge.map((k) => `${k}: ${JSON.stringify(fullSettings[k])}`));
     }
-    // Extract base settings (non-bracket keys) from pageDefaultSettings
-    const baseSettings = {};
-    const bracketOverrides = {};
-    Object.keys(pageDefaultSettings).forEach((key) => {
-        if (key.startsWith('[') && key.endsWith(']')) {
-            bracketOverrides[key] = pageDefaultSettings[key];
-        }
-        else {
-            baseSettings[key] = pageDefaultSettings[key];
-        }
-    });
-    // Merge: base settings + config + cookie overrides, then add bracket overrides
-    const mergedBaseSettings = merge({}, baseSettings, config.LAYOUT_SETTINGS, settings);
-    const fullSettings = merge({}, mergedBaseSettings, bracketOverrides);
-    // Refresh the cookie to keep it active
-    const cookie = await settingsCookie.serialize(settings);
-    console.log('FULL_SETTINGS', fullSettings);
+    // 9. Final cleanup - remove any invalid numeric string keys before returning
+    if (fullSettings && typeof fullSettings === 'object') {
+        Object.keys(fullSettings).forEach((key) => {
+            if (/^\d+$/.test(key)) {
+                console.warn(`⚠️ Removing invalid numeric key from fullSettings: "${key}"`);
+                delete fullSettings[key];
+            }
+        });
+    }
+    // 10. Serialize cookie settings for response headers
+    const cookie = await settingsCookie.serialize(cookieUpdatedSettings);
+    console.log('✅ FULL_SETTINGS prepared:', Object.keys(fullSettings).length, 'keys');
     return { settings: fullSettings, setCookie: cookie };
-}export{fetchPageSettingsWithFetch,settingsCookie,settingsLoaderUtil};//# sourceMappingURL=UpdateSettings.server.js.map
+}
+function getDeviceType(userAgent) {
+    if (!userAgent)
+        return 'desktop';
+    // Enhanced regex that catches more mobile devices
+    const mobileRegex = /mobile|android|iphone|ipad|ipod|blackberry|windows phone|opera mini|iemobile|webos|palm|playbook|kindle|silk|psp|symbian|nokia|nexus|htc|samsung|sony|ericsson|lg|motorola|sgh|sec|sharp|vodafone|benq|sanyo|kyocera|nec|alcatel|denso|jarviss|docomo|emacs|minimo|maemo|blazer|dolfin|dolphin|netfront|openwave|teleca|elaine|bolt|iris|maui|packet|pie|portalmmm|w3c|wig|zte|audiovox|ericsson|kyocera|panasonic|qwerty|sendo|sharp|sie-|sonyericsson|t-mobile|up\.browser|up\.link|verizon|vodafone|wap|winwap|xda|zte/i;
+    return mobileRegex.test(userAgent) ? 'mobile' : 'desktop';
+}export{fetchPageSettingsWithFetch,getDeviceType,settingsCookie,settingsLoaderUtil};//# sourceMappingURL=UpdateSettings.server.js.map

package/lib/components/UpdateSettings/UpdateSettings.server.js.map

@@ -1 +1 @@
-{"version":3,"file":"UpdateSettings.server.js","sources":["../../../src/components/UpdateSettings/UpdateSettings.server.ts"],"sourcesContent":[null],"names":[],"mappings":"qhBAiHqE,MAAA,cAAA,GAAA,YAAA,CAAA,UAAA,EAAA;;;AAqGpE,IAAA,QAAA,EAAA,KAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"UpdateSettings.server.js","sources":["../../../src/components/UpdateSettings/UpdateSettings.server.ts"],"sourcesContent":[null],"names":[],"mappings":";;;;;;;;;;AAyCG,IAAA,IAAA,EAAA,GAAA;AACH,IAAA,MAAA,EAAA,MAAA,CAAA,MAAsB,GAAA,MAAA,CAAA,UAAA,GAAA,SAA2B;;AAuFhD;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAoCG,QAAA,WAAA,EAAA,QAAA;AACH,QAAA,OAAA;;;;AAAqE;;;AA8GpE,QAAA,eAAA,EAAA,qCAAA;AAED,QAAA,MAAA,EAAA,UAAgB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/lib/components/UpdateSettings/UpdateSettings.server.test.d.ts

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=UpdateSettings.server.test.d.ts.map

package/lib/components/UpdateSettings/UpdateSettings.server.test.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"UpdateSettings.server.test.d.ts","sourceRoot":"","sources":["../../../src/components/UpdateSettings/UpdateSettings.server.test.ts"],"names":[],"mappings":""}

package/lib/hooks/useLayoutSettings.d.ts

@@ -3,4 +3,5 @@ export declare const useLayoutSettings: () => {
     setSettings: (config: any) => Promise<any>;
     getSettings: () => Promise<any>;
 };
+export declare function getClientDeviceType(): 'mobile' | 'desktop';
 //# sourceMappingURL=useLayoutSettings.d.ts.map

package/lib/hooks/useLayoutSettings.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useLayoutSettings.d.ts","sourceRoot":"","sources":["../../src/hooks/useLayoutSettings.ts"],"names":[],"mappings":"AAkBA,eAAO,MAAM,iBAAiB;;0BAgDP,GAAG;;CAmEzB,CAAC"}
+{"version":3,"file":"useLayoutSettings.d.ts","sourceRoot":"","sources":["../../src/hooks/useLayoutSettings.ts"],"names":[],"mappings":"AAkBA,eAAO,MAAM,iBAAiB;;0BAgDP,GAAG;;CAiEzB,CAAC;AAEF,wBAAgB,mBAAmB,IAAI,QAAQ,GAAG,SAAS,CAY1D"}

package/lib/hooks/useLayoutSettings.js

@@ -45,9 +45,7 @@ const useLayoutSettings = () => {
         }
     }, []);
     const setSettings = useCallback(async (config) => {
-        // Settings are now flat (no uilayout wrapper)
-        const flatConfig = config;
-        const { colorWeak, contentWidth } = flatConfig;
+        const { colorWeak, contentWidth } = config;
         try {
             // Handle UI updates for special settings
             if (settings.contentWidth !== contentWidth) {
@@ -56,18 +54,20 @@ const useLayoutSettings = () => {
                 }
             }
             updateColorWeak(!!colorWeak);
-            const cleanDiffSettings = compareAndSaveSettingsDifferences(flatConfig, settings);
+            const cleanDiffSettings = compareAndSaveSettingsDifferences(config, settings);
+            if (Object.keys(cleanDiffSettings).length === 0)
+                return;
             const response = await fetch('/resources/settings', {
                 method: 'POST',
                 headers: {
                     'Content-Type': 'application/json',
                     orgName: orgNameFromParams || orgNameFromUrl || '',
                 },
-                body: JSON.stringify({ config: cleanDiffSettings }),
+                body: JSON.stringify({ config: cleanDiffSettings, deviceType: getClientDeviceType() }),
             });
             // Check content type before parsing
             const contentType = response.headers.get('content-type');
-            console.log('Response content-type:', contentType);
+            // console.log('Response content-type:', contentType);
             if (!response.ok) {
                 const errorText = await response.text();
                 console.error('Server error response:', errorText.substring(0, 500));
@@ -84,7 +84,7 @@ const useLayoutSettings = () => {
             const result = await response.json();
             const pageDefaultSettings = result;
             // Merge the full config with default settings before updating the store
-            const mergedSettings = merge({}, pageDefaultSettings, flatConfig);
+            const mergedSettings = merge({}, pageDefaultSettings, config);
             dispatch({
                 type: CHANGE_SETTINGS_ACTION,
                 payload: mergedSettings,
@@ -96,4 +96,14 @@ const useLayoutSettings = () => {
         }
     }, [dispatch, settings]);
     return { settings, setSettings, getSettings };
-};export{useLayoutSettings};//# sourceMappingURL=useLayoutSettings.js.map
+};
+function getClientDeviceType() {
+    if (typeof window === 'undefined') {
+        return 'desktop'; // SSR fallback
+    }
+    const userAgent = window.navigator.userAgent;
+    const isMobile = /mobile|android|iphone|ipad|ipod|webos|opera mini|iemobile|windows phone/i.test(userAgent);
+    // Also check viewport width as fallback
+    const isSmallViewport = window.matchMedia('(max-width: 768px)').matches;
+    return isMobile || isSmallViewport ? 'mobile' : 'desktop';
+}export{getClientDeviceType,useLayoutSettings};//# sourceMappingURL=useLayoutSettings.js.map

package/lib/hooks/useLayoutSettings.js.map

@@ -1 +1 @@
-{"version":3,"file":"useLayoutSettings.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"useLayoutSettings.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/lib/index.js

@@ -1 +1 @@
-export{SearchBarBehavior}from'./interfaces/settings.js';export{APPLICATION_ERROR_SLOT_FILL,CHANGE_LANGUAGE,CHANGE_SETTINGS_ACTION}from'./constants/constants.js';export{BACKEND_ERROR,CLEAR_APPLICATION_ERRORS,DISMISS_APPLICATION_ERROR,LOG_APPLICATION_ERROR,RESTORE_APPLICATION_ERRORS}from'./constants/error.js';export{HEADER_SEARCHBAR_FILL,HEADER_SEARCH_BUTTON_FILL,RIGHT_CONTENT_FILL,SCROLL_END_FILL}from'./constants/layout.js';export{languages}from'./constants/languages.js';export{dismissApplicationError,restoreApplicationError,setApplicationError}from'./redux/actions/error-actions.js';export{applicationErrors,initialErrorsState}from'./redux/reducers/error.js';export{settingsReducer}from'./redux/reducers/settings.js';export{store}from'./redux/store.js';export{useAppDispatch,useAppSelector}from'./redux/hooks.js';export{getMenuSeparation}from'./utils/seperatedMenus.js';export{useComponentSize,useIsomorphicLayoutEffect}from'./utils/componentSize.js';export{matchParentRoute}from'./utils/parentRoute.js';export{addProLayoutParentKeys,filterRoutesWithLocale,menuDataRender,removeUnnecessaryProperties,setLocale,transformData}from'./utils/menuUtils.js';export{getMatchMenuKeys}from'./utils/matchMenuKeys.js';export{generateMenuPath}from'./utils/generateMenuLink.js';export{compareAndSaveSettingsDifferences}from'./utils/settingsDifference.js';export{ApplicationErrorHandlerCommon}from'./components/ApplicationErrorHandlerCommon.js';export{ErrorBoundaryCommon}from'./components/ErrorBoundaryCommon.js';export{ApplicationErrorFillWrapper}from'./components/ApplicationErrorFillWrapper.js';export{LayoutCookieProvider}from'./components/LayoutCookieProvider.js';export{ErrorLink,errorReduxLink}from'./graphql/link/error-link.js';export{systemFont}from'./themes/systemFont/index.js';export{borderRadius,colors,lightLayoutTheme,lightNavigationBarTheme,lightTabBarTheme,shadows,sizes,spacings,textVariants}from'./themes/templates/lightLayoutTheme.js';export{createLayoutTheme}from'./themes/templates/createLayoutTheme.js';export{darkColors,darkLayoutTheme,darkNavigationBarTheme,darkTabBarTheme}from'./themes/templates/darkLayoutTheme.js';export{config}from'./config/env-config.js';export{AMENITIES,DEFAULT_HEADER,DEFAULT_LAYOUT,SEARCH_TYPES,SHARED_VIEW_CONFIG}from'./config/defaultSettings.js';export{useLayoutSettings}from'./hooks/useLayoutSettings.js';export{usePermissionAutoFetch,useSetting,useSettingsLoader}from'@adminide-stack/platform-client';export{ClientOnly}from'./hooks/Client-only.js';export{blue}from'./colors/presets/blue.js';export{brinkPink}from'./colors/presets/brinkPink.js';export{cyan}from'./colors/presets/cyan.js';export{green}from'./colors/presets/green.js';export{lime}from'./colors/presets/lime.js';export{orange}from'./colors/presets/orange.js';export{pink}from'./colors/presets/pink.js';export{purple}from'./colors/presets/purple.js';export{red}from'./colors/presets/red.js';export{skyBlue}from'./colors/presets/skyBlue.js';export{turquoise}from'./colors/presets/turquoise.js';export{yellow}from'./colors/presets/yellow.js';export{white}from'./colors/presets/white.js';export{black}from'./colors/presets/black.js';export{colorList,getThemeColors}from'./colors/colorsList.js';//# sourceMappingURL=index.js.map
+export{SearchBarBehavior}from'./interfaces/settings.js';export{APPLICATION_ERROR_SLOT_FILL,CHANGE_LANGUAGE,CHANGE_SETTINGS_ACTION}from'./constants/constants.js';export{BACKEND_ERROR,CLEAR_APPLICATION_ERRORS,DISMISS_APPLICATION_ERROR,LOG_APPLICATION_ERROR,RESTORE_APPLICATION_ERRORS}from'./constants/error.js';export{HEADER_SEARCHBAR_FILL,HEADER_SEARCH_BUTTON_FILL,RIGHT_CONTENT_FILL,SCROLL_END_FILL}from'./constants/layout.js';export{languages}from'./constants/languages.js';export{dismissApplicationError,restoreApplicationError,setApplicationError}from'./redux/actions/error-actions.js';export{applicationErrors,initialErrorsState}from'./redux/reducers/error.js';export{settingsReducer}from'./redux/reducers/settings.js';export{store}from'./redux/store.js';export{useAppDispatch,useAppSelector}from'./redux/hooks.js';export{getMenuSeparation}from'./utils/seperatedMenus.js';export{useComponentSize,useIsomorphicLayoutEffect}from'./utils/componentSize.js';export{matchParentRoute}from'./utils/parentRoute.js';export{addProLayoutParentKeys,filterRoutesWithLocale,menuDataRender,removeUnnecessaryProperties,setLocale,transformData}from'./utils/menuUtils.js';export{getMatchMenuKeys}from'./utils/matchMenuKeys.js';export{generateMenuPath}from'./utils/generateMenuLink.js';export{compareAndSaveSettingsDifferences}from'./utils/settingsDifference.js';export{ApplicationErrorHandlerCommon}from'./components/ApplicationErrorHandlerCommon.js';export{ErrorBoundaryCommon}from'./components/ErrorBoundaryCommon.js';export{ApplicationErrorFillWrapper}from'./components/ApplicationErrorFillWrapper.js';export{LayoutCookieProvider}from'./components/LayoutCookieProvider.js';export{ErrorLink,errorReduxLink}from'./graphql/link/error-link.js';export{systemFont}from'./themes/systemFont/index.js';export{borderRadius,colors,lightLayoutTheme,lightNavigationBarTheme,lightTabBarTheme,shadows,sizes,spacings,textVariants}from'./themes/templates/lightLayoutTheme.js';export{createLayoutTheme}from'./themes/templates/createLayoutTheme.js';export{darkColors,darkLayoutTheme,darkNavigationBarTheme,darkTabBarTheme}from'./themes/templates/darkLayoutTheme.js';export{config}from'./config/env-config.js';export{AMENITIES,DEFAULT_HEADER,DEFAULT_LAYOUT,SEARCH_TYPES,SHARED_VIEW_CONFIG}from'./config/defaultSettings.js';export{getClientDeviceType,useLayoutSettings}from'./hooks/useLayoutSettings.js';export{usePermissionAutoFetch,useSetting,useSettingsLoader}from'@adminide-stack/platform-client';export{ClientOnly}from'./hooks/Client-only.js';export{blue}from'./colors/presets/blue.js';export{brinkPink}from'./colors/presets/brinkPink.js';export{cyan}from'./colors/presets/cyan.js';export{green}from'./colors/presets/green.js';export{lime}from'./colors/presets/lime.js';export{orange}from'./colors/presets/orange.js';export{pink}from'./colors/presets/pink.js';export{purple}from'./colors/presets/purple.js';export{red}from'./colors/presets/red.js';export{skyBlue}from'./colors/presets/skyBlue.js';export{turquoise}from'./colors/presets/turquoise.js';export{yellow}from'./colors/presets/yellow.js';export{white}from'./colors/presets/white.js';export{black}from'./colors/presets/black.js';export{colorList,getThemeColors}from'./colors/colorsList.js';//# sourceMappingURL=index.js.map

package/lib/utils/parseEnvUiLayoutSettings.d.ts

@@ -0,0 +1,6 @@
+/**
+ * Parse LAYOUT_SETTINGS from config (which may be a JSON string from env variable)
+ * This is the single place where we handle the parsing logic
+ */
+export declare function parseEnvLayoutSettings(): Record<string, any>;
+//# sourceMappingURL=parseEnvUiLayoutSettings.d.ts.map

package/lib/utils/parseEnvUiLayoutSettings.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"parseEnvUiLayoutSettings.d.ts","sourceRoot":"","sources":["../../src/utils/parseEnvUiLayoutSettings.ts"],"names":[],"mappings":"AACA;;;GAGG;AACH,wBAAgB,sBAAsB,IAAI,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAwB5D"}

package/lib/utils/parseEnvUiLayoutSettings.js

@@ -0,0 +1,27 @@
+import {config}from'../config/env-config.js';import'../config/defaultSettings.js';/**
+ * Parse LAYOUT_SETTINGS from config (which may be a JSON string from env variable)
+ * This is the single place where we handle the parsing logic
+ */
+function parseEnvLayoutSettings() {
+    try {
+        if (!config.LAYOUT_SETTINGS) {
+            return {};
+        }
+        // If it's already an object (parsed by envalid json validator), return it
+        if (typeof config.LAYOUT_SETTINGS === 'object' && !Array.isArray(config.LAYOUT_SETTINGS)) {
+            return config.LAYOUT_SETTINGS;
+        }
+        // If it's a string, parse it (this happens when envalid uses str validator)
+        if (typeof config.LAYOUT_SETTINGS === 'string') {
+            const parsed = JSON.parse(config.LAYOUT_SETTINGS);
+            return parsed || {};
+        }
+        console.warn('⚠️ config.LAYOUT_SETTINGS is unexpected type:', typeof config.LAYOUT_SETTINGS);
+        return {};
+    }
+    catch (error) {
+        console.error('❌ Error parsing LAYOUT_SETTINGS:', error);
+        console.error('❌ Value was:', config.LAYOUT_SETTINGS);
+        return {};
+    }
+}export{parseEnvLayoutSettings};//# sourceMappingURL=parseEnvUiLayoutSettings.js.map

package/lib/utils/parseEnvUiLayoutSettings.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"parseEnvUiLayoutSettings.js","sources":["../../src/utils/parseEnvUiLayoutSettings.ts"],"sourcesContent":[null],"names":[],"mappings":";;AAIG;AACH;;;;;;;;;;;;;;;;;;;;;;;"}

package/lib/utils/parseEnvUiLayoutSettings.test.d.ts

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=parseEnvUiLayoutSettings.test.d.ts.map

package/lib/utils/parseEnvUiLayoutSettings.test.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"parseEnvUiLayoutSettings.test.d.ts","sourceRoot":"","sources":["../../src/utils/parseEnvUiLayoutSettings.test.ts"],"names":[],"mappings":""}

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@admin-layout/client",
-    "version": "12.0.16-alpha.62",
+    "version": "12.0.16-alpha.67",
     "description": "Sample client for higher packages to depend on",
     "license": "ISC",
     "author": "CDMBase LLC",
@@ -26,7 +26,7 @@
         "serialize-error": "^8.0.0"
     },
     "devDependencies": {
-        "common": "12.0.16-alpha.59",
+        "common": "12.0.16-alpha.64",
         "rc-menu": "^9.16.1"
     },
     "peerDependencies": {
@@ -44,5 +44,5 @@
     "typescript": {
         "definition": "lib/index.d.ts"
     },
-    "gitHead": "0f34e34fa56ef415cd32998b67df42ab784af9a1"
+    "gitHead": "d8c9237b79c0bb4b1457cf446ab77dd5b43d8e05"
 }