react-magic-search-params 0.1.0

package/dist/react-magic-search-params.cjs.production.min.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"react-magic-search-params.cjs.production.min.js","sources":["../src/useMagicSearchParams.ts"],"sourcesContent":["import { useSearchParams } from 'react-router-dom'\r\nimport { useMemo, useEffect, useRef, useCallback } from 'react'\r\n\r\n\r\n// Custom hook with advanced techniques to handle search parameters for any pagination\r\n\r\ntype CommonParams = {\r\n  page?: number\r\n  page_size?: number\r\n}\r\n/*\r\nMaps all properties of M (mandatory) as required\r\nand all properties of O (optional) as optional. \r\n*/\r\ntype MergeParams<M, O> = {\r\n  [K in keyof M]: M[K]\r\n} & {\r\n  [K in keyof O]?: O[K]\r\n}\r\n/**\r\n * Interface for the configuration object that the hook receives \r\n */\r\ninterface UseMagicSearchParamsOptions<\r\n  M extends Record<string, unknown>,\r\n  O extends Record<string, unknown>\r\n> {\r\n  mandatory: M \r\n  optional?: O\r\n  defaultParams?: Partial<MergeParams<M, O>>\r\n  forceParams?: Partial<MergeParams<M, O>> // transform all to partial to avoid errors\r\n  arraySerialization?: 'csv' | 'repeat' | 'brackets' // technical to serialize arrays in the URL\r\n  omitParamsByValues?: Array<'all' | 'default' | 'unknown' | 'none' | 'void '> \r\n}\r\n\r\n/** \r\nGeneric hook to handle search parameters in the URL\r\n@param mandatory - Mandatory parameters (e.g., page=1, page_size=10, etc.)\r\n@param optional - Optional parameters (e.g., order, search, etc.)\r\n@param defaultParams - Default parameters sent in the URL on initialization\r\n@param forceParams - Parameters forced into the URL regardless of user input\r\n@param omitParamsByValues - Parameters omitted if they have specific values \r\n*/\r\nexport const useMagicSearchParams = <\r\n  M extends Record<string, unknown> & CommonParams,\r\n  O extends Record<string, unknown>,\r\n>({\r\n  mandatory = {} as M,\r\n  optional = {} as O,\r\n  defaultParams = {} as Partial<MergeParams<M, O>>,\r\n  arraySerialization = 'csv',\r\n  forceParams = {} as  {} as Partial<MergeParams<M, O>>,\r\n  omitParamsByValues = [] as Array<'all' | 'default' | 'unknown' | 'none' | 'void '>\r\n}: UseMagicSearchParamsOptions<M, O>)=> {\r\n\r\n\r\n  const [searchParams, setSearchParams] = useSearchParams() \r\n    // Ref to store subscriptions: { paramName: [callback1, callback2, ...] }\r\n  const subscriptionsRef = useRef<Record<string, Array<() => unknown>>>({}); \r\n  const previousParamsRef = useRef<Record<string, unknown>>({})\r\n\r\n  const TOTAL_PARAMS_PAGE: MergeParams<M, O> = useMemo(() => {\r\n    return { ...mandatory, ...optional };\r\n  }, [mandatory, optional]);\r\n\r\n  const PARAM_ORDER = useMemo(() => {\r\n    return Array.from(Object.keys(TOTAL_PARAMS_PAGE))\r\n  }, [TOTAL_PARAMS_PAGE])\r\n\r\n  // we get the keys that are arrays according to TOTAL_PARAMS_PAGE since these require special treatment in the URL due to serialization mode\r\n  const ARRAY_KEYS = useMemo(() => {\r\n    return Object.keys(TOTAL_PARAMS_PAGE).filter(\r\n      (key) => Array.isArray(TOTAL_PARAMS_PAGE[key])\r\n    );\r\n  }, [TOTAL_PARAMS_PAGE])\r\n\r\n  const appendArrayValues = (\r\n    finallyParams: Record<string, unknown>,\r\n    newParams: Record<string, string | string[] | unknown>\r\n  ): Record<string, unknown> => {\r\n \r\n    // Note: We cannot modify the object of the final parameters directly, as immutability must be maintained\r\n    const updatedParams = { ...finallyParams };\r\n  \r\n\r\n    if (ARRAY_KEYS.length === 0) return updatedParams;\r\n  \r\n    ARRAY_KEYS.forEach((key) => {\r\n      // We use the current values directly from searchParams (source of truth)\r\n      // This avoids depending on finallyParams in which the arrays have been omitted\r\n      let currentValues = []; \r\n      switch (arraySerialization) {\r\n        case 'csv': {\r\n          const raw = searchParams.get(key) || '';\r\n          // For csv we expect \"value1,value2,...\" (no prefix)\r\n          currentValues = raw.split(',')\r\n            .map((v) => v.trim())\r\n            .filter(Boolean) as Array<string>\r\n          break;\r\n        }\r\n        case 'repeat': {\r\n          // Here we get all ocurrences of key\r\n          const urlParams = searchParams.getAll(key) as Array<string>\r\n          currentValues = urlParams.length > 0 ? urlParams : []\r\n          \r\n          console.log({REPEAT: currentValues})\r\n          break;\r\n        }\r\n        case 'brackets': {\r\n           // Build URLSearchParams from current parameters (to ensure no serialized values are taken previously)\r\n            const urlParams = searchParams.getAll(`${key}[]`) as Array<string>\r\n            currentValues = urlParams.length > 0 ? urlParams : []\r\n            console.log({BRACKETS: urlParams})\r\n        \r\n    \r\n            break;\r\n        }\r\n        default: {\r\n          // Mode by default works as csv\r\n          const raw = searchParams.get(key) ?? '';\r\n          currentValues = raw.split(',')\r\n            .map((v) => v.trim())\r\n            .filter(Boolean);\r\n          }\r\n        break; \r\n      }\r\n      // Update array values with new ones\r\n    \r\n      if (newParams[key] !== undefined) {\r\n        const incoming = newParams[key];\r\n        let combined: string[] = []\r\n        if (typeof incoming === 'string') {\r\n          // If it is a string, it is toggled (add/remove)\r\n          combined = currentValues.includes(incoming)\r\n            ? currentValues.filter((v) => v !== incoming)\r\n            : [...currentValues, incoming];\r\n          console.log({currentValues})\r\n            console.log({incoming})\r\n          console.log({CONBINED_STRING: combined})\r\n        } else if (Array.isArray(incoming)) {\r\n          // if an array is passed, repeated values are merged into a single value\r\n          // Note: Set is used to remove duplicates\r\n          combined = Array.from(new Set([ ...incoming]));\r\n          console.log({incoming})\r\n          console.log({combined})\r\n        } else {\r\n       \r\n          combined = currentValues;\r\n        }\r\n\r\n        updatedParams[key] = combined\r\n\r\n      }\r\n    });\r\n    console.log({updatedParams})\r\n    return updatedParams\r\n  };\r\n\r\n  const transformParamsToURLSearch = (params: Record<string, unknown>): URLSearchParams => {\r\n    console.log({PARAMS_RECIBIDOS_TRANSFORM: params})\r\n\r\n    const newParam: URLSearchParams = new URLSearchParams()\r\n\r\n    const paramsKeys = Object.keys(params)\r\n\r\n    for (const key of paramsKeys) {\r\n      if (Array.isArray(TOTAL_PARAMS_PAGE[key])) {\r\n        const arrayValue = params[key] as unknown[]\r\n        console.log({arrayValue})\r\n        switch (arraySerialization) {\r\n          case 'csv': {\r\n            const csvValue = arrayValue.join(',')\r\n            // set ensure that the previous value is replaced\r\n            newParam.set(key, csvValue)\r\n            break\r\n          } case 'repeat': {\r\n      \r\n            for (const item of arrayValue) {\r\n              console.log({item})\r\n              // add new value to the key, instead of replacing it\r\n              newParam.append(key, item as string)\r\n   \r\n            }\r\n            break\r\n          } case 'brackets': {\r\n            for (const item of arrayValue) {\r\n              newParam.append(`${key}[]`, item as string)\r\n            }\r\n            break\r\n          } default: {\r\n            const csvValue = arrayValue.join(',')\r\n            newParam.set(key, csvValue)\r\n          }\r\n        }\r\n      } else {\r\n        newParam.set(key, params[key] as string)\r\n      }\r\n    }\r\n    console.log({FINAL: newParam.toString()})\r\n    return newParam\r\n  }\r\n  // @ts-ignore\r\n  const hasForcedParamsValues = ({ paramsForced, compareParams }) => {\r\n\r\n    // Iterates over the forced parameters and verifies that they exist in the URL and match their values\r\n    // Ej: { page: 1, page_size: 10 } === { page: 1, page_size: 10 } => true\r\n    const allParamsMatch = Object.entries(paramsForced).every(\r\n      ([key, value]) => compareParams[key] === value\r\n    );\r\n\r\n    return allParamsMatch;\r\n  };\r\n  \r\n  useEffect(() => {\r\n\r\n    const keysDefaultParams: string[] = Object.keys(defaultParams)\r\n    const keysForceParams: string[] = Object.keys(forceParams)\r\n    if(keysDefaultParams.length === 0 && keysForceParams.length === 0) return\r\n  \r\n\r\n    function handleStartingParams() {\r\n\r\n      const defaultParamsString  = transformParamsToURLSearch(defaultParams).toString()\r\n      const paramsUrl = getParams()\r\n      const paramsUrlString = transformParamsToURLSearch(paramsUrl).toString()\r\n      const forceParamsString = transformParamsToURLSearch(forceParams).toString()\r\n\r\n      console.log({defaultParamsString})\r\n\r\n      const isForcedParams: boolean = hasForcedParamsValues({ paramsForced: forceParams, compareParams: paramsUrl })\r\n\r\n      if (!isForcedParams) {\r\n\r\n        // In this case, the forced parameters take precedence over the default parameters and the parameters of the current URL (which could have been modified by the user, e.g., page_size=1000)\r\n\r\n        updateParams({ newParams: {\r\n          ...defaultParams,\r\n          ...forceParams\r\n        }})\r\n        return\r\n      }\r\n      // In this way it will be validated that the forced parameters keys and values are in the current URL\r\n      const isIncludesForcedParams = hasForcedParamsValues({ paramsForced: forceParamsString, compareParams: defaultParams })\r\n\r\n      if (keysDefaultParams.length > 0 && isIncludesForcedParams) {\r\n        if (defaultParamsString === paramsUrlString) return // this means that the URL already has the default parameters\r\n        updateParams({ newParams: defaultParams })\r\n      }\r\n\r\n    }\r\n    handleStartingParams()\r\n\r\n    // eslint-disable-next-line react-hooks/exhaustive-deps\r\n  }, [])\r\n\r\n  /**\r\n   * Convert a string value to its original type (number, boolean, array) according to TOTAL_PARAMS_PAGE\r\n   * @param value - Chain obtained from the URL\r\n   * @param key - Key of the parameter\r\n   */\r\n  const convertOriginalType = (value: string, key: string) => {\r\n    // Given that the parameters of a URL are recieved as strings, they are converted to their original type\r\n    if (typeof TOTAL_PARAMS_PAGE[key] === 'number') {\r\n      return parseInt(value)\r\n    } else if (typeof TOTAL_PARAMS_PAGE[key] === 'boolean') {\r\n      return value === 'true'\r\n    } else if (Array.isArray(TOTAL_PARAMS_PAGE[key])) {\r\n      // The result will be a valid array represented in the URL ej: tags=tag1,tag2,tag3 to ['tag1', 'tag2', 'tag3'], useful to combine the values of the arrays with the new ones\r\n \r\n      if (arraySerialization === 'csv') {\r\n        return searchParams.getAll(key).join('').split(',')\r\n      } else if (arraySerialization === 'repeat') {\r\n    \r\n        console.log({SEARCH_PARAMS: searchParams.getAll(key)})\r\n        return searchParams.getAll(key)\r\n      } else if (arraySerialization === 'brackets') {\r\n        return searchParams.getAll(`${key}[]`)\r\n      }\r\n     \r\n     \r\n    }\r\n    // Note: dates are not converted as it is better to handle them directly in the component that receives them, using a library like < date-fns >\r\n    return value\r\n  }\r\n  \r\n    /**\r\n   * Gets the current parameters from the URL and converts them to their original type if desired\r\n   * @param convert - If true, converts from string to the inferred type (number, boolean, ...)\r\n   */\r\n    const getStringUrl = (key: string, paramsUrl: Record<string, unknown>) => {\r\n      const isKeyArray = Array.isArray(TOTAL_PARAMS_PAGE[key])\r\n      if (isKeyArray) {\r\n\r\n        if (arraySerialization === 'brackets') {\r\n\r\n          const arrayUrl = searchParams.getAll(`${key}[]`)\r\n          const encodedQueryArray = transformParamsToURLSearch({ [key]: arrayUrl }).toString()\r\n          // in this way the array of the URL is decoded to its original form ej: tags[]=tag1&tags[]=tag2&tags[]=tag3\r\n          const unencodeQuery = decodeURIComponent(encodedQueryArray)\r\n          return unencodeQuery\r\n        } else if (arraySerialization === 'csv') {\r\n          const arrayValue = searchParams.getAll(key)\r\n          const encodedQueryArray = transformParamsToURLSearch({ [key]: arrayValue }).toString()\r\n          const unencodeQuery = decodeURIComponent(encodedQueryArray)\r\n          return unencodeQuery\r\n        }\r\n        const arrayValue = searchParams.getAll(key)\r\n        const stringResult = transformParamsToURLSearch({ [key]: arrayValue }).toString()\r\n        return stringResult\r\n      } else {\r\n   \r\n        return paramsUrl[key] as string\r\n      }\r\n     }\r\n     const getParamsObj = (searchParams: URLSearchParams): Record<string, string | string[]> => {\r\n      const paramsObj: Record<string, string | string[]> = {};\r\n      // @ts-ignore\r\n      for (const [key, value] of searchParams.entries()) {\r\n        if (key.endsWith('[]')) {\r\n          const bareKey = key.replace('[]', '');\r\n          if (paramsObj[bareKey]) {\r\n            (paramsObj[bareKey] as string[]).push(value);\r\n          } else {\r\n            paramsObj[bareKey] = [value];\r\n          }\r\n        } else {\r\n          // If the key already exists, it is a repeated parameter\r\n          if (paramsObj[key]) {\r\n            if (Array.isArray(paramsObj[key])) {\r\n              (paramsObj[key] as string[]).push(value);\r\n            } else {\r\n              paramsObj[key] = [paramsObj[key] as string, value];\r\n            }\r\n          } else {\r\n            paramsObj[key] = value;\r\n          }\r\n        }\r\n      }\r\n      return paramsObj;\r\n     }\r\n    // Optimization: While the parameters are not updated, the current parameters of the URL are not recalculated\r\n    const CURRENT_PARAMS_URL: Record<string, unknown> = useMemo(() => {\r\n\r\n      return arraySerialization === 'brackets' ? getParamsObj(searchParams) : Object.fromEntries(searchParams.entries())\r\n    }, [searchParams, arraySerialization])\r\n\r\n    const getParams = ({ convert = true } = {}): MergeParams<M, O> => {\r\n      // All the paramteres are extracted from the URL and converted into an object\r\n\r\n      const params = Object.keys(CURRENT_PARAMS_URL).reduce((acc, key) => {\r\n        if (Object.prototype.hasOwnProperty.call(TOTAL_PARAMS_PAGE, key)) {\r\n          const realKey = arraySerialization === 'brackets' ? key.replace('[]', '') : key\r\n          // @ts-ignore\r\n          acc[realKey] = convert === true\r\n            ? convertOriginalType(CURRENT_PARAMS_URL[key] as string, key)\r\n            :  getStringUrl(key, CURRENT_PARAMS_URL)\r\n        }\r\n        return acc\r\n      }, {})\r\n  \r\n      return params as MergeParams<M, O>\r\n    }\r\n  type keys = keyof MergeParams<M, O>\r\n  // Note: in this way the return of the getParam function is typed dynamically, thus having autocomplete in the IDE (eg: value.split(','))\r\n  type TagReturn<T extends boolean> = T extends true ? string[] : string;\r\n  const getParam = <T extends boolean>(key: keys, options?: { convert: T }): TagReturn<T>  => {\r\n\r\n    const keyStr = String(key)\r\n    // @ts-ignore\r\n    const value = options?.convert === true ? convertOriginalType(searchParams.get(keyStr), keyStr) : getStringUrl(keyStr,  CURRENT_PARAMS_URL)\r\n    return value as TagReturn<T> \r\n  }\r\n  \r\n  type OptionalParamsFiltered = Partial<O>\r\n\r\n  const calculateOmittedParameters = (newParams: Record<string, unknown | unknown[]>, keepParams: Record<string, boolean>) => {\r\n    // Calculate the ommited parameters, that is, the parameters that have not been sent in the request\r\n    const params = getParams()\r\n    // hasOw\r\n    // Note: it will be necessary to omit the parameters that are arrays because the idea is not to replace them but to add or remove some values\r\n    const newParamsWithoutArray = Object.entries(newParams).filter(([key,]) => !Array.isArray(TOTAL_PARAMS_PAGE[key]))\r\n    const result = Object.assign({\r\n      ...params,\r\n      ...Object.fromEntries(newParamsWithoutArray),\r\n      ...forceParams // the forced parameters will always be sent and will maintain their value\r\n    })\r\n    const paramsFiltered: OptionalParamsFiltered = Object.keys(result).reduce((acc, key) => {\r\n      // for default no parameters are omitted unless specified in the keepParams object\r\n      if (Object.prototype.hasOwnProperty.call(keepParams, key) && keepParams[key] === false) {\r\n        return acc\r\n      // Note: They array of parameters omitted by values (e.g., ['all', 'default']) are omitted since they are usually a default value that is not desired to be sent\r\n      } else if (!!result[key] !== false && !omitParamsByValues.includes(result[key])) {\r\n        // @ts-ignore\r\n        acc[key] = result[key]\r\n      }\r\n\r\n      return acc\r\n    }, {})\r\n\r\n    return {\r\n      ...mandatory,\r\n      ...paramsFiltered\r\n    } \r\n  }\r\n    // @ts-ignore\r\n  const sortParameters = (paramsFiltered) => {\r\n    // sort the parameters according to the structure so that it persists with each change in the URL, eg: localhost:3000/?page=1&page_size=10\r\n    // Note: this visibly improves the user experience\r\n    const orderedParams = PARAM_ORDER.reduce((acc, key) => {\r\n      if (Object.prototype.hasOwnProperty.call(paramsFiltered, key)) {\r\n          // @ts-ignore\r\n        acc[key] = paramsFiltered[key]\r\n      }\r\n\r\n      return acc\r\n    }, {})\r\n    return orderedParams\r\n  }\r\n\r\n  const mandatoryParameters = () => {\r\n    // Note: in case there are arrays in the URL, they are converted to their original form ej: tags=['tag1', 'tag2'] otherwise the parameters are extracted without converting to optimize performance\r\n    const isNecessaryConvert: boolean = ARRAY_KEYS.length > 0 ? true : false\r\n    const totalParametros: Record<string, unknown>  = getParams({ convert: isNecessaryConvert })\r\n\r\n    const paramsUrlFound: Record<string, boolean> = Object.keys(totalParametros).reduce(\r\n      (acc, key) => {\r\n        if (Object.prototype.hasOwnProperty.call(mandatory, key)) {\r\n          // @ts-ignore\r\n          acc[key] = totalParametros[key]\r\n        }\r\n        return acc\r\n      },\r\n      {}\r\n    )\r\n\r\n    return paramsUrlFound\r\n  }\r\n\r\n  const clearParams = ({ keepMandatoryParams = true } = {}): void => {\r\n    // for default, the mandatory parameters are not cleared since the current pagination would be lost\r\n    const paramsTransformed = transformParamsToURLSearch(\r\n      {\r\n        ...mandatory,\r\n     \r\n         ...(keepMandatoryParams && {\r\n          ...mandatoryParameters()\r\n        }),\r\n        ...forceParams \r\n      }\r\n    )\r\n    setSearchParams(paramsTransformed) \r\n  }\r\n\r\n  // transforms the keys to boolean to know which parameters to keep\r\n  type KeepParamsTransformedValuesBoolean = Partial<Record<keyof typeof TOTAL_PARAMS_PAGE, boolean>>\r\n  type NewParams = Partial<typeof TOTAL_PARAMS_PAGE> \r\n  type KeepParams = KeepParamsTransformedValuesBoolean\r\n  const updateParams = ({ newParams = {} as NewParams, keepParams = {} as KeepParams } = {}) => {\r\n\r\n    if (\r\n      Object.keys(newParams).length === 0 &&\r\n      Object.keys(keepParams).length === 0\r\n    ) {\r\n      clearParams()\r\n      return\r\n    }\r\n    // @ts-ignore\r\n    const finallyParamters = calculateOmittedParameters(newParams, keepParams)\r\n\r\n    const convertedArrayValues = appendArrayValues(finallyParamters, newParams)\r\n\r\n    const paramsSorted = sortParameters(convertedArrayValues)\r\n\r\n    setSearchParams(transformParamsToURLSearch(paramsSorted))\r\n\r\n  }\r\n\r\n    // only for the keys of the parameters to subscribe to changes in the URL to trigger the callback\r\n    const onChange = useCallback( (paramName: keys, callbacks: Array<() => void>) => {\r\n      const paramNameStr = String(paramName)\r\n      // replace the previous callbacks with the new ones so as not to accumulate callbacks\r\n      subscriptionsRef.current[paramNameStr] = callbacks;\r\n    }, [])\r\n  \r\n    // each time searchParams changes, we notify the subscribers\r\n    useEffect(() => {\r\n\r\n      for (const [key, value] of Object.entries(subscriptionsRef.current)) {\r\n\r\n        const newValue = CURRENT_PARAMS_URL[key] ?? null \r\n        const oldValue = previousParamsRef.current[key] ?? null\r\n        if (newValue !== oldValue) {\r\n          \r\n          for (const callback of value) {\r\n            console.log(value)\r\n\r\n            callback()\r\n\r\n          }\r\n        }\r\n        // once the callback is executed, the previous value is updated to ensure that the next time the value changes, the callback is executed\r\n        previousParamsRef.current[key] = newValue\r\n      }\r\n\r\n      \r\n    }, [CURRENT_PARAMS_URL])\r\n  return {\r\n    searchParams,\r\n    updateParams,\r\n    clearParams,\r\n    getParams,\r\n    getParam,\r\n    onChange\r\n  }\r\n}\r\n"],"names":["_ref","mandatory","_ref$mandatory","_ref$optional","optional","_ref$defaultParams","defaultParams","_ref$arraySerializati","arraySerialization","_ref$forceParams","forceParams","_ref$omitParamsByValu","omitParamsByValues","_useSearchParams","useSearchParams","searchParams","setSearchParams","subscriptionsRef","useRef","previousParamsRef","TOTAL_PARAMS_PAGE","useMemo","_extends","PARAM_ORDER","Array","from","Object","keys","ARRAY_KEYS","filter","key","isArray","transformParamsToURLSearch","params","console","log","PARAMS_RECIBIDOS_TRANSFORM","newParam","URLSearchParams","_i","_paramsKeys","length","arrayValue","csvValue","join","set","_step","_iterator","_createForOfIteratorHelperLoose","done","item","value","append","_step2","_iterator2","FINAL","toString","hasForcedParamsValues","_ref2","compareParams","entries","paramsForced","every","_ref3","useEffect","keysDefaultParams","keysForceParams","defaultParamsString","paramsUrl","getParams","paramsUrlString","forceParamsString","isIncludesForcedParams","updateParams","newParams","handleStartingParams","convertOriginalType","parseInt","getAll","split","SEARCH_PARAMS","getStringUrl","_transformParamsToURL3","_transformParamsToURL","arrayUrl","encodedQueryArray","decodeURIComponent","_transformParamsToURL2","CURRENT_PARAMS_URL","_step3","paramsObj","_iterator3","_step3$value","endsWith","bareKey","replace","push","getParamsObj","fromEntries","_temp","_ref4$convert","convert","reduce","acc","prototype","hasOwnProperty","call","clearParams","_temp2","totalParametros","_ref6$keepMandatoryPa","keepMandatoryParams","paramsTransformed","_temp3","_ref7$newParams","_ref7","_ref7$keepParams","keepParams","paramsFiltered","convertedArrayValues","finallyParams","updatedParams","forEach","currentValues","get","map","v","trim","Boolean","urlParams","REPEAT","BRACKETS","_searchParams$get","undefined","incoming","combined","includes","concat","CONBINED_STRING","Set","appendArrayValues","newParamsWithoutArray","_ref5","result","assign","calculateOmittedParameters","paramsSorted","onChange","useCallback","paramName","callbacks","paramNameStr","String","current","_i2","_Object$entries","_CURRENT_PARAMS_URL$k","_previousParamsRef$cu","_Object$entries$_i","newValue","_step4","_iterator4","callback","getParam","options","keyStr"],"mappings":"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"}

package/dist/react-magic-search-params.esm.js

@@ -0,0 +1,499 @@
+import { useSearchParams } from 'react-router-dom';
+import { useRef, useMemo, useEffect, useCallback } from 'react';
+
+function _arrayLikeToArray(r, a) {
+  (null == a || a > r.length) && (a = r.length);
+  for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e];
+  return n;
+}
+function _createForOfIteratorHelperLoose(r, e) {
+  var t = "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"];
+  if (t) return (t = t.call(r)).next.bind(t);
+  if (Array.isArray(r) || (t = _unsupportedIterableToArray(r)) || e && r && "number" == typeof r.length) {
+    t && (r = t);
+    var o = 0;
+    return function () {
+      return o >= r.length ? {
+        done: !0
+      } : {
+        done: !1,
+        value: r[o++]
+      };
+    };
+  }
+  throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
+}
+function _extends() {
+  return _extends = Object.assign ? Object.assign.bind() : function (n) {
+    for (var e = 1; e < arguments.length; e++) {
+      var t = arguments[e];
+      for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]);
+    }
+    return n;
+  }, _extends.apply(null, arguments);
+}
+function _unsupportedIterableToArray(r, a) {
+  if (r) {
+    if ("string" == typeof r) return _arrayLikeToArray(r, a);
+    var t = {}.toString.call(r).slice(8, -1);
+    return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0;
+  }
+}
+
+/**
+Generic hook to handle search parameters in the URL
+@param mandatory - Mandatory parameters (e.g., page=1, page_size=10, etc.)
+@param optional - Optional parameters (e.g., order, search, etc.)
+@param defaultParams - Default parameters sent in the URL on initialization
+@param forceParams - Parameters forced into the URL regardless of user input
+@param omitParamsByValues - Parameters omitted if they have specific values
+*/
+var useMagicSearchParams = function useMagicSearchParams(_ref) {
+  var _ref$mandatory = _ref.mandatory,
+    mandatory = _ref$mandatory === void 0 ? {} : _ref$mandatory,
+    _ref$optional = _ref.optional,
+    optional = _ref$optional === void 0 ? {} : _ref$optional,
+    _ref$defaultParams = _ref.defaultParams,
+    defaultParams = _ref$defaultParams === void 0 ? {} : _ref$defaultParams,
+    _ref$arraySerializati = _ref.arraySerialization,
+    arraySerialization = _ref$arraySerializati === void 0 ? 'csv' : _ref$arraySerializati,
+    _ref$forceParams = _ref.forceParams,
+    forceParams = _ref$forceParams === void 0 ? {} : _ref$forceParams,
+    _ref$omitParamsByValu = _ref.omitParamsByValues,
+    omitParamsByValues = _ref$omitParamsByValu === void 0 ? [] : _ref$omitParamsByValu;
+  var _useSearchParams = useSearchParams(),
+    searchParams = _useSearchParams[0],
+    setSearchParams = _useSearchParams[1];
+  // Ref to store subscriptions: { paramName: [callback1, callback2, ...] }
+  var subscriptionsRef = useRef({});
+  var previousParamsRef = useRef({});
+  var TOTAL_PARAMS_PAGE = useMemo(function () {
+    return _extends({}, mandatory, optional);
+  }, [mandatory, optional]);
+  var PARAM_ORDER = useMemo(function () {
+    return Array.from(Object.keys(TOTAL_PARAMS_PAGE));
+  }, [TOTAL_PARAMS_PAGE]);
+  // we get the keys that are arrays according to TOTAL_PARAMS_PAGE since these require special treatment in the URL due to serialization mode
+  var ARRAY_KEYS = useMemo(function () {
+    return Object.keys(TOTAL_PARAMS_PAGE).filter(function (key) {
+      return Array.isArray(TOTAL_PARAMS_PAGE[key]);
+    });
+  }, [TOTAL_PARAMS_PAGE]);
+  var appendArrayValues = function appendArrayValues(finallyParams, newParams) {
+    // Note: We cannot modify the object of the final parameters directly, as immutability must be maintained
+    var updatedParams = _extends({}, finallyParams);
+    if (ARRAY_KEYS.length === 0) return updatedParams;
+    ARRAY_KEYS.forEach(function (key) {
+      // We use the current values directly from searchParams (source of truth)
+      // This avoids depending on finallyParams in which the arrays have been omitted
+      var currentValues = [];
+      switch (arraySerialization) {
+        case 'csv':
+          {
+            var raw = searchParams.get(key) || '';
+            // For csv we expect "value1,value2,..." (no prefix)
+            currentValues = raw.split(',').map(function (v) {
+              return v.trim();
+            }).filter(Boolean);
+            break;
+          }
+        case 'repeat':
+          {
+            // Here we get all ocurrences of key
+            var urlParams = searchParams.getAll(key);
+            currentValues = urlParams.length > 0 ? urlParams : [];
+            console.log({
+              REPEAT: currentValues
+            });
+            break;
+          }
+        case 'brackets':
+          {
+            // Build URLSearchParams from current parameters (to ensure no serialized values are taken previously)
+            var _urlParams = searchParams.getAll(key + "[]");
+            currentValues = _urlParams.length > 0 ? _urlParams : [];
+            console.log({
+              BRACKETS: _urlParams
+            });
+            break;
+          }
+        default:
+          {
+            var _searchParams$get;
+            // Mode by default works as csv
+            var _raw = (_searchParams$get = searchParams.get(key)) != null ? _searchParams$get : '';
+            currentValues = _raw.split(',').map(function (v) {
+              return v.trim();
+            }).filter(Boolean);
+          }
+          break;
+      }
+      // Update array values with new ones
+      if (newParams[key] !== undefined) {
+        var incoming = newParams[key];
+        var combined = [];
+        if (typeof incoming === 'string') {
+          // If it is a string, it is toggled (add/remove)
+          combined = currentValues.includes(incoming) ? currentValues.filter(function (v) {
+            return v !== incoming;
+          }) : [].concat(currentValues, [incoming]);
+          console.log({
+            currentValues: currentValues
+          });
+          console.log({
+            incoming: incoming
+          });
+          console.log({
+            CONBINED_STRING: combined
+          });
+        } else if (Array.isArray(incoming)) {
+          // if an array is passed, repeated values are merged into a single value
+          // Note: Set is used to remove duplicates
+          combined = Array.from(new Set([].concat(incoming)));
+          console.log({
+            incoming: incoming
+          });
+          console.log({
+            combined: combined
+          });
+        } else {
+          combined = currentValues;
+        }
+        updatedParams[key] = combined;
+      }
+    });
+    console.log({
+      updatedParams: updatedParams
+    });
+    return updatedParams;
+  };
+  var transformParamsToURLSearch = function transformParamsToURLSearch(params) {
+    console.log({
+      PARAMS_RECIBIDOS_TRANSFORM: params
+    });
+    var newParam = new URLSearchParams();
+    var paramsKeys = Object.keys(params);
+    for (var _i = 0, _paramsKeys = paramsKeys; _i < _paramsKeys.length; _i++) {
+      var key = _paramsKeys[_i];
+      if (Array.isArray(TOTAL_PARAMS_PAGE[key])) {
+        var arrayValue = params[key];
+        console.log({
+          arrayValue: arrayValue
+        });
+        switch (arraySerialization) {
+          case 'csv':
+            {
+              var csvValue = arrayValue.join(',');
+              // set ensure that the previous value is replaced
+              newParam.set(key, csvValue);
+              break;
+            }
+          case 'repeat':
+            {
+              for (var _iterator = _createForOfIteratorHelperLoose(arrayValue), _step; !(_step = _iterator()).done;) {
+                var item = _step.value;
+                console.log({
+                  item: item
+                });
+                // add new value to the key, instead of replacing it
+                newParam.append(key, item);
+              }
+              break;
+            }
+          case 'brackets':
+            {
+              for (var _iterator2 = _createForOfIteratorHelperLoose(arrayValue), _step2; !(_step2 = _iterator2()).done;) {
+                var _item = _step2.value;
+                newParam.append(key + "[]", _item);
+              }
+              break;
+            }
+          default:
+            {
+              var _csvValue = arrayValue.join(',');
+              newParam.set(key, _csvValue);
+            }
+        }
+      } else {
+        newParam.set(key, params[key]);
+      }
+    }
+    console.log({
+      FINAL: newParam.toString()
+    });
+    return newParam;
+  };
+  // @ts-ignore
+  var hasForcedParamsValues = function hasForcedParamsValues(_ref2) {
+    var paramsForced = _ref2.paramsForced,
+      compareParams = _ref2.compareParams;
+    // Iterates over the forced parameters and verifies that they exist in the URL and match their values
+    // Ej: { page: 1, page_size: 10 } === { page: 1, page_size: 10 } => true
+    var allParamsMatch = Object.entries(paramsForced).every(function (_ref3) {
+      var key = _ref3[0],
+        value = _ref3[1];
+      return compareParams[key] === value;
+    });
+    return allParamsMatch;
+  };
+  useEffect(function () {
+    var keysDefaultParams = Object.keys(defaultParams);
+    var keysForceParams = Object.keys(forceParams);
+    if (keysDefaultParams.length === 0 && keysForceParams.length === 0) return;
+    function handleStartingParams() {
+      var defaultParamsString = transformParamsToURLSearch(defaultParams).toString();
+      var paramsUrl = getParams();
+      var paramsUrlString = transformParamsToURLSearch(paramsUrl).toString();
+      var forceParamsString = transformParamsToURLSearch(forceParams).toString();
+      console.log({
+        defaultParamsString: defaultParamsString
+      });
+      var isForcedParams = hasForcedParamsValues({
+        paramsForced: forceParams,
+        compareParams: paramsUrl
+      });
+      if (!isForcedParams) {
+        // In this case, the forced parameters take precedence over the default parameters and the parameters of the current URL (which could have been modified by the user, e.g., page_size=1000)
+        updateParams({
+          newParams: _extends({}, defaultParams, forceParams)
+        });
+        return;
+      }
+      // In this way it will be validated that the forced parameters keys and values are in the current URL
+      var isIncludesForcedParams = hasForcedParamsValues({
+        paramsForced: forceParamsString,
+        compareParams: defaultParams
+      });
+      if (keysDefaultParams.length > 0 && isIncludesForcedParams) {
+        if (defaultParamsString === paramsUrlString) return; // this means that the URL already has the default parameters
+        updateParams({
+          newParams: defaultParams
+        });
+      }
+    }
+    handleStartingParams();
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, []);
+  /**
+   * Convert a string value to its original type (number, boolean, array) according to TOTAL_PARAMS_PAGE
+   * @param value - Chain obtained from the URL
+   * @param key - Key of the parameter
+   */
+  var convertOriginalType = function convertOriginalType(value, key) {
+    // Given that the parameters of a URL are recieved as strings, they are converted to their original type
+    if (typeof TOTAL_PARAMS_PAGE[key] === 'number') {
+      return parseInt(value);
+    } else if (typeof TOTAL_PARAMS_PAGE[key] === 'boolean') {
+      return value === 'true';
+    } else if (Array.isArray(TOTAL_PARAMS_PAGE[key])) {
+      // The result will be a valid array represented in the URL ej: tags=tag1,tag2,tag3 to ['tag1', 'tag2', 'tag3'], useful to combine the values of the arrays with the new ones
+      if (arraySerialization === 'csv') {
+        return searchParams.getAll(key).join('').split(',');
+      } else if (arraySerialization === 'repeat') {
+        console.log({
+          SEARCH_PARAMS: searchParams.getAll(key)
+        });
+        return searchParams.getAll(key);
+      } else if (arraySerialization === 'brackets') {
+        return searchParams.getAll(key + "[]");
+      }
+    }
+    // Note: dates are not converted as it is better to handle them directly in the component that receives them, using a library like < date-fns >
+    return value;
+  };
+  /**
+  * Gets the current parameters from the URL and converts them to their original type if desired
+  * @param convert - If true, converts from string to the inferred type (number, boolean, ...)
+  */
+  var getStringUrl = function getStringUrl(key, paramsUrl) {
+    var isKeyArray = Array.isArray(TOTAL_PARAMS_PAGE[key]);
+    if (isKeyArray) {
+      var _transformParamsToURL3;
+      if (arraySerialization === 'brackets') {
+        var _transformParamsToURL;
+        var arrayUrl = searchParams.getAll(key + "[]");
+        var encodedQueryArray = transformParamsToURLSearch((_transformParamsToURL = {}, _transformParamsToURL[key] = arrayUrl, _transformParamsToURL)).toString();
+        // in this way the array of the URL is decoded to its original form ej: tags[]=tag1&tags[]=tag2&tags[]=tag3
+        var unencodeQuery = decodeURIComponent(encodedQueryArray);
+        return unencodeQuery;
+      } else if (arraySerialization === 'csv') {
+        var _transformParamsToURL2;
+        var _arrayValue = searchParams.getAll(key);
+        var _encodedQueryArray = transformParamsToURLSearch((_transformParamsToURL2 = {}, _transformParamsToURL2[key] = _arrayValue, _transformParamsToURL2)).toString();
+        var _unencodeQuery = decodeURIComponent(_encodedQueryArray);
+        return _unencodeQuery;
+      }
+      var arrayValue = searchParams.getAll(key);
+      var stringResult = transformParamsToURLSearch((_transformParamsToURL3 = {}, _transformParamsToURL3[key] = arrayValue, _transformParamsToURL3)).toString();
+      return stringResult;
+    } else {
+      return paramsUrl[key];
+    }
+  };
+  var getParamsObj = function getParamsObj(searchParams) {
+    var paramsObj = {};
+    // @ts-ignore
+    for (var _iterator3 = _createForOfIteratorHelperLoose(searchParams.entries()), _step3; !(_step3 = _iterator3()).done;) {
+      var _step3$value = _step3.value,
+        key = _step3$value[0],
+        value = _step3$value[1];
+      if (key.endsWith('[]')) {
+        var bareKey = key.replace('[]', '');
+        if (paramsObj[bareKey]) {
+          paramsObj[bareKey].push(value);
+        } else {
+          paramsObj[bareKey] = [value];
+        }
+      } else {
+        // If the key already exists, it is a repeated parameter
+        if (paramsObj[key]) {
+          if (Array.isArray(paramsObj[key])) {
+            paramsObj[key].push(value);
+          } else {
+            paramsObj[key] = [paramsObj[key], value];
+          }
+        } else {
+          paramsObj[key] = value;
+        }
+      }
+    }
+    return paramsObj;
+  };
+  // Optimization: While the parameters are not updated, the current parameters of the URL are not recalculated
+  var CURRENT_PARAMS_URL = useMemo(function () {
+    return arraySerialization === 'brackets' ? getParamsObj(searchParams) : Object.fromEntries(searchParams.entries());
+  }, [searchParams, arraySerialization]);
+  var getParams = function getParams(_temp) {
+    var _ref4 = _temp === void 0 ? {} : _temp,
+      _ref4$convert = _ref4.convert,
+      convert = _ref4$convert === void 0 ? true : _ref4$convert;
+    // All the paramteres are extracted from the URL and converted into an object
+    var params = Object.keys(CURRENT_PARAMS_URL).reduce(function (acc, key) {
+      if (Object.prototype.hasOwnProperty.call(TOTAL_PARAMS_PAGE, key)) {
+        var realKey = arraySerialization === 'brackets' ? key.replace('[]', '') : key;
+        // @ts-ignore
+        acc[realKey] = convert === true ? convertOriginalType(CURRENT_PARAMS_URL[key], key) : getStringUrl(key, CURRENT_PARAMS_URL);
+      }
+      return acc;
+    }, {});
+    return params;
+  };
+  var getParam = function getParam(key, options) {
+    var keyStr = String(key);
+    // @ts-ignore
+    var value = (options == null ? void 0 : options.convert) === true ? convertOriginalType(searchParams.get(keyStr), keyStr) : getStringUrl(keyStr, CURRENT_PARAMS_URL);
+    return value;
+  };
+  var calculateOmittedParameters = function calculateOmittedParameters(newParams, keepParams) {
+    // Calculate the ommited parameters, that is, the parameters that have not been sent in the request
+    var params = getParams();
+    // hasOw
+    // Note: it will be necessary to omit the parameters that are arrays because the idea is not to replace them but to add or remove some values
+    var newParamsWithoutArray = Object.entries(newParams).filter(function (_ref5) {
+      var key = _ref5[0];
+      return !Array.isArray(TOTAL_PARAMS_PAGE[key]);
+    });
+    var result = Object.assign(_extends({}, params, Object.fromEntries(newParamsWithoutArray), forceParams));
+    var paramsFiltered = Object.keys(result).reduce(function (acc, key) {
+      // for default no parameters are omitted unless specified in the keepParams object
+      if (Object.prototype.hasOwnProperty.call(keepParams, key) && keepParams[key] === false) {
+        return acc;
+        // Note: They array of parameters omitted by values (e.g., ['all', 'default']) are omitted since they are usually a default value that is not desired to be sent
+      } else if (!!result[key] !== false && !omitParamsByValues.includes(result[key])) {
+        // @ts-ignore
+        acc[key] = result[key];
+      }
+      return acc;
+    }, {});
+    return _extends({}, mandatory, paramsFiltered);
+  };
+  // @ts-ignore
+  var sortParameters = function sortParameters(paramsFiltered) {
+    // sort the parameters according to the structure so that it persists with each change in the URL, eg: localhost:3000/?page=1&page_size=10
+    // Note: this visibly improves the user experience
+    var orderedParams = PARAM_ORDER.reduce(function (acc, key) {
+      if (Object.prototype.hasOwnProperty.call(paramsFiltered, key)) {
+        // @ts-ignore
+        acc[key] = paramsFiltered[key];
+      }
+      return acc;
+    }, {});
+    return orderedParams;
+  };
+  var mandatoryParameters = function mandatoryParameters() {
+    // Note: in case there are arrays in the URL, they are converted to their original form ej: tags=['tag1', 'tag2'] otherwise the parameters are extracted without converting to optimize performance
+    var isNecessaryConvert = ARRAY_KEYS.length > 0 ? true : false;
+    var totalParametros = getParams({
+      convert: isNecessaryConvert
+    });
+    var paramsUrlFound = Object.keys(totalParametros).reduce(function (acc, key) {
+      if (Object.prototype.hasOwnProperty.call(mandatory, key)) {
+        // @ts-ignore
+        acc[key] = totalParametros[key];
+      }
+      return acc;
+    }, {});
+    return paramsUrlFound;
+  };
+  var clearParams = function clearParams(_temp2) {
+    var _ref6 = _temp2 === void 0 ? {} : _temp2,
+      _ref6$keepMandatoryPa = _ref6.keepMandatoryParams,
+      keepMandatoryParams = _ref6$keepMandatoryPa === void 0 ? true : _ref6$keepMandatoryPa;
+    // for default, the mandatory parameters are not cleared since the current pagination would be lost
+    var paramsTransformed = transformParamsToURLSearch(_extends({}, mandatory, keepMandatoryParams && _extends({}, mandatoryParameters()), forceParams));
+    setSearchParams(paramsTransformed);
+  };
+  var updateParams = function updateParams(_temp3) {
+    var _ref7 = _temp3 === void 0 ? {} : _temp3,
+      _ref7$newParams = _ref7.newParams,
+      newParams = _ref7$newParams === void 0 ? {} : _ref7$newParams,
+      _ref7$keepParams = _ref7.keepParams,
+      keepParams = _ref7$keepParams === void 0 ? {} : _ref7$keepParams;
+    if (Object.keys(newParams).length === 0 && Object.keys(keepParams).length === 0) {
+      clearParams();
+      return;
+    }
+    // @ts-ignore
+    var finallyParamters = calculateOmittedParameters(newParams, keepParams);
+    var convertedArrayValues = appendArrayValues(finallyParamters, newParams);
+    var paramsSorted = sortParameters(convertedArrayValues);
+    setSearchParams(transformParamsToURLSearch(paramsSorted));
+  };
+  // only for the keys of the parameters to subscribe to changes in the URL to trigger the callback
+  var onChange = useCallback(function (paramName, callbacks) {
+    var paramNameStr = String(paramName);
+    // replace the previous callbacks with the new ones so as not to accumulate callbacks
+    subscriptionsRef.current[paramNameStr] = callbacks;
+  }, []);
+  // each time searchParams changes, we notify the subscribers
+  useEffect(function () {
+    for (var _i2 = 0, _Object$entries = Object.entries(subscriptionsRef.current); _i2 < _Object$entries.length; _i2++) {
+      var _CURRENT_PARAMS_URL$k, _previousParamsRef$cu;
+      var _Object$entries$_i = _Object$entries[_i2],
+        key = _Object$entries$_i[0],
+        value = _Object$entries$_i[1];
+      var newValue = (_CURRENT_PARAMS_URL$k = CURRENT_PARAMS_URL[key]) != null ? _CURRENT_PARAMS_URL$k : null;
+      var oldValue = (_previousParamsRef$cu = previousParamsRef.current[key]) != null ? _previousParamsRef$cu : null;
+      if (newValue !== oldValue) {
+        for (var _iterator4 = _createForOfIteratorHelperLoose(value), _step4; !(_step4 = _iterator4()).done;) {
+          var callback = _step4.value;
+          console.log(value);
+          callback();
+        }
+      }
+      // once the callback is executed, the previous value is updated to ensure that the next time the value changes, the callback is executed
+      previousParamsRef.current[key] = newValue;
+    }
+  }, [CURRENT_PARAMS_URL]);
+  return {
+    searchParams: searchParams,
+    updateParams: updateParams,
+    clearParams: clearParams,
+    getParams: getParams,
+    getParam: getParam,
+    onChange: onChange
+  };
+};
+
+export { useMagicSearchParams };
+//# sourceMappingURL=react-magic-search-params.esm.js.map