@headless-adminapp/app 0.0.17-alpha.8 → 1.0.0

package/transport/InMemoryDataService/index.js

@@ -1,16 +1,8 @@
 "use strict";
-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());
-    });
-};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.InMemoryDataService = void 0;
 class InMemoryDataService {
+    options;
     // , IActionService, IReportService
     constructor(options) {
         this.options = options;
@@ -28,85 +20,70 @@ class InMemoryDataService {
         }
         return this.options.data[logicalName];
     }
-    retriveRecord(logicalName, id) {
-        return __awaiter(this, void 0, void 0, function* () {
-            const schema = this.getSchema(logicalName);
-            const records = this.getCollection(logicalName);
-            const record = records.find((record) => {
-                return record[schema.idAttribute] === id;
-            });
-            if (!record) {
-                throw new Error(`Record with id ${id} not found`);
-            }
-            return record;
+    async retriveRecord(logicalName, id) {
+        const schema = this.getSchema(logicalName);
+        const records = this.getCollection(logicalName);
+        const record = records.find((record) => {
+            return record[schema.idAttribute] === id;
         });
+        if (!record) {
+            throw new Error(`Record with id ${id} not found`);
+        }
+        return record;
     }
-    retriveRecords(_a) {
-        return __awaiter(this, arguments, void 0, function* ({ logicalName, }) {
-            const records = this.getCollection(logicalName);
-            return {
-                logicalName,
-                records: records,
-                count: records.length,
-            };
-        });
+    async retriveRecords({ logicalName, }) {
+        const records = this.getCollection(logicalName);
+        return {
+            logicalName,
+            records: records,
+            count: records.length,
+        };
     }
-    createRecord(logicalName, data) {
-        return __awaiter(this, void 0, void 0, function* () {
-            const schema = this.getSchema(logicalName);
-            const records = this.getCollection(logicalName);
-            const newId = this.options.idGenerator(logicalName, records);
-            const newRecord = Object.assign(Object.assign({}, data), { [schema.idAttribute]: newId });
-            records.push(newRecord);
-            return { id: newId };
-        });
+    async createRecord(logicalName, data) {
+        const schema = this.getSchema(logicalName);
+        const records = this.getCollection(logicalName);
+        const newId = this.options.idGenerator(logicalName, records);
+        const newRecord = {
+            ...data,
+            [schema.idAttribute]: newId,
+        };
+        records.push(newRecord);
+        return { id: newId };
     }
-    updateRecord(logicalName, id, data) {
-        return __awaiter(this, void 0, void 0, function* () {
-            const schema = this.getSchema(logicalName);
-            const records = this.getCollection(logicalName);
-            const record = records.find((record) => {
-                return record[schema.idAttribute] === id;
-            });
-            if (!record) {
-                throw new Error(`Record with id ${id} not found`);
-            }
-            Object.assign(record, data);
-            return { id };
+    async updateRecord(logicalName, id, data) {
+        const schema = this.getSchema(logicalName);
+        const records = this.getCollection(logicalName);
+        const record = records.find((record) => {
+            return record[schema.idAttribute] === id;
         });
+        if (!record) {
+            throw new Error(`Record with id ${id} not found`);
+        }
+        Object.assign(record, data);
+        return { id };
     }
-    deleteRecord(logicalName, id) {
-        return __awaiter(this, void 0, void 0, function* () {
-            const schema = this.getSchema(logicalName);
-            const records = this.getCollection(logicalName);
-            const index = records.findIndex((record) => {
-                return record[schema.idAttribute] === id;
-            });
-            if (index === -1) {
-                throw new Error(`Record with id ${id} not found`);
-            }
-            records.splice(index, 1);
+    async deleteRecord(logicalName, id) {
+        const schema = this.getSchema(logicalName);
+        const records = this.getCollection(logicalName);
+        const index = records.findIndex((record) => {
+            return record[schema.idAttribute] === id;
         });
+        if (index === -1) {
+            throw new Error(`Record with id ${id} not found`);
+        }
+        records.splice(index, 1);
     }
-    executeAction() {
-        return __awaiter(this, void 0, void 0, function* () {
-            return {};
-        });
+    async executeAction() {
+        return {};
     }
-    getReportData() {
-        return __awaiter(this, void 0, void 0, function* () {
-            return {};
-        });
+    async getReportData() {
+        return {};
     }
-    retriveAggregate() {
-        return __awaiter(this, void 0, void 0, function* () {
-            return [];
-        });
+    async retriveAggregate() {
+        return [];
     }
-    customAction() {
-        return __awaiter(this, void 0, void 0, function* () {
-            return {};
-        });
+    async customAction() {
+        return {};
     }
 }
 exports.InMemoryDataService = InMemoryDataService;

package/transport/RestDataService/index.d.ts

@@ -3,11 +3,11 @@ import { RetriveRecordsFnOptions, RetriveRecordsResult } from '@headless-adminap
 interface RestDataServiceOptions {
     endpoint: string;
 }
+export declare function handleResponseError(response: Response): Promise<void>;
 export declare class RestDataService implements IDataService {
     protected readonly options: RestDataServiceOptions;
     constructor(options: RestDataServiceOptions);
     protected readonly headers: Record<string, string>;
-    protected handleResponseError(response: Response): Promise<void>;
     private getHeaders;
     setHeader(name: string, value: string): void;
     removeHeader(name: string): void;
@@ -16,8 +16,8 @@ export declare class RestDataService implements IDataService {
         [key in keyof T]?: string[];
     }): Promise<Data<T>>;
     retriveRecords<T = unknown>(params: RetriveRecordsFnOptions<T>): Promise<RetriveRecordsResult<T>>;
-    createRecord<T>(logicalName: string, data: Partial<T>): Promise<CreateRecordResult<import("@headless-adminapp/core/attributes").Id>>;
-    updateRecord<T>(logicalName: string, id: string, data: Partial<T>): Promise<CreateRecordResult<import("@headless-adminapp/core/attributes").Id>>;
+    createRecord<T>(logicalName: string, data: Partial<T>): Promise<CreateRecordResult<import("@headless-adminapp/core").Id>>;
+    updateRecord<T>(logicalName: string, id: string, data: Partial<T>): Promise<CreateRecordResult<import("@headless-adminapp/core").Id>>;
     deleteRecord(logicalName: string, id: string): Promise<void>;
     retriveAggregate<Q extends Record<string, AggregateAttribute> = Record<string, AggregateAttribute>>(query: AggregateQuery<Q>): Promise<InferredAggregateQueryResult<Q>[]>;
     customAction<T = unknown>(_actionName: string, _payload: unknown): Promise<T>;

package/transport/RestDataService/index.js

@@ -1,38 +1,31 @@
 "use strict";
-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());
-    });
-};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.RestDataService = void 0;
+exports.handleResponseError = handleResponseError;
 const transport_1 = require("@headless-adminapp/core/transport");
+async function handleResponseError(response) {
+    if (response.ok) {
+        return;
+    }
+    if (response.headers.get('content-type')?.includes('application/json')) {
+        const data = await response.json();
+        if (data.error) {
+            throw new transport_1.HttpError(response.status, data.error);
+        }
+    }
+    throw new transport_1.HttpError(response.status, response.statusText);
+}
 class RestDataService {
+    options;
     constructor(options) {
         this.options = options;
-        this.headers = {};
-    }
-    handleResponseError(response) {
-        return __awaiter(this, void 0, void 0, function* () {
-            var _a;
-            if (response.ok) {
-                return;
-            }
-            if ((_a = response.headers.get('content-type')) === null || _a === void 0 ? void 0 : _a.includes('application/json')) {
-                const data = yield response.json();
-                if (data.error) {
-                    throw new transport_1.HttpError(response.status, data.error);
-                }
-            }
-            throw new transport_1.HttpError(response.status, response.statusText);
-        });
     }
+    headers = {};
     getHeaders() {
-        return Object.assign({ 'content-type': 'application/json' }, this.headers);
+        return {
+            'content-type': 'application/json',
+            ...this.headers,
+        };
     }
     setHeader(name, value) {
         this.headers[name] = value;
@@ -40,85 +33,69 @@ class RestDataService {
     removeHeader(name) {
         delete this.headers[name];
     }
-    execute(data) {
-        return __awaiter(this, void 0, void 0, function* () {
-            const response = yield fetch(this.options.endpoint, {
-                headers: this.getHeaders(),
-                method: 'POST',
-                body: JSON.stringify(data),
-            });
-            yield this.handleResponseError(response);
-            return response.json();
+    async execute(data) {
+        const response = await fetch(this.options.endpoint, {
+            headers: this.getHeaders(),
+            method: 'POST',
+            body: JSON.stringify(data),
         });
+        await handleResponseError(response);
+        return response.json();
     }
-    retriveRecord(logicalName, id, columns, expand) {
-        return __awaiter(this, void 0, void 0, function* () {
-            return this.execute({
-                type: 'retriveRecord',
-                payload: {
-                    logicalName,
-                    id,
-                    columns,
-                    expand,
-                },
-            });
+    async retriveRecord(logicalName, id, columns, expand) {
+        return this.execute({
+            type: 'retriveRecord',
+            payload: {
+                logicalName,
+                id,
+                columns,
+                expand,
+            },
         });
     }
-    retriveRecords(params) {
-        return __awaiter(this, void 0, void 0, function* () {
-            return this.execute({
-                type: 'retriveRecords',
-                payload: params,
-            });
+    async retriveRecords(params) {
+        return this.execute({
+            type: 'retriveRecords',
+            payload: params,
         });
     }
-    createRecord(logicalName, data) {
-        return __awaiter(this, void 0, void 0, function* () {
-            return this.execute({
-                type: 'createRecord',
-                payload: {
-                    logicalName,
-                    data,
-                },
-            });
+    async createRecord(logicalName, data) {
+        return this.execute({
+            type: 'createRecord',
+            payload: {
+                logicalName,
+                data,
+            },
         });
     }
-    updateRecord(logicalName, id, data) {
-        return __awaiter(this, void 0, void 0, function* () {
-            return this.execute({
-                type: 'updateRecord',
-                payload: {
-                    logicalName,
-                    id,
-                    data,
-                },
-            });
+    async updateRecord(logicalName, id, data) {
+        return this.execute({
+            type: 'updateRecord',
+            payload: {
+                logicalName,
+                id,
+                data,
+            },
         });
     }
-    deleteRecord(logicalName, id) {
-        return __awaiter(this, void 0, void 0, function* () {
-            return this.execute({
-                type: 'deleteRecord',
-                payload: {
-                    logicalName,
-                    id,
-                },
-            });
+    async deleteRecord(logicalName, id) {
+        return this.execute({
+            type: 'deleteRecord',
+            payload: {
+                logicalName,
+                id,
+            },
         });
     }
-    retriveAggregate(query) {
-        return __awaiter(this, void 0, void 0, function* () {
-            const result = yield this.execute({
-                type: 'retriveAggregate',
-                payload: query,
-            });
-            return result;
+    async retriveAggregate(query) {
+        const result = await this.execute({
+            type: 'retriveAggregate',
+            payload: query,
         });
+        return result;
     }
-    customAction(_actionName, _payload) {
-        return __awaiter(this, void 0, void 0, function* () {
-            throw new Error('Custom action not implemented in RestDataService, to use custom actions, define a custom data service extending RestDataService');
-        });
+    async customAction(_actionName, _payload) {
+        throw new Error('Custom action not implemented in RestDataService, to use custom actions, define a custom data service extending RestDataService');
     }
 }
 exports.RestDataService = RestDataService;

package/transport/context.d.ts

@@ -1,2 +1,3 @@
-import { IDataService } from '@headless-adminapp/core/transport';
+import { IDataService, IFileService } from '@headless-adminapp/core/transport';
 export declare const DataServiceContext: import("react").Context<IDataService | undefined>;
+export declare const FileServiceContext: import("react").Context<IFileService | null>;

package/transport/context.js

@@ -1,5 +1,11 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.DataServiceContext = void 0;
+exports.FileServiceContext = exports.DataServiceContext = void 0;
 const react_1 = require("react");
 exports.DataServiceContext = (0, react_1.createContext)(undefined);
+// export const noopFileService = {
+//   uploadFile: async () => {
+//     throw new Error('File service not implemented');
+//   },
+// } as IFileService;
+exports.FileServiceContext = (0, react_1.createContext)(null);

package/transport/hooks/index.d.ts

@@ -1 +1,2 @@
 export * from './useDataService';
+export * from './useFileService';

package/transport/hooks/index.js

@@ -15,3 +15,4 @@ var __exportStar = (this && this.__exportStar) || function(m, exports) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 __exportStar(require("./useDataService"), exports);
+__exportStar(require("./useFileService"), exports);

package/transport/hooks/useFileService.d.ts

@@ -0,0 +1 @@
+export declare function useFileService(): import("@headless-adminapp/core/transport").IFileService | null;

package/transport/hooks/useFileService.js

@@ -0,0 +1,9 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useFileService = useFileService;
+const react_1 = require("react");
+const context_1 = require("../context");
+function useFileService() {
+    const context = (0, react_1.useContext)(context_1.FileServiceContext);
+    return context;
+}

package/transport/hooks/useRetriveRecords.d.ts

@@ -0,0 +1,33 @@
+import { SortingState } from '@headless-adminapp/core/experience/view';
+import { InferredSchemaType, Schema, SchemaAttributes } from '@headless-adminapp/core/schema';
+import { Filter } from '@headless-adminapp/core/transport';
+import { QueryKey } from '@tanstack/react-query';
+interface UseRetriveRecordProps<S extends SchemaAttributes = SchemaAttributes> {
+    schema: Schema<S>;
+    search: string;
+    filter: Filter | null;
+    sorting: SortingState<S>;
+    columns: string[];
+    expand?: Partial<Record<string, string[]>>;
+    maxRecords: number;
+    disabled?: boolean;
+}
+export declare function useRetrieveRecordsKey<S extends SchemaAttributes = SchemaAttributes>({ schema, search, filter, sorting, columns, expand, maxRecords, }: UseRetriveRecordProps<S>): (string | number | string[] | Filter | Partial<Record<string, string[]>> | SortingState<S> | null | undefined)[];
+export declare function useClearDataExceptFirstPage(queryKey: QueryKey): void;
+export declare function useRetriveRecords<S extends SchemaAttributes = SchemaAttributes>(queryKey: QueryKey, { columns, expand, filter, maxRecords, schema, search, sorting, disabled, }: UseRetriveRecordProps): {
+    data: {
+        logicalName: string;
+        count: number;
+        records: import("@headless-adminapp/core/transport").Data<InferredSchemaType<S>>[];
+    } | null;
+    isFetching: boolean;
+    hasNextPage: boolean;
+    fetchNextPage: (options?: import("@tanstack/react-query").FetchNextPageOptions) => Promise<import("@tanstack/react-query").InfiniteQueryObserverResult<import("@tanstack/react-query").InfiniteData<{
+        params: {
+            pageIndex: number;
+        };
+        data: import("@headless-adminapp/core/transport").RetriveRecordsResult<InferredSchemaType<S>>;
+    }, unknown>, Error>>;
+    isFetchingNextPage: boolean;
+};
+export {};

package/transport/hooks/useRetriveRecords.js

@@ -0,0 +1,110 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useRetrieveRecordsKey = useRetrieveRecordsKey;
+exports.useClearDataExceptFirstPage = useClearDataExceptFirstPage;
+exports.useRetriveRecords = useRetriveRecords;
+const transport_1 = require("@headless-adminapp/app/transport");
+const react_query_1 = require("@tanstack/react-query");
+const react_1 = require("react");
+const ROWS_PER_PAGE = 100;
+function useRetrieveRecordsKey({ schema, search, filter, sorting, columns, expand, maxRecords, }) {
+    const queryKey = (0, react_1.useMemo)(() => [
+        'data',
+        'retriveRecords',
+        schema.logicalName,
+        search,
+        filter,
+        sorting,
+        columns,
+        expand,
+        maxRecords,
+    ], [schema.logicalName, search, filter, sorting, columns, expand, maxRecords]);
+    return queryKey;
+}
+function useClearDataExceptFirstPage(queryKey) {
+    const queryClient = (0, react_query_1.useQueryClient)();
+    (0, react_1.useEffect)(() => {
+        return () => {
+            // Clear all pages except the first one when the component is unmounted
+            queryClient.setQueryData(queryKey, (oldData) => {
+                if (!oldData) {
+                    return oldData;
+                }
+                if (!oldData.pageParams.length || !oldData.pages.length) {
+                    return oldData;
+                }
+                return {
+                    pageParams: [oldData.pageParams[0]],
+                    pages: [oldData.pages[0]],
+                };
+            });
+        };
+    }, [queryClient, queryKey]);
+}
+function useRetriveRecords(queryKey, { columns, expand, filter, maxRecords, schema, search, sorting, disabled, }) {
+    const dataService = (0, transport_1.useDataService)();
+    const { data, isFetching, hasNextPage, fetchNextPage, isFetchingNextPage } = (0, react_query_1.useInfiniteQuery)({
+        queryKey: queryKey,
+        queryFn: async (queryContext) => {
+            const params = queryContext.pageParam ?? {
+                pageIndex: 0,
+            };
+            const skip = params.pageIndex * ROWS_PER_PAGE;
+            const limit = Math.min(ROWS_PER_PAGE, Math.max(0, maxRecords - skip));
+            if (limit <= 0) {
+                return {
+                    params: params,
+                    data: {
+                        logicalName: schema.logicalName,
+                        count: 0,
+                        records: [],
+                    },
+                };
+            }
+            const result = await dataService.retriveRecords({
+                logicalName: schema.logicalName,
+                search,
+                columns: columns,
+                expand,
+                filter,
+                skip,
+                limit,
+                sort: sorting,
+            });
+            return {
+                params: params,
+                data: result,
+            };
+        },
+        getNextPageParam: (lastPage) => {
+            if (lastPage.data.count <
+                ROWS_PER_PAGE * (lastPage.params.pageIndex + 1)) {
+                return undefined;
+            }
+            return {
+                pageIndex: lastPage.params.pageIndex + 1,
+            };
+        },
+        initialPageParam: {
+            pageIndex: 0,
+        },
+        enabled: !disabled,
+    });
+    const finalData = (0, react_1.useMemo)(() => {
+        if (!data?.pages.length) {
+            return null;
+        }
+        return {
+            logicalName: data?.pages?.[0].data.logicalName,
+            count: data?.pages?.[0].data.count ?? 0,
+            records: data?.pages.map((x) => x.data.records).flat() ?? [],
+        };
+    }, [data]);
+    return {
+        data: finalData,
+        isFetching,
+        hasNextPage,
+        fetchNextPage,
+        isFetchingNextPage,
+    };
+}

package/utils/calculateColumnWidths.js

@@ -39,7 +39,7 @@ function extendValues(values, maxValues, available) {
             if (maxValue && value >= maxValue)
                 continue;
             const newValue = value + value * ratio;
-            values[i] = Math.min(newValue, maxValue !== null && maxValue !== void 0 ? maxValue : newValue);
+            values[i] = Math.min(newValue, maxValue ?? newValue);
         }
     } while (true);
     return values;

package/utils/color.d.ts

@@ -0,0 +1 @@
+export declare function isColorDark(color: string): boolean;

package/utils/color.js

@@ -0,0 +1,14 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.isColorDark = isColorDark;
+function isColorDark(color) {
+    if (color.startsWith('#')) {
+        color = color.substring(1);
+    }
+    const rgb = parseInt(color, 16);
+    const r = (rgb >> 16) & 0xff;
+    const g = (rgb >> 8) & 0xff;
+    const b = (rgb >> 0) & 0xff;
+    const luma = 0.2126 * r + 0.7152 * g + 0.0722 * b;
+    return luma < 128;
+}

package/utils/getAttributeFormattedValue.d.ts

@@ -7,9 +7,12 @@ export declare function getAttributeFormattedValue<A extends Attribute = Attribu
     maxCount?: number;
     strings?: AttributeFormattedValueStringsSet;
     dateFormat?: string;
+    timeFormat?: string;
     locale?: string;
     currency?: string;
     currencySign?: 'accounting' | 'standard';
     currencyDisplay?: 'symbol' | 'narrowSymbol' | 'code';
-}): string | null | undefined;
+    timezone?: string;
+    region?: string;
+}): string | null;
 export {};