@headless-adminapp/app 0.0.17-alpha.24 → 0.0.17-alpha.26

package/app/LayoutProvider.d.ts

@@ -8,7 +8,7 @@ import { RouteProviderProps } from '../route/RouteProvider';
 export interface LayoutProviderProps {
     routeProps: RouteProviderProps;
     queryClient: QueryClient;
-    localeProps?: LocaleProviderProps;
+    localeProps: LocaleProviderProps;
     dataService: IDataService;
     authProps?: AuthProviderProps;
     authPlaceholder?: FC<AuthProviderPlaceholderProps>;

package/command/hooks/useBaseCommandHandlerContext.js

@@ -4,6 +4,7 @@ exports.useUtility = useUtility;
 exports.useBaseCommandHandlerContext = useBaseCommandHandlerContext;
 const navigation_1 = require("@headless-adminapp/app/navigation");
 const react_query_1 = require("@tanstack/react-query");
+const react_1 = require("react");
 const hooks_1 = require("../../dialog/hooks");
 const locale_1 = require("../../locale");
 const hooks_2 = require("../../metadata/hooks");
@@ -17,7 +18,7 @@ function useUtility() {
     const openErrorDialog = (0, hooks_1.useOpenErrorDialog)();
     const openPromptDialog = (0, hooks_1.useOpenPromptDialog)();
     const openToastNotification = (0, useOpenToastNotification_1.useOpenToastNotification)();
-    return {
+    return (0, react_1.useMemo)(() => ({
         hideProgressIndicator,
         showProgressIndicator,
         openAlertDialog,
@@ -25,13 +26,21 @@ function useUtility() {
         openErrorDialog,
         openPromptDialog,
         showNotification: openToastNotification,
-    };
+    }), [
+        hideProgressIndicator,
+        openAlertDialog,
+        openConfirmDialog,
+        openErrorDialog,
+        openPromptDialog,
+        openToastNotification,
+        showProgressIndicator,
+    ]);
 }
 function useNavigation() {
     const openForm = (0, navigation_1.useOpenForm)();
-    return {
+    return (0, react_1.useMemo)(() => ({
         openForm,
-    };
+    }), [openForm]);
 }
 function useBaseCommandHandlerContext() {
     const dataService = (0, transport_1.useDataService)();
@@ -40,12 +49,12 @@ function useBaseCommandHandlerContext() {
     const utility = useUtility();
     const locale = (0, locale_1.useLocale)();
     const navigation = useNavigation();
-    return {
+    return (0, react_1.useMemo)(() => ({
         dataService,
         queryClient,
         utility,
         stores,
         locale,
         navigation,
-    };
+    }), [dataService, queryClient, stores, utility, locale, navigation]);
 }

package/datagrid/DataGridProvider/utils.js

@@ -75,17 +75,17 @@ function transformColumnFilter(filter, schema, schemaStore) {
     return transformedResult;
 }
 function mergeConditions(schema, filter, extraFilter, columnFilters, schemaStore) {
-    const conditions = [];
+    const filters = [];
     if (filter) {
-        conditions.push(filter);
+        filters.push(filter);
     }
     if (extraFilter) {
-        conditions.push(extraFilter);
+        filters.push(extraFilter);
     }
     if (columnFilters) {
         const transformedColumnFilters = transformColumnFilter(columnFilters, schema, schemaStore);
         if (transformedColumnFilters) {
-            conditions.push({
+            filters.push({
                 type: 'and',
                 conditions: Object.entries(transformedColumnFilters).map(([field, condition]) => {
                     return {
@@ -98,15 +98,15 @@ function mergeConditions(schema, filter, extraFilter, columnFilters, schemaStore
             });
         }
     }
-    if (conditions.length === 0) {
+    if (filters.length === 0) {
         return null;
     }
-    if (conditions.length === 1) {
-        return conditions[0];
+    if (filters.length === 1) {
+        return filters[0];
     }
     return {
         type: 'and',
-        conditions,
+        filters: filters,
     };
 }
 function collectExpandedKeys(columns) {

package/datagrid/hooks/useMainGridCommands.js

@@ -64,7 +64,7 @@ function useGridControlContext() {
         var _a;
         return ((_a = data === null || data === void 0 ? void 0 : data.records) !== null && _a !== void 0 ? _a : []).filter((record) => selectedIdsObj[record[schema.idAttribute]]);
     }, [data, schema, selectedIdsObj]);
-    return {
+    return (0, react_1.useMemo)(() => ({
         data,
         logicalName: schema.logicalName,
         schema,
@@ -79,12 +79,25 @@ function useGridControlContext() {
         openRecord,
         gridColumns,
         sorting,
-    };
+    }), [
+        columnFilter,
+        data,
+        extraFilter,
+        gridColumns,
+        openRecord,
+        refresh,
+        schema,
+        searchText,
+        selectedIds,
+        selectedRecords,
+        sorting,
+        view,
+    ]);
 }
 function useMainGridCommandHandlerContext() {
     const baseHandlerContext = (0, command_1.useBaseCommandHandlerContext)();
     const primaryControl = useGridControlContext();
-    return Object.assign(Object.assign({}, baseHandlerContext), { primaryControl });
+    return (0, react_1.useMemo)(() => (Object.assign(Object.assign({}, baseHandlerContext), { primaryControl })), [baseHandlerContext, primaryControl]);
 }
 const emptyCommands = [];
 function useGridCommands() {

package/locale/LocaleProvider.d.ts

@@ -1,7 +1,8 @@
 import { Locale } from '@headless-adminapp/core/experience/locale';
 import { FC, PropsWithChildren } from 'react';
 export interface LocaleProviderProps {
-    locale?: string;
+    locale: string;
+    timezone: string;
     options?: {
         direction?: Locale['direction'];
         dateFormats?: Locale['dateFormats'];

package/locale/LocaleProvider.js

@@ -5,10 +5,10 @@ const jsx_runtime_1 = require("react/jsx-runtime");
 const locale_1 = require("@headless-adminapp/core/experience/locale");
 const react_1 = require("react");
 const context_1 = require("./context");
-const LocaleProvider = ({ children, locale = 'en-US', options, }) => {
+const LocaleProvider = ({ children, locale, timezone, options, }) => {
     const localeState = (0, react_1.useMemo)(() => {
-        return (0, locale_1.getLocale)(locale, options);
-    }, [locale, options]);
+        return (0, locale_1.getLocale)(locale, timezone, options);
+    }, [locale, timezone, options]);
     return ((0, jsx_runtime_1.jsx)(context_1.LocaleContext.Provider, { value: localeState, children: children }));
 };
 exports.LocaleProvider = LocaleProvider;

package/metadata/hooks/useMetadata.js

@@ -18,7 +18,7 @@ function useMetadata() {
     const getSchema = (0, react_1.useCallback)((logicalName) => {
         return schemaStore.getSchema(logicalName);
     }, [schemaStore]);
-    return {
+    return (0, react_1.useMemo)(() => ({
         schemas,
         schemaLoading,
         /*** @deprecated */
@@ -26,5 +26,5 @@ function useMetadata() {
         schemaStore,
         appStore,
         experienceStore,
-    };
+    }), [schemas, schemaLoading, schemaStore, appStore, experienceStore, getSchema]);
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@headless-adminapp/app",
-  "version": "0.0.17-alpha.24",
+  "version": "0.0.17-alpha.26",
   "description": "",
   "main": "index.js",
   "types": "index.d.ts",
@@ -39,5 +39,5 @@
     "react-hook-form": "7.52.2",
     "yup": "^1.4.0"
   },
-  "gitHead": "3280eb0e29b7a026f0251771f564b33c123c9bec"
+  "gitHead": "038654b9eb117468f483652a99089cd92764d9d0"
 }

package/utils/getAttributeFormattedValue.d.ts

@@ -11,5 +11,6 @@ export declare function getAttributeFormattedValue<A extends Attribute = Attribu
     currency?: string;
     currencySign?: 'accounting' | 'standard';
     currencyDisplay?: 'symbol' | 'narrowSymbol' | 'code';
+    timezone?: string;
 }): string | null | undefined;
 export {};

package/utils/getAttributeFormattedValue.js

@@ -5,6 +5,10 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.getAttributeFormattedValue = getAttributeFormattedValue;
 const dayjs_1 = __importDefault(require("dayjs"));
+const timezone_1 = __importDefault(require("dayjs/plugin/timezone"));
+const utc_1 = __importDefault(require("dayjs/plugin/utc"));
+dayjs_1.default.extend(utc_1.default);
+dayjs_1.default.extend(timezone_1.default);
 const defaultAttributeFormattedValueStrings = {
     yes: 'Yes',
     no: 'No',
@@ -44,7 +48,9 @@ function getAttributeFormattedValue(attribute, value, options) {
             })
                 .join(', ');
         case 'date':
-            return (0, dayjs_1.default)(value).format(dateFormat);
+            return (0, dayjs_1.default)(value)
+                .tz(options === null || options === void 0 ? void 0 : options.timezone)
+                .format(dateFormat);
         case 'daterange':
             if (!value)
                 return null;
@@ -54,13 +60,15 @@ function getAttributeFormattedValue(attribute, value, options) {
                 return null;
             }
             if (from && to) {
-                return ((0, dayjs_1.default)(from).format(dateFormat) + ' - ' + (0, dayjs_1.default)(to).format(dateFormat));
+                return ((0, dayjs_1.default)(from).tz(options === null || options === void 0 ? void 0 : options.timezone).format(dateFormat) +
+                    ' - ' +
+                    (0, dayjs_1.default)(to).tz(options === null || options === void 0 ? void 0 : options.timezone).format(dateFormat));
             }
             if (from) {
-                return 'After ' + (0, dayjs_1.default)(from).format(dateFormat);
+                return 'After ' + (0, dayjs_1.default)(from).tz(options === null || options === void 0 ? void 0 : options.timezone).format(dateFormat);
             }
             if (to) {
-                return 'Before ' + (0, dayjs_1.default)(to).format(dateFormat);
+                return 'Before ' + (0, dayjs_1.default)(to).tz(options === null || options === void 0 ? void 0 : options.timezone).format(dateFormat);
             }
             return null;
         case 'lookup':