@trackunit/filters-asset-filter-definitions 0.0.139 → 0.0.140

package/index.cjs.js

@@ -16,7 +16,7 @@ var criticalityIndicator = require('@trackunit/criticality-indicator');
 var reactCoreHooks = require('@trackunit/react-core-hooks');
 var reactFormComponents = require('@trackunit/react-form-components');
 var sharedUtils = require('@trackunit/shared-utils');
-var reactRouterDom = require('react-router-dom');
+var reactRouter = require('@tanstack/react-router');
 var Sentry = require('@sentry/browser');
 var zod = require('zod');
 
@@ -2157,10 +2157,10 @@ const useProductionYearFilter = () => {
 };
 
 const SearchFiltersView = (props) => {
-    const { pathname } = reactRouterDom.useLocation();
-    const navigate = reactRouterDom.useNavigate();
+    const { location: { pathname }, } = reactRouter.useRouterState();
+    const navigate = reactRouter.useNavigate();
     return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(filtersFilterBar.FilterHeader, Object.assign({}, props.filterDefinition, props.filterBarActions, { onResetFilter: () => {
-                    navigate(pathname, { replace: true });
+                    navigate({ to: pathname, params: prev => prev, replace: true });
                 } })), jsxRuntime.jsx(reactFilterComponents.FilterBody, { limitSize: true, children: props.value })] }));
 };
 /**
@@ -2559,34 +2559,49 @@ const useDefaultAssetFilterBarDefinition = () => {
  * Parses (some) filters from the url and sets their respective values in the filter bar.
  */
 const useSetFilterStateFromUrl = ({ setters }) => {
-    const [searchParams, setSearchParams] = reactRouterDom.useSearchParams();
+    const search = reactRouter.useSearch({ strict: false });
+    const navigate = reactRouter.useNavigate();
     react.useEffect(() => {
-        handleSearchParamAsFilter("q", "search", searchParams, stringSchema, value => {
+        handleSearchParamAsFilter("q", "search", search, stringSchema, value => {
             setters.setSearch(() => value);
         });
-        handleSearchParamAsFilter("boundingBox", "boundingBox", searchParams, boundingBoxSchema, value => {
+        handleSearchParamAsFilter("boundingBox", "boundingBox", search, boundingBoxSchema, value => {
             setters.setBoundingBox(() => value);
         });
-        handleSearchParamAsFilter("groups", "groups", searchParams, groupSchema, value => {
+        handleSearchParamAsFilter("groups", "groups", search, groupSchema, value => {
             setters.setGroups(() => value);
         });
-        handleSearchParamAsFilter("criticalities", "criticality", searchParams, criticalitiesSchema, value => {
+        handleSearchParamAsFilter("criticalities", "criticality", search, criticalitiesSchema, value => {
             setters.setCriticality(() => value);
         });
-        setSearchParams(searchParams, { replace: true });
-    }, [searchParams, setters, setSearchParams]);
-    return { searchParams, setSearchParams };
+        navigate({
+            // eslint-disable-next-line  @typescript-eslint/no-explicit-any
+            search: (prev) => {
+                const searchWithFilters = Object.assign(Object.assign({}, prev), { q: undefined, groups: undefined, criticalities: undefined, boundingBox: undefined });
+                return Object.assign(Object.assign({}, prev), searchWithFilters);
+            },
+            replace: true,
+            params: {},
+        });
+    }, [search, setters, navigate]);
+    return { search };
 };
-const handleSearchParamAsFilter = (searchParamName, filterName, searchParams, zodSchema, setter) => {
-    const foundParam = searchParams.get(searchParamName);
-    if (foundParam) {
+const handleSearchParamAsFilter = (searchParamName, filterName, search, zodSchema, setter) => {
+    if (Object.keys(search).includes(searchParamName)) {
+        // eslint-disable-next-line local-rules/no-typescript-assertion, @typescript-eslint/no-explicit-any
+        const foundParam = search[searchParamName];
         try {
             let jsonParsed = null;
             if (zodSchema._def.typeName === "ZodString") {
-                jsonParsed = foundParam;
+                jsonParsed = foundParam ? foundParam + "" : foundParam;
             }
             else {
-                jsonParsed = JSON.parse(foundParam);
+                if (typeof search === "string") {
+                    jsonParsed = JSON.parse(foundParam);
+                }
+                else {
+                    jsonParsed = foundParam;
+                }
             }
             const zodParsed = zodSchema.safeParse(jsonParsed);
             if (zodParsed.success) {
@@ -2609,7 +2624,6 @@ const handleSearchParamAsFilter = (searchParamName, filterName, searchParams, zo
                 zodParseError: null,
             });
         }
-        searchParams.delete(searchParamName);
     }
 };
 const captureUrlParseException = ({ filterName, param, jsonParsed: parsed, }) => Sentry__namespace.captureException(new Error(JSON.stringify({

package/index.esm.js

@@ -12,7 +12,7 @@ import { CriticalityIndicator } from '@trackunit/criticality-indicator';
 import { useAnalytics } from '@trackunit/react-core-hooks';
 import { RadioGroup, RadioItem } from '@trackunit/react-form-components';
 import { hourIntervals, enumFromValue } from '@trackunit/shared-utils';
-import { useLocation, useNavigate, useSearchParams } from 'react-router-dom';
+import { useRouterState, useNavigate, useSearch } from '@tanstack/react-router';
 import * as Sentry from '@sentry/browser';
 import { z } from 'zod';
 
@@ -2133,10 +2133,10 @@ const useProductionYearFilter = () => {
 };
 
 const SearchFiltersView = (props) => {
-    const { pathname } = useLocation();
+    const { location: { pathname }, } = useRouterState();
     const navigate = useNavigate();
     return (jsxs(Fragment, { children: [jsx(FilterHeader, Object.assign({}, props.filterDefinition, props.filterBarActions, { onResetFilter: () => {
-                    navigate(pathname, { replace: true });
+                    navigate({ to: pathname, params: prev => prev, replace: true });
                 } })), jsx(FilterBody, { limitSize: true, children: props.value })] }));
 };
 /**
@@ -2535,34 +2535,49 @@ const useDefaultAssetFilterBarDefinition = () => {
  * Parses (some) filters from the url and sets their respective values in the filter bar.
  */
 const useSetFilterStateFromUrl = ({ setters }) => {
-    const [searchParams, setSearchParams] = useSearchParams();
+    const search = useSearch({ strict: false });
+    const navigate = useNavigate();
     useEffect(() => {
-        handleSearchParamAsFilter("q", "search", searchParams, stringSchema, value => {
+        handleSearchParamAsFilter("q", "search", search, stringSchema, value => {
             setters.setSearch(() => value);
         });
-        handleSearchParamAsFilter("boundingBox", "boundingBox", searchParams, boundingBoxSchema, value => {
+        handleSearchParamAsFilter("boundingBox", "boundingBox", search, boundingBoxSchema, value => {
             setters.setBoundingBox(() => value);
         });
-        handleSearchParamAsFilter("groups", "groups", searchParams, groupSchema, value => {
+        handleSearchParamAsFilter("groups", "groups", search, groupSchema, value => {
             setters.setGroups(() => value);
         });
-        handleSearchParamAsFilter("criticalities", "criticality", searchParams, criticalitiesSchema, value => {
+        handleSearchParamAsFilter("criticalities", "criticality", search, criticalitiesSchema, value => {
             setters.setCriticality(() => value);
         });
-        setSearchParams(searchParams, { replace: true });
-    }, [searchParams, setters, setSearchParams]);
-    return { searchParams, setSearchParams };
+        navigate({
+            // eslint-disable-next-line  @typescript-eslint/no-explicit-any
+            search: (prev) => {
+                const searchWithFilters = Object.assign(Object.assign({}, prev), { q: undefined, groups: undefined, criticalities: undefined, boundingBox: undefined });
+                return Object.assign(Object.assign({}, prev), searchWithFilters);
+            },
+            replace: true,
+            params: {},
+        });
+    }, [search, setters, navigate]);
+    return { search };
 };
-const handleSearchParamAsFilter = (searchParamName, filterName, searchParams, zodSchema, setter) => {
-    const foundParam = searchParams.get(searchParamName);
-    if (foundParam) {
+const handleSearchParamAsFilter = (searchParamName, filterName, search, zodSchema, setter) => {
+    if (Object.keys(search).includes(searchParamName)) {
+        // eslint-disable-next-line local-rules/no-typescript-assertion, @typescript-eslint/no-explicit-any
+        const foundParam = search[searchParamName];
         try {
             let jsonParsed = null;
             if (zodSchema._def.typeName === "ZodString") {
-                jsonParsed = foundParam;
+                jsonParsed = foundParam ? foundParam + "" : foundParam;
             }
             else {
-                jsonParsed = JSON.parse(foundParam);
+                if (typeof search === "string") {
+                    jsonParsed = JSON.parse(foundParam);
+                }
+                else {
+                    jsonParsed = foundParam;
+                }
             }
             const zodParsed = zodSchema.safeParse(jsonParsed);
             if (zodParsed.success) {
@@ -2585,7 +2600,6 @@ const handleSearchParamAsFilter = (searchParamName, filterName, searchParams, zo
                 zodParseError: null,
             });
         }
-        searchParams.delete(searchParamName);
     }
 };
 const captureUrlParseException = ({ filterName, param, jsonParsed: parsed, }) => Sentry.captureException(new Error(JSON.stringify({

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@trackunit/filters-asset-filter-definitions",
-  "version": "0.0.139",
+  "version": "0.0.140",
   "repository": "https://github.com/Trackunit/manager",
   "license": "SEE LICENSE IN LICENSE.txt",
   "engines": {
@@ -22,7 +22,6 @@
     "@trackunit/react-core-hooks": "*",
     "@trackunit/react-form-components": "*",
     "@trackunit/shared-utils": "*",
-    "react-router-dom": "6.18.0",
     "@graphql-typed-document-node/core": "^3.2.0",
     "graphql": "^15.8.0",
     "@trackunit/iris-app-api": "*",
@@ -30,7 +29,8 @@
     "@sentry/browser": "^7.79.0",
     "zod": "3.22.4",
     "@trackunit/i18n-library-translation": "*",
-    "jest-fetch-mock": "^3.0.3"
+    "jest-fetch-mock": "^3.0.3",
+    "@tanstack/react-router": "1.19.1"
   },
   "module": "./index.esm.js",
   "main": "./index.cjs.js"

package/src/hooks/useSetFilterStateFromUrl.d.ts

@@ -7,7 +7,6 @@ interface UseSetFilterStateFromUrlProps {
  * Parses (some) filters from the url and sets their respective values in the filter bar.
  */
 export declare const useSetFilterStateFromUrl: ({ setters }: UseSetFilterStateFromUrlProps) => {
-    searchParams: URLSearchParams;
-    setSearchParams: import("react-router-dom").SetURLSearchParams;
+    search: any;
 };
 export {};