@trackunit/filters-graphql-hook 0.0.1

package/index.esm.js

@@ -0,0 +1,384 @@
+import 'react/jsx-runtime';
+import { registerTranslations } from '@trackunit/i18n-library-translation';
+import { isStringArrayFilterValue, isMinMaxFilterValue, isDateRangeValue, isBooleanValue } from '@trackunit/filters-filter-bar';
+import { truthy } from '@trackunit/shared-utils';
+import { useCurrentUserSystemOfMeasurement, useAssetSorting } from '@trackunit/react-core-hooks';
+import { useMemo } from 'react';
+
+var defaultTranslations = {
+	
+};
+
+/** The translation namespace for this library */
+const namespace = "filters.graphql-hook";
+/**
+ * The TranslationResource for this Library.
+ * Holds lazy loaded imports for all languages supported by the library.
+ *
+ * This is used to register the translations for this library before initializing i18next.
+ */
+const translations = {
+    ns: namespace,
+    default: defaultTranslations,
+    languages: {
+        de: () => import('./translation.esm.js'),
+        da: () => import('./translation.esm2.js'),
+        cs: () => import('./translation.esm3.js'),
+        nl: () => import('./translation.esm4.js'),
+        fr: () => import('./translation.esm5.js'),
+        fi: () => import('./translation.esm6.js'),
+        hu: () => import('./translation.esm7.js'),
+        it: () => import('./translation.esm8.js'),
+        nb: () => import('./translation.esm9.js'),
+        pl: () => import('./translation.esm10.js'),
+        pt: () => import('./translation.esm11.js'),
+        ru: () => import('./translation.esm12.js'),
+        ro: () => import('./translation.esm13.js'),
+        es: () => import('./translation.esm14.js'),
+        sv: () => import('./translation.esm15.js'),
+        ja: () => import('./translation.esm16.js'),
+        th: () => import('./translation.esm17.js'),
+    },
+};
+/**
+ * Registers the translations for this library
+ */
+const setupLibraryTranslations = () => {
+    registerTranslations(translations);
+};
+
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
+const isStringFilterValue = (value) => {
+    return typeof value === "string";
+};
+/**
+ * Fix types for filter values
+ *
+ * @param values - filter values
+ * @param outputTypeRecord - record with output types
+ * @returns {Record | undefined}- fixed filter values
+ */
+const fixTypes = (
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
+values, outputTypeRecord) => {
+    if (!values) {
+        return undefined;
+    }
+    if (Array.isArray(values) && values.length === 0) {
+        return undefined;
+    }
+    if (isStringArrayFilterValue(values)) {
+        const result = values.map(value => {
+            const valuesFromOutput = Object.values(outputTypeRecord);
+            const convertedValue = valuesFromOutput.find(v => value === v);
+            if (!convertedValue) {
+                throw Error(`Unknown value: ${value} expect one of: ${JSON.stringify(Object.values(outputTypeRecord))}`);
+            }
+            // eslint-disable-next-line local-rules/no-typescript-assertion
+            return convertedValue;
+        });
+        return result.filter(truthy);
+    }
+    if (isStringFilterValue(values)) {
+        const valuesFromOutput = Object.values(outputTypeRecord);
+        const convertedValue = valuesFromOutput.find(v => values === v);
+        if (!convertedValue) {
+            throw Error(`Unknown value: ${values} expect one of: ${JSON.stringify(Object.values(outputTypeRecord))}`);
+        }
+        // eslint-disable-next-line local-rules/no-typescript-assertion
+        return [convertedValue];
+    }
+    throw Error(`Unknown value: ${values} should be a string array`);
+};
+/**
+ * Fix type for filter value
+ *
+ * @param values - filter value
+ * @param outputTypeRecord - record with output types
+ * @returns {Record | null}- fixed filter value
+ */
+const fixType = (values, outputTypeRecord) => {
+    if (!values) {
+        return null;
+    }
+    const convertedValue = outputTypeRecord[values];
+    if (!convertedValue) {
+        throw Error(`Unknown value: ${values} expect one of: ${JSON.stringify(Object.values(outputTypeRecord))}`);
+    }
+    // eslint-disable-next-line local-rules/no-typescript-assertion
+    return convertedValue;
+};
+/**
+ * Check if value is not empty
+ */
+const valuesIfNotEmpty = (
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
+value) => {
+    if (Array.isArray(value)) {
+        return value.length > 0 ? value : undefined;
+    }
+    return value;
+};
+/**
+ *  Check if value is string array
+ */
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
+const isStringArrayValue = (value) => {
+    return Array.isArray(value) && value.every(item => typeof item === "string");
+};
+/**
+ * Check if value is string array or undefined
+ */
+const stringArrayOrUndefined = (
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
+value) => {
+    if (isStringArrayValue(value)) {
+        return value.length > 0 ? value : undefined;
+    }
+    return undefined;
+};
+/**
+ * Check if value is ValueName[]
+ */
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
+const isValueName = (value) => {
+    return (Array.isArray(value) &&
+        value.every(item => typeof item === "object" && Object.keys(item).includes("name") && Object.keys(item).includes("value")));
+};
+/**
+ * Check if value is ValueName[] or undefined
+ */
+const valueNameArrayOrUndefined = (
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
+input) => {
+    if (isValueName(input) && input.length > 0) {
+        return input.map(item => item.value);
+    }
+    return undefined;
+};
+
+const assetActivityState = {
+    Idling: "IDLING",
+    Stopped: "STOPPED",
+    Unknown: "UNKNOWN",
+    Working: "WORKING",
+};
+const assetCriticalityState = {
+    Critical: "CRITICAL",
+    Low: "LOW",
+    None: "NONE",
+};
+const assetLastSeen = {
+    Last_7Days: "LAST_7_DAYS",
+    Last_24Hours: "LAST_24_HOURS",
+    Last_30Days: "LAST_30_DAYS",
+    LastHour: "LAST_HOUR",
+    OlderThan_30Days: "OLDER_THAN_30_DAYS",
+};
+const assetType = {
+    Attachment: "ATTACHMENT",
+    Equipment: "EQUIPMENT",
+    Gateway: "GATEWAY",
+    Machine: "MACHINE",
+    Other: "OTHER",
+    Tool: "TOOL",
+};
+const rentalStatus = {
+    Available: "Available",
+    InRepair: "InRepair",
+    NotOnContract: "NotOnContract",
+    OffRent: "OffRent",
+    OnRent: "OnRent",
+    Other: "Other",
+    PickupReady: "PickupReady",
+    Reserved: "Reserved",
+    Returned: "Returned",
+    Transfer: "Transfer",
+};
+const servicePlanStatus = {
+    Complete: "COMPLETE",
+    Draft: "DRAFT",
+    FullyConfigured: "FULLY_CONFIGURED",
+    HasPlan: "HAS_PLAN",
+    HasServiceProvider: "HAS_SERVICE_PROVIDER",
+    MissingPlan: "MISSING_PLAN",
+    MissingProvider: "MISSING_PROVIDER",
+    Overdue: "OVERDUE",
+    Planned: "PLANNED",
+    Unknown: "UNKNOWN",
+    Upcoming: "UPCOMING",
+};
+const siteTypeSfs = {
+    Area: "AREA",
+    ClassicPoi: "CLASSIC_POI",
+    ClassicZone: "CLASSIC_ZONE",
+    ConstructionSite: "CONSTRUCTION_SITE",
+    Depot: "DEPOT",
+    NotOnSite: "NOT_ON_SITE",
+    WorkPlace: "WORK_PLACE",
+};
+
+const CustomFieldPrefix$1 = "cf__";
+/**
+ * Converts custom field filters to a format that can be used by the GraphQL API
+ *
+ * @param filters   Custom field filters
+ * @returns {CustomFieldFilter[]}        Custom field filters in a format that can be used by the GraphQL API
+ */
+// eslint-disable-next-line @typescript-eslint/ban-types
+const useCustomFieldFilters = (filters) => {
+    return useMemo(() => {
+        const result = [];
+        if (filters) {
+            Object.entries(filters).forEach(([key, value]) => {
+                const customFieldValue = value;
+                if (key.startsWith(CustomFieldPrefix$1)) {
+                    const definitionId = key.replace(CustomFieldPrefix$1, "");
+                    if (isStringArrayFilterValue(customFieldValue) && customFieldValue.length > 0) {
+                        result.push({
+                            definitionId,
+                            stringArrayValue: customFieldValue,
+                        });
+                    }
+                    else if (isMinMaxFilterValue(customFieldValue) && (customFieldValue.min || customFieldValue.max)) {
+                        result.push({
+                            definitionId,
+                            numberRange: {
+                                from: customFieldValue.min,
+                                to: customFieldValue.max,
+                            },
+                        });
+                    }
+                    else if (isDateRangeValue(customFieldValue) && (customFieldValue.from || customFieldValue.to)) {
+                        result.push({
+                            definitionId,
+                            dateRange: {
+                                from: customFieldValue.from,
+                                to: customFieldValue.to,
+                            },
+                        });
+                    }
+                    else if (isBooleanValue(customFieldValue)) {
+                        result.push({
+                            definitionId,
+                            booleanValue: customFieldValue.booleanValue === undefined ? null : customFieldValue.booleanValue,
+                        });
+                    }
+                }
+            });
+        }
+        return result;
+    }, [filters]);
+};
+
+const CustomFieldPrefix = "cf__";
+/**
+ * Converts field filters to a format that can be used by the GraphQL API for AssetFiltersInput
+ *
+ * @param filters  FilterBarValues
+ * @returns {AssetFiltersInput}  Custom field filters in a format that can be used by the GraphQL API
+ */
+const useActiveAssetFilters = (filters) => {
+    const { systemOfMeasurement } = useCurrentUserSystemOfMeasurement();
+    const customFields = useCustomFieldFilters({ filters });
+    // TODO make typesafe checks for all filters
+    const filter = useMemo(() => {
+        var _a, _b;
+        if (!filters) {
+            return {};
+        }
+        const followExist = filters.followed === "ALL" ? undefined : true;
+        return {
+            assetIds: stringArrayOrUndefined(filters.assetIds),
+            searchQuery: filters.search === "" || !filters.search ? undefined : filters.search,
+            activities: fixTypes(filters.activity, assetActivityState),
+            boundingBox: filters.boundingBox ? filters.boundingBox : undefined,
+            brands: stringArrayOrUndefined(filters.brands),
+            types: stringArrayOrUndefined(filters.types),
+            criticalities: fixTypes(filters.criticality, assetCriticalityState),
+            productionYears: valueNameArrayOrUndefined(filters.productionYears),
+            followed: filters.followed ? followExist : false,
+            lastSeen: filters.lastSeen === "ALL" || !filters.lastSeen ? undefined : (_a = fixTypes(filters.lastSeen, assetLastSeen)) === null || _a === void 0 ? void 0 : _a[0],
+            models: stringArrayOrUndefined(filters.models),
+            ownerAccountIds: valueNameArrayOrUndefined(filters.ownerAccountIds),
+            assetTypes: fixTypes(filters.assetType, assetType),
+            servicePlanStatuses: fixTypes(filters.serviceStatus, servicePlanStatus),
+            servicePlanAssignments: fixTypes(filters.servicePlanStatus, servicePlanStatus),
+            servicePlanIds: valueNameArrayOrUndefined(filters.servicePlan),
+            serviceProviderIds: valueNameArrayOrUndefined(filters.serviceProvider),
+            //currently we support only 1 filter value to be set so there won't be a second value, soon the partnerId will be transformed to a normal filter and will support an array of strings
+            partnerId: (_b = valueNameArrayOrUndefined(filters.partner)) === null || _b === void 0 ? void 0 : _b[0],
+            groups: valueNameArrayOrUndefined(filters.groups),
+            siteIds: valueNameArrayOrUndefined(filters.siteIds),
+            siteTypes: fixTypes(filters.siteType, siteTypeSfs),
+            rentalCustomerName: stringArrayOrUndefined(filters.rentalCustomerName),
+            rentalStatus: fixTypes(filters.rentalStatus, rentalStatus),
+            customFields: valuesIfNotEmpty(customFields),
+            systemOfMeasurement: systemOfMeasurement,
+        };
+    }, [filters, customFields, systemOfMeasurement]);
+    return filter;
+};
+
+/**
+ * This hook is used to convert the sorting state from the AssetSortingContext to the AssetSortInput used by the GraphQL API
+ */
+const useAssetSortInput = () => {
+    const { sortingState } = useAssetSorting();
+    return useMemo(() => convertToAssetSortInput(sortingState), [sortingState]);
+};
+/**
+ * Convert the sorting state from the AssetSortingContext to the AssetSortInput used by the GraphQL API
+ */
+const convertToAssetSortInput = ({ sortBy, order, customFieldDefinitionId }) => {
+    // If any of these fails, it might be because the `AssetSortByProperty` needs to be updated to match the GraphQL enum
+    return {
+        property: sortBy,
+        order,
+        customFieldDefinitionId,
+    };
+};
+
+/**
+ * A hook used to handle asset query filters.
+ * It resets the pagination when filters change.
+ * The assetQueryVariables can be passed directly to any AssetsResolver based query.
+ * The filters are converted to the GraphQL API format.
+ *
+ * @example const { assetQueryVariables } = useAssetQueryFilters({ filters: filterBar.filterBarConfig.values });
+ * const { data: assets } = useMyAssetsQuery({
+ *  variables: assetQueryVariables,
+ * });
+ * @returns {AssetQueryFilters} - assetQueryVariables
+ */
+const useAssetQueryFilters = (props) => {
+    const filters = useActiveAssetFilters(props.filters);
+    const sort = useAssetSortInput();
+    const { systemOfMeasurement } = useCurrentUserSystemOfMeasurement();
+    const assetQueryVariables = useMemo(() => ({
+        filters,
+        sort,
+        first: props.first || 50,
+        systemOfMeasurement: systemOfMeasurement,
+        // TODO only load custom fields active filters and visible custom field columns in table
+        // definitionIds:
+        //   filters.customFields && filters.customFields.length > 0
+        //     ? filters.customFields.map(customField => customField.definitionId!)
+        //     : undefined,
+        definitionIds: undefined,
+    }), [filters, props.first, sort, systemOfMeasurement]);
+    return useMemo(() => ({
+        assetQueryVariables: assetQueryVariables,
+    }), [assetQueryVariables]);
+};
+
+/*
+ * ----------------------------
+ * | SETUP TRANSLATIONS START |
+ * ----------------------------
+ * This import and function call is needed to register translations for this library.
+ * Do not remove this if this library has translations.
+ */
+setupLibraryTranslations();
+
+export { CustomFieldPrefix, convertToAssetSortInput, fixType, fixTypes, isStringArrayValue, isValueName, stringArrayOrUndefined, useActiveAssetFilters, useAssetQueryFilters, useAssetSortInput, useCustomFieldFilters, valueNameArrayOrUndefined, valuesIfNotEmpty };

package/package.json

@@ -0,0 +1,26 @@
+{
+  "name": "@trackunit/filters-graphql-hook",
+  "version": "0.0.1",
+  "repository": "https://github.com/Trackunit/manager",
+  "license": "SEE LICENSE IN LICENSE.txt",
+  "engines": {
+    "node": ">=18.x"
+  },
+  "dependencies": {
+    "@trackunit/react-core-hooks": "*",
+    "@trackunit/shared-utils": "*",
+    "@trackunit/react-components": "*",
+    "@trackunit/react-filter-components": "*",
+    "react": "^18.2.0",
+    "@trackunit/react-form-components": "*",
+    "react-router-dom": "6.18.0",
+    "react-virtual": "^2.10.4",
+    "dequal": "^2.0.3",
+    "lodash": "4.17.21",
+    "jest-fetch-mock": "^3.0.3",
+    "@trackunit/react-core-contexts-api": "*",
+    "@trackunit/i18n-library-translation": "*"
+  },
+  "module": "./index.esm.js",
+  "main": "./index.cjs.js"
+}

package/src/fixTypes.d.ts

@@ -0,0 +1,37 @@
+import { ValueName } from "@trackunit/filters-filter-bar";
+/**
+ * Fix types for filter values
+ *
+ * @param values - filter values
+ * @param outputTypeRecord - record with output types
+ * @returns {Record | undefined}- fixed filter values
+ */
+export declare const fixTypes: <TRecordType extends Record<string, string>>(values: any, outputTypeRecord: TRecordType) => TRecordType[keyof TRecordType][] | undefined;
+/**
+ * Fix type for filter value
+ *
+ * @param values - filter value
+ * @param outputTypeRecord - record with output types
+ * @returns {Record | null}- fixed filter value
+ */
+export declare const fixType: <TRecordType extends Record<string, string>>(values: string | undefined, outputTypeRecord: TRecordType) => TRecordType[keyof TRecordType] | null;
+/**
+ * Check if value is not empty
+ */
+export declare const valuesIfNotEmpty: <TReturnType>(value: TReturnType) => TReturnType | undefined;
+/**
+ *  Check if value is string array
+ */
+export declare const isStringArrayValue: (value: any) => value is string[];
+/**
+ * Check if value is string array or undefined
+ */
+export declare const stringArrayOrUndefined: (value: any) => string[] | undefined;
+/**
+ * Check if value is ValueName[]
+ */
+export declare const isValueName: (value: any) => value is ValueName[];
+/**
+ * Check if value is ValueName[] or undefined
+ */
+export declare const valueNameArrayOrUndefined: (input: any) => string[] | undefined;

package/src/generated/graphql-api/fragment-masking.d.ts

@@ -0,0 +1,15 @@
+import { ResultOf, DocumentTypeDecoration, TypedDocumentNode } from '@graphql-typed-document-node/core';
+import { Incremental } from './graphql';
+export type FragmentType<TDocumentType extends DocumentTypeDecoration<any, any>> = TDocumentType extends DocumentTypeDecoration<infer TType, any> ? [TType] extends [{
+    ' $fragmentName'?: infer TKey;
+}] ? TKey extends string ? {
+    ' $fragmentRefs'?: {
+        [key in TKey]: TType;
+    };
+} : never : never : never;
+export declare function getFragmentData<TType>(_documentNode: DocumentTypeDecoration<TType, any>, fragmentType: FragmentType<DocumentTypeDecoration<TType, any>>): TType;
+export declare function getFragmentData<TType>(_documentNode: DocumentTypeDecoration<TType, any>, fragmentType: FragmentType<DocumentTypeDecoration<TType, any>> | null | undefined): TType | null | undefined;
+export declare function getFragmentData<TType>(_documentNode: DocumentTypeDecoration<TType, any>, fragmentType: ReadonlyArray<FragmentType<DocumentTypeDecoration<TType, any>>>): ReadonlyArray<TType>;
+export declare function getFragmentData<TType>(_documentNode: DocumentTypeDecoration<TType, any>, fragmentType: ReadonlyArray<FragmentType<DocumentTypeDecoration<TType, any>>> | null | undefined): ReadonlyArray<TType> | null | undefined;
+export declare function makeFragmentData<F extends DocumentTypeDecoration<any, any>, FT extends ResultOf<F>>(data: FT, _fragment: F): FragmentType<F>;
+export declare function isFragmentReady<TQuery, TFrag>(queryNode: DocumentTypeDecoration<TQuery, any>, fragmentNode: TypedDocumentNode<TFrag>, data: FragmentType<TypedDocumentNode<Incremental<TFrag>, any>> | null | undefined): data is FragmentType<typeof fragmentNode>;

package/src/generated/graphql-api/gql.d.ts

@@ -0,0 +1,37 @@
+import * as types from './graphql';
+import { TypedDocumentNode as DocumentNode } from '@graphql-typed-document-node/core';
+/**
+ * Map of all GraphQL operations in the project.
+ *
+ * This map has several performance disadvantages:
+ * 1. It is not tree-shakeable, so it will include all operations in the project.
+ * 2. It is not minifiable, so the string of a GraphQL query will be multiple times inside the bundle.
+ * 3. It does not support dead code elimination, so it will add unused operations.
+ *
+ * Therefore it is highly recommended to use the babel or swc plugin for production.
+ */
+declare const documents: {
+    "query GetFilteredAssets($filters: AssetFiltersInput, $sort: AssetSortInput) {\n  assets(filters: $filters, sort: $sort) {\n    edges {\n      cursor\n    }\n  }\n}": DocumentNode<types.GetFilteredAssetsQuery, types.Exact<{
+        filters?: types.InputMaybe<types.AssetFiltersInput> | undefined;
+        sort?: types.InputMaybe<types.AssetSortInput> | undefined;
+    }>>;
+};
+/**
+ * The graphql function is used to parse GraphQL queries into a document that can be used by GraphQL clients.
+ *
+ *
+ * @example
+ * ```ts
+ * const query = graphql(`query GetUser($id: ID!) { user(id: $id) { name } }`);
+ * ```
+ *
+ * The query argument is unknown!
+ * Please regenerate the types.
+ */
+export declare function graphql(source: string): unknown;
+/**
+ * The graphql function is used to parse GraphQL queries into a document that can be used by GraphQL clients.
+ */
+export declare function graphql(source: "query GetFilteredAssets($filters: AssetFiltersInput, $sort: AssetSortInput) {\n  assets(filters: $filters, sort: $sort) {\n    edges {\n      cursor\n    }\n  }\n}"): (typeof documents)["query GetFilteredAssets($filters: AssetFiltersInput, $sort: AssetSortInput) {\n  assets(filters: $filters, sort: $sort) {\n    edges {\n      cursor\n    }\n  }\n}"];
+export type DocumentType<TDocumentNode extends DocumentNode<any, any>> = TDocumentNode extends DocumentNode<infer TType, any> ? TType : never;
+export {};