@betterinternship/components 1.5.18 → 1.5.19

package/dist/hooks/useClientProcess.js

@@ -94,15 +94,21 @@ const ClientProcessesProvider = ({ children }) => {
                     // Log and call runner
                     console.warn(`Handled ${process.name} (${process.id})!`);
                     options?.onSuccess?.(process.id, process.name, result);
-                    // Invalidate query
-                    await queryClient.invalidateQueries({
-                        queryKey: ['.__process', processId],
-                    });
+                    // Invalidate query only if initially pending
+                    if (queryClient
+                        .getQueryCache()
+                        .findAll({ queryKey: ['.__process', processId] })
+                        .every((q) => q.state.data.pending)) {
+                        await queryClient.invalidateQueries({
+                            queryKey: ['.__process', processId],
+                        });
+                    }
                     return {
                         dto,
                         metadata,
                         options,
                         success: true,
+                        pending: false,
                         result,
                     };
                 }
@@ -114,15 +120,21 @@ const ClientProcessesProvider = ({ children }) => {
                 }
                 else if (process?.status === 'failed') {
                     console.error(`Failed ${process.name} (${process.id}) - ${process.error}.`);
-                    // Invalidate query
-                    await queryClient.invalidateQueries({
-                        queryKey: ['.__process', processId],
-                    });
+                    // Invalidate query only if initially pending
+                    if (queryClient
+                        .getQueryCache()
+                        .findAll({ queryKey: ['.__process', processId] })
+                        .every((q) => q.state.data.pending)) {
+                        await queryClient.invalidateQueries({
+                            queryKey: ['.__process', processId],
+                        });
+                    }
                     return {
                         dto,
                         metadata,
                         options,
                         success: false,
+                        pending: false,
                         error: process.error,
                     };
                 }

package/dist/hooks/useClientProcess.js.map

@@ -1 +1 @@
-{"version":3,"file":"useClientProcess.js","sources":["../../src/hooks/useClientProcess.tsx"],"sourcesContent":["'use client';\r\n\r\nimport { useState, useRef, createContext, useContext, useEffect } from 'react';\r\nimport {\r\n  Query,\r\n  useQueries,\r\n  useQueryClient,\r\n  UseQueryResult,\r\n} from '@tanstack/react-query';\r\nimport { config } from '../config';\r\n\r\ntype ProcessStatus = 'pending' | 'handled' | 'failed';\r\n\r\ninterface Process<T> {\r\n  id: string;\r\n  name: string;\r\n  status: ProcessStatus;\r\n  result?: T;\r\n  error?: string;\r\n  timestamp: string;\r\n}\r\n\r\ninterface ClientProcess<T> {\r\n  dto?: ProcessCallbackDto;\r\n  metadata?: ClientProcessMetadata;\r\n  options?: ClientProcessOptions;\r\n  result?: T;\r\n  success?: boolean;\r\n  pending?: boolean;\r\n  error?: string;\r\n}\r\n\r\nexport interface ProcessCallbackDto {\r\n  processId: string;\r\n  processName: string;\r\n  processCallbackUrl: string;\r\n}\r\n\r\nexport interface ClientProcessOptions {\r\n  onLoading?: (processId: string, processName: string) => void;\r\n  onSuccess?: <R>(processId: string, processName: string, result: R) => void;\r\n  onFailure?: (processId: string, processName: string, error?: string) => void;\r\n}\r\n\r\nexport interface ClientProcessMetadata {\r\n  filterKey: string;\r\n  metadata?: Record<string, string>;\r\n}\r\n\r\nexport interface ProcessResponse {\r\n  processId: string;\r\n  processName: string;\r\n  processCallbackUrl: string;\r\n  success: boolean;\r\n  message?: string;\r\n}\r\n\r\n/**\r\n * The orchestrator service to get the process from.\r\n *\r\n * @param processId\r\n * @returns\r\n */\r\nconst processStatusChecker = <T,>(processId: string) => {\r\n  if (!processId) return { process: null };\r\n  return fetch(`${config.orchestratorApi}/${encodeURIComponent(processId)}`, {\r\n    method: 'GET',\r\n    headers: {\r\n      'Content-Type': 'application/json',\r\n    },\r\n  }).then((response) => response.json()) as unknown as Promise<{\r\n    process: Omit<Process<T>, 'result'>;\r\n  }>;\r\n};\r\n\r\n/**\r\n * This fetches from the callback endpoint.\r\n *\r\n * @param processId\r\n * @returns\r\n */\r\nconst processCallbackResultFetcher = <T,>(\r\n  processId: string,\r\n  processName: string,\r\n  processCallbackUrl?: string,\r\n) =>\r\n  fetch(`${processCallbackUrl}`, {\r\n    method: 'POST',\r\n    headers: {\r\n      'Content-Type': 'application/json',\r\n    },\r\n    body: JSON.stringify({\r\n      processId,\r\n      processName,\r\n    }),\r\n  }).then((response) => response.json()) as unknown as Promise<T>;\r\n\r\ninterface ClientProcesses {\r\n  registerProcess: (\r\n    processId: string,\r\n    dto: ProcessCallbackDto,\r\n    metadata: ClientProcessMetadata,\r\n    options?: ClientProcessOptions,\r\n  ) => void;\r\n  getProcess: <T>(processId: string) => ClientProcess<T> | null;\r\n  filterProcesses: <T>(filter: string) => ClientProcess<T>[];\r\n  cp: UseQueryResult[];\r\n}\r\n\r\n/**\r\n * We need a context to keep track of all client processes.\r\n * This helps us manage the state of the toasts as well.\r\n */\r\nconst clientProcessesContext = createContext<ClientProcesses>(\r\n  {} as ClientProcesses,\r\n);\r\n\r\n/**\r\n * This should be at the root layout.\r\n *\r\n * @context\r\n */\r\nexport const ClientProcessesProvider = ({ children }: { children: React.ReactNode }) => {\r\n  const queryClient = useQueryClient();\r\n  const clientProcessAttempts = useRef<Record<string, number>>({});\r\n  const [clientProcessDtos, setClientProcessDtos] = useState<\r\n    Record<\r\n      string,\r\n      {\r\n        dto: ProcessCallbackDto;\r\n        metadata: ClientProcessMetadata;\r\n        options?: ClientProcessOptions;\r\n      }\r\n    >\r\n  >({});\r\n\r\n  // Populates the state object with cached data on mount\r\n  useEffect(() => {\r\n    setClientProcessDtos((oldData) => {\r\n      if (Object.keys(oldData).length > 0) return oldData;\r\n\r\n      const cachedClientProcesses = queryClient\r\n        .getQueryCache()\r\n        .findAll({ queryKey: ['.__process'], exact: false });\r\n      const seededClientProcesses: typeof oldData = {};\r\n\r\n      for (const query of cachedClientProcesses) {\r\n        const processId = query.queryKey[1];\r\n        if (typeof processId !== 'string') continue;\r\n\r\n        const data = query.state.data as ClientProcess<any>;\r\n        if (!data?.dto || !data?.metadata) continue;\r\n\r\n        seededClientProcesses[processId] = {\r\n          dto: data.dto,\r\n          metadata: data.metadata,\r\n          options: data.options,\r\n        };\r\n      }\r\n\r\n      return { ...oldData, ...seededClientProcesses };\r\n    });\r\n  }, [queryClient]);\r\n\r\n  // The query for all the processes, pending and sht\r\n  const clientProcesses = useQueries({\r\n    queries: Object.entries(clientProcessDtos).map(\r\n      ([processId, { dto, metadata, options }]) => ({\r\n        staleTime: Infinity,\r\n        gcTime: 0,\r\n        refetchOnWindowFocus: true,\r\n        refetchOnMount: true,\r\n        refetchOnReconnect: true,\r\n        queryKey: ['.__process', processId],\r\n        queryFn: async () => {\r\n          if (!processId) throw new Error('No processId');\r\n          const { process } = await processStatusChecker(processId);\r\n\r\n          // Handled! Return the proper response too\r\n          if (process?.status === 'handled') {\r\n            const result = await processCallbackResultFetcher(\r\n              process.id,\r\n              process.name,\r\n              dto.processCallbackUrl,\r\n            );\r\n\r\n            // Log and call runner\r\n            console.warn(`Handled ${process.name} (${process.id})!`);\r\n            options?.onSuccess?.(process.id, process.name, result);\r\n\r\n            // Invalidate query\r\n            await queryClient.invalidateQueries({\r\n              queryKey: ['.__process', processId],\r\n            });\r\n\r\n            return {\r\n              dto,\r\n              metadata,\r\n              options,\r\n              success: true,\r\n              result,\r\n            };\r\n          }\r\n\r\n          // Pending or failed\r\n          if (process?.status === 'pending') {\r\n            console.log(`Running process ${process.name} (${process.id})...`);\r\n            options?.onLoading?.(process.id, process.name);\r\n            return { dto, metadata, options, pending: true };\r\n          } else if (process?.status === 'failed') {\r\n            console.error(\r\n              `Failed ${process.name} (${process.id}) - ${process.error}.`,\r\n            );\r\n\r\n            // Invalidate query\r\n            await queryClient.invalidateQueries({\r\n              queryKey: ['.__process', processId],\r\n            });\r\n\r\n            return {\r\n              dto,\r\n              metadata,\r\n              options,\r\n              success: false,\r\n              error: process.error,\r\n            };\r\n          }\r\n\r\n          // Return null since no response\r\n          return { dto, metadata, options, pending: true };\r\n        },\r\n\r\n        // Returns the next interval length to use to wait for fetch\r\n        refetchInterval: <T,>(query: Query) => {\r\n          const data = query.state.data as ClientProcess<T>;\r\n          if (data?.success !== undefined) return false;\r\n\r\n          // If not defined, init to 0\r\n          if (!clientProcessAttempts.current[processId])\r\n            clientProcessAttempts.current[processId] = 0;\r\n\r\n          const interval = Math.min(\r\n            500 * 2 ** clientProcessAttempts.current[processId],\r\n            10000,\r\n          );\r\n\r\n          clientProcessAttempts.current[processId] += 1;\r\n          return interval;\r\n        },\r\n      }),\r\n    ),\r\n  });\r\n\r\n  /**\r\n   * Registers a new process to handle\r\n   *\r\n   * @param processId\r\n   * @param processCallbackDto\r\n   * @param options\r\n   */\r\n  const registerProcess = (\r\n    processId: string,\r\n    processCallbackDto: ProcessCallbackDto,\r\n    metadata: ClientProcessMetadata,\r\n    options?: ClientProcessOptions,\r\n  ) => {\r\n    setClientProcessDtos({\r\n      ...clientProcessDtos,\r\n      [processId]: { dto: processCallbackDto, metadata, options },\r\n    });\r\n  };\r\n\r\n  /**\r\n   * Retrieves a process\r\n   *\r\n   * @param processId\r\n   * @returns\r\n   */\r\n  const getProcess = <T,>(processId: string) => {\r\n    const clientProcess =\r\n      clientProcesses.find(\r\n        (clientProcess) => clientProcess.data?.dto?.processId === processId,\r\n      )?.data ?? null;\r\n\r\n    return (clientProcess as ClientProcess<T>) ?? null;\r\n  };\r\n\r\n  /**\r\n   * Filters processes by the provided attribute.\r\n   *\r\n   * @param filterKey\r\n   */\r\n  const filterProcesses = <T,>(filterKey: string) => {\r\n    return clientProcesses\r\n      .filter((clientProcess) => !!clientProcess.data?.dto)\r\n      .map((clientProcess) => clientProcess.data)\r\n      .filter(\r\n        (clientProcessData) =>\r\n          clientProcessData?.metadata.filterKey === filterKey,\r\n      ) as ClientProcess<T>[];\r\n  };\r\n\r\n  return (\r\n    <clientProcessesContext.Provider\r\n      value={{\r\n        registerProcess,\r\n        getProcess,\r\n        filterProcesses,\r\n        cp: clientProcesses,\r\n      }}\r\n    >\r\n      {children}\r\n    </clientProcessesContext.Provider>\r\n  );\r\n};;\r\n\r\n/**\r\n * A simpler version, where u just pass the async function that returns process data.\r\n *\r\n * @param caller\r\n * @returns\r\n */\r\nexport function useClientProcess<T>({\r\n  caller,\r\n  filterKey,\r\n  onLoading,\r\n  onSuccess,\r\n  onFailure,\r\n}: {\r\n  caller?: (inputs: T) => Promise<ProcessResponse>;\r\n  filterKey: string;\r\n  onLoading?: (processId: string, processName: string) => void;\r\n  onSuccess?: <R>(processId: string, processName: string, result: R) => void;\r\n  onFailure?: (processId: string, processName: string, error?: string) => void;\r\n}) {\r\n  const clientProcessesApi = useContext(clientProcessesContext);\r\n\r\n  // Note that the exposed function doesn't return process ids\r\n  // Client should be oblivious to those\r\n  // Abstraction BABY!\r\n  const wrappedCaller = async (\r\n    inputs: T,\r\n    metadata?: Record<string, string>,\r\n  ) => {\r\n    const response = await caller?.(inputs);\r\n    if (response) {\r\n      clientProcessesApi.registerProcess(\r\n        response.processId,\r\n        response,\r\n        { filterKey, metadata },\r\n        {\r\n          onLoading,\r\n          onSuccess,\r\n          onFailure,\r\n        },\r\n      );\r\n\r\n      return {\r\n        id: response.processId,\r\n        success: response.success,\r\n        message: response.message,\r\n      };\r\n    }\r\n\r\n    return {\r\n      id: null,\r\n      success: false,\r\n      message: 'No `caller` specified for useClientProcess().',\r\n    };\r\n  };\r\n\r\n  return {\r\n    run: wrappedCaller,\r\n    get: (id: string) => clientProcessesApi.getProcess(id),\r\n    getAll: () => clientProcessesApi.filterProcesses(filterKey),\r\n    getAllPending: () =>\r\n      clientProcessesApi\r\n        .filterProcesses(filterKey)\r\n        .filter((process) => process.pending),\r\n    getAllHandled: () =>\r\n      clientProcessesApi\r\n        .filterProcesses(filterKey)\r\n        .filter((process) => process.success),\r\n    getAllFailed: () =>\r\n      clientProcessesApi\r\n        .filterProcesses(filterKey)\r\n        .filter((process) => !process.success),\r\n    cp: clientProcessesApi.cp,\r\n  };\r\n}"],"names":[],"mappings":";;;;;;AAyDA;;;;;AAKG;AACH;AACE;AAAgB;AAChB;AACE;AACA;AACE;AACD;AACF;AAGH;AAEA;;;;;AAKG;AACH;AAMI;AACA;AACE;AACD;AACD;;;;AAID;AAcH;;;AAGG;AACH;AAIA;;;;AAIG;;AAED;AACA;;;;AAcE;;AACuC;;AAGlC;AACA;;AAGH;;;;AAIE;;;;;;;;;AAUF;AACF;AACF;;;;AAMM;AACA;AACA;AACA;AACA;AACA;;AAEE;AAAgB;;;AAIhB;AACE;;AAOA;AACA;;;AAIE;AACD;;;;;AAMC;;;;;AAMJ;AACE;AACA;;;AAEK;AACL;;;AAME;AACD;;;;;AAMC;;;;;;;;AAUN;AACE;AACA;AAAiC;;AAGjC;AACE;AAEF;AAKA;AACA;;AAEH;AAEJ;AAED;;;;;;AAMG;;AAOD;AACE;;AAED;AACH;AAEA;;;;;AAKG;AACH;;;AAOA;AAEA;;;;AAIG;AACH;AACE;AACG;;AAEA;AAIL;AAEA;;;;AAMM;;AAMR;AAEA;;;;;AAKG;AACG;AAaJ;;;;;;;AAWI;;;;AAQG;;;;;;;;AAWH;AACA;AACA;;AAEJ;;AAGE;;;AAGA;;;AAIA;;;AAIA;;;;;AAMJ;;"}
+{"version":3,"file":"useClientProcess.js","sources":["../../src/hooks/useClientProcess.tsx"],"sourcesContent":["'use client';\r\n\r\nimport { useState, useRef, createContext, useContext, useEffect } from 'react';\r\nimport {\r\n  Query,\r\n  useQueries,\r\n  useQueryClient,\r\n  UseQueryResult,\r\n} from '@tanstack/react-query';\r\nimport { config } from '../config';\r\n\r\ntype ProcessStatus = 'pending' | 'handled' | 'failed';\r\n\r\ninterface Process<T> {\r\n  id: string;\r\n  name: string;\r\n  status: ProcessStatus;\r\n  result?: T;\r\n  error?: string;\r\n  timestamp: string;\r\n}\r\n\r\ninterface ClientProcess<T> {\r\n  dto?: ProcessCallbackDto;\r\n  metadata?: ClientProcessMetadata;\r\n  options?: ClientProcessOptions;\r\n  result?: T;\r\n  success?: boolean;\r\n  pending?: boolean;\r\n  error?: string;\r\n}\r\n\r\nexport interface ProcessCallbackDto {\r\n  processId: string;\r\n  processName: string;\r\n  processCallbackUrl: string;\r\n}\r\n\r\nexport interface ClientProcessOptions {\r\n  onLoading?: (processId: string, processName: string) => void;\r\n  onSuccess?: <R>(processId: string, processName: string, result: R) => void;\r\n  onFailure?: (processId: string, processName: string, error?: string) => void;\r\n}\r\n\r\nexport interface ClientProcessMetadata {\r\n  filterKey: string;\r\n  metadata?: Record<string, string>;\r\n}\r\n\r\nexport interface ProcessResponse {\r\n  processId: string;\r\n  processName: string;\r\n  processCallbackUrl: string;\r\n  success: boolean;\r\n  message?: string;\r\n}\r\n\r\n/**\r\n * The orchestrator service to get the process from.\r\n *\r\n * @param processId\r\n * @returns\r\n */\r\nconst processStatusChecker = <T,>(processId: string) => {\r\n  if (!processId) return { process: null };\r\n  return fetch(`${config.orchestratorApi}/${encodeURIComponent(processId)}`, {\r\n    method: 'GET',\r\n    headers: {\r\n      'Content-Type': 'application/json',\r\n    },\r\n  }).then((response) => response.json()) as unknown as Promise<{\r\n    process: Omit<Process<T>, 'result'>;\r\n  }>;\r\n};\r\n\r\n/**\r\n * This fetches from the callback endpoint.\r\n *\r\n * @param processId\r\n * @returns\r\n */\r\nconst processCallbackResultFetcher = <T,>(\r\n  processId: string,\r\n  processName: string,\r\n  processCallbackUrl?: string,\r\n) =>\r\n  fetch(`${processCallbackUrl}`, {\r\n    method: 'POST',\r\n    headers: {\r\n      'Content-Type': 'application/json',\r\n    },\r\n    body: JSON.stringify({\r\n      processId,\r\n      processName,\r\n    }),\r\n  }).then((response) => response.json()) as unknown as Promise<T>;\r\n\r\ninterface ClientProcesses {\r\n  registerProcess: (\r\n    processId: string,\r\n    dto: ProcessCallbackDto,\r\n    metadata: ClientProcessMetadata,\r\n    options?: ClientProcessOptions,\r\n  ) => void;\r\n  getProcess: <T>(processId: string) => ClientProcess<T> | null;\r\n  filterProcesses: <T>(filter: string) => ClientProcess<T>[];\r\n  cp: UseQueryResult[];\r\n}\r\n\r\n/**\r\n * We need a context to keep track of all client processes.\r\n * This helps us manage the state of the toasts as well.\r\n */\r\nconst clientProcessesContext = createContext<ClientProcesses>(\r\n  {} as ClientProcesses,\r\n);\r\n\r\n/**\r\n * This should be at the root layout.\r\n *\r\n * @context\r\n */\r\nexport const ClientProcessesProvider = ({ children }: { children: React.ReactNode }) => {\r\n  const queryClient = useQueryClient();\r\n  const clientProcessAttempts = useRef<Record<string, number>>({});\r\n  const [clientProcessDtos, setClientProcessDtos] = useState<\r\n    Record<\r\n      string,\r\n      {\r\n        dto: ProcessCallbackDto;\r\n        metadata: ClientProcessMetadata;\r\n        options?: ClientProcessOptions;\r\n      }\r\n    >\r\n  >({});\r\n\r\n  // Populates the state object with cached data on mount\r\n  useEffect(() => {\r\n    setClientProcessDtos((oldData) => {\r\n      if (Object.keys(oldData).length > 0) return oldData;\r\n\r\n      const cachedClientProcesses = queryClient\r\n        .getQueryCache()\r\n        .findAll({ queryKey: ['.__process'], exact: false });\r\n      const seededClientProcesses: typeof oldData = {};\r\n\r\n      for (const query of cachedClientProcesses) {\r\n        const processId = query.queryKey[1];\r\n        if (typeof processId !== 'string') continue;\r\n\r\n        const data = query.state.data as ClientProcess<any>;\r\n        if (!data?.dto || !data?.metadata) continue;\r\n\r\n        seededClientProcesses[processId] = {\r\n          dto: data.dto,\r\n          metadata: data.metadata,\r\n          options: data.options,\r\n        };\r\n      }\r\n\r\n      return { ...oldData, ...seededClientProcesses };\r\n    });\r\n  }, [queryClient]);\r\n\r\n  // The query for all the processes, pending and sht\r\n  const clientProcesses = useQueries({\r\n    queries: Object.entries(clientProcessDtos).map(\r\n      ([processId, { dto, metadata, options }]) => ({\r\n        staleTime: Infinity,\r\n        gcTime: 0,\r\n        refetchOnWindowFocus: true,\r\n        refetchOnMount: true,\r\n        refetchOnReconnect: true,\r\n        queryKey: ['.__process', processId],\r\n        queryFn: async () => {\r\n          if (!processId) throw new Error('No processId');\r\n          const { process } = await processStatusChecker(processId);\r\n\r\n          // Handled! Return the proper response too\r\n          if (process?.status === 'handled') {\r\n            const result = await processCallbackResultFetcher(\r\n              process.id,\r\n              process.name,\r\n              dto.processCallbackUrl,\r\n            );\r\n\r\n            // Log and call runner\r\n            console.warn(`Handled ${process.name} (${process.id})!`);\r\n            options?.onSuccess?.(process.id, process.name, result);\r\n\r\n            // Invalidate query only if initially pending\r\n            if (\r\n              queryClient\r\n                .getQueryCache()\r\n                .findAll({ queryKey: ['.__process', processId] })\r\n                .every((q) => (q.state.data as ClientProcess<any>).pending)\r\n            ) {\r\n              await queryClient.invalidateQueries({\r\n                queryKey: ['.__process', processId],\r\n              });\r\n            }\r\n\r\n            return {\r\n              dto,\r\n              metadata,\r\n              options,\r\n              success: true,\r\n              pending: false,\r\n              result,\r\n            };\r\n          }\r\n\r\n          // Pending or failed\r\n          if (process?.status === 'pending') {\r\n            console.log(`Running process ${process.name} (${process.id})...`);\r\n            options?.onLoading?.(process.id, process.name);\r\n            return { dto, metadata, options, pending: true };\r\n          } else if (process?.status === 'failed') {\r\n            console.error(\r\n              `Failed ${process.name} (${process.id}) - ${process.error}.`,\r\n            );\r\n\r\n            // Invalidate query only if initially pending\r\n            if (\r\n              queryClient\r\n                .getQueryCache()\r\n                .findAll({ queryKey: ['.__process', processId] })\r\n                .every((q) => (q.state.data as ClientProcess<any>).pending)\r\n            ) {\r\n              await queryClient.invalidateQueries({\r\n                queryKey: ['.__process', processId],\r\n              });\r\n            }\r\n\r\n            return {\r\n              dto,\r\n              metadata,\r\n              options,\r\n              success: false,\r\n              pending: false,\r\n              error: process.error,\r\n            };\r\n          }\r\n\r\n          // Return null since no response\r\n          return { dto, metadata, options, pending: true };\r\n        },\r\n\r\n        // Returns the next interval length to use to wait for fetch\r\n        refetchInterval: <T,>(query: Query) => {\r\n          const data = query.state.data as ClientProcess<T>;\r\n          if (data?.success !== undefined) return false;\r\n\r\n          // If not defined, init to 0\r\n          if (!clientProcessAttempts.current[processId])\r\n            clientProcessAttempts.current[processId] = 0;\r\n\r\n          const interval = Math.min(\r\n            500 * 2 ** clientProcessAttempts.current[processId],\r\n            10000,\r\n          );\r\n\r\n          clientProcessAttempts.current[processId] += 1;\r\n          return interval;\r\n        },\r\n      }),\r\n    ),\r\n  });\r\n\r\n  /**\r\n   * Registers a new process to handle\r\n   *\r\n   * @param processId\r\n   * @param processCallbackDto\r\n   * @param options\r\n   */\r\n  const registerProcess = (\r\n    processId: string,\r\n    processCallbackDto: ProcessCallbackDto,\r\n    metadata: ClientProcessMetadata,\r\n    options?: ClientProcessOptions,\r\n  ) => {\r\n    setClientProcessDtos({\r\n      ...clientProcessDtos,\r\n      [processId]: { dto: processCallbackDto, metadata, options },\r\n    });\r\n  };\r\n\r\n  /**\r\n   * Retrieves a process\r\n   *\r\n   * @param processId\r\n   * @returns\r\n   */\r\n  const getProcess = <T,>(processId: string) => {\r\n    const clientProcess =\r\n      clientProcesses.find(\r\n        (clientProcess) => clientProcess.data?.dto?.processId === processId,\r\n      )?.data ?? null;\r\n\r\n    return (clientProcess as ClientProcess<T>) ?? null;\r\n  };\r\n\r\n  /**\r\n   * Filters processes by the provided attribute.\r\n   *\r\n   * @param filterKey\r\n   */\r\n  const filterProcesses = <T,>(filterKey: string) => {\r\n    return clientProcesses\r\n      .filter((clientProcess) => !!clientProcess.data?.dto)\r\n      .map((clientProcess) => clientProcess.data)\r\n      .filter(\r\n        (clientProcessData) =>\r\n          clientProcessData?.metadata.filterKey === filterKey,\r\n      ) as ClientProcess<T>[];\r\n  };\r\n\r\n  return (\r\n    <clientProcessesContext.Provider\r\n      value={{\r\n        registerProcess,\r\n        getProcess,\r\n        filterProcesses,\r\n        cp: clientProcesses,\r\n      }}\r\n    >\r\n      {children}\r\n    </clientProcessesContext.Provider>\r\n  );\r\n};;\r\n\r\n/**\r\n * A simpler version, where u just pass the async function that returns process data.\r\n *\r\n * @param caller\r\n * @returns\r\n */\r\nexport function useClientProcess<T>({\r\n  caller,\r\n  filterKey,\r\n  onLoading,\r\n  onSuccess,\r\n  onFailure,\r\n}: {\r\n  caller?: (inputs: T) => Promise<ProcessResponse>;\r\n  filterKey: string;\r\n  onLoading?: (processId: string, processName: string) => void;\r\n  onSuccess?: <R>(processId: string, processName: string, result: R) => void;\r\n  onFailure?: (processId: string, processName: string, error?: string) => void;\r\n}) {\r\n  const clientProcessesApi = useContext(clientProcessesContext);\r\n\r\n  // Note that the exposed function doesn't return process ids\r\n  // Client should be oblivious to those\r\n  // Abstraction BABY!\r\n  const wrappedCaller = async (\r\n    inputs: T,\r\n    metadata?: Record<string, string>,\r\n  ) => {\r\n    const response = await caller?.(inputs);\r\n    if (response) {\r\n      clientProcessesApi.registerProcess(\r\n        response.processId,\r\n        response,\r\n        { filterKey, metadata },\r\n        {\r\n          onLoading,\r\n          onSuccess,\r\n          onFailure,\r\n        },\r\n      );\r\n\r\n      return {\r\n        id: response.processId,\r\n        success: response.success,\r\n        message: response.message,\r\n      };\r\n    }\r\n\r\n    return {\r\n      id: null,\r\n      success: false,\r\n      message: 'No `caller` specified for useClientProcess().',\r\n    };\r\n  };\r\n\r\n  return {\r\n    run: wrappedCaller,\r\n    get: (id: string) => clientProcessesApi.getProcess(id),\r\n    getAll: () => clientProcessesApi.filterProcesses(filterKey),\r\n    getAllPending: () =>\r\n      clientProcessesApi\r\n        .filterProcesses(filterKey)\r\n        .filter((process) => process.pending),\r\n    getAllHandled: () =>\r\n      clientProcessesApi\r\n        .filterProcesses(filterKey)\r\n        .filter((process) => process.success),\r\n    getAllFailed: () =>\r\n      clientProcessesApi\r\n        .filterProcesses(filterKey)\r\n        .filter((process) => !process.success),\r\n    cp: clientProcessesApi.cp,\r\n  };\r\n}"],"names":[],"mappings":";;;;;;AAyDA;;;;;AAKG;AACH;AACE;AAAgB;AAChB;AACE;AACA;AACE;AACD;AACF;AAGH;AAEA;;;;;AAKG;AACH;AAMI;AACA;AACE;AACD;AACD;;;;AAID;AAcH;;;AAGG;AACH;AAIA;;;;AAIG;;AAED;AACA;;;;AAcE;;AACuC;;AAGlC;AACA;;AAGH;;;;AAIE;;;;;;;;;AAUF;AACF;AACF;;;;AAMM;AACA;AACA;AACA;AACA;AACA;;AAEE;AAAgB;;;AAIhB;AACE;;AAOA;AACA;;AAGA;AAEK;;AAEA;;AAGD;AACD;;;;;;AAOD;AACA;;;;;AAMJ;AACE;AACA;;;AAEK;AACL;;AAKA;AAEK;;AAEA;;AAGD;AACD;;;;;;AAOD;AACA;;;;;;;;AAUN;AACE;AACA;AAAiC;;AAGjC;AACE;AAEF;AAKA;AACA;;AAEH;AAEJ;AAED;;;;;;AAMG;;AAOD;AACE;;AAED;AACH;AAEA;;;;;AAKG;AACH;;;AAOA;AAEA;;;;AAIG;AACH;AACE;AACG;;AAEA;AAIL;AAEA;;;;AAMM;;AAMR;AAEA;;;;;AAKG;AACG;AAaJ;;;;;;;AAWI;;;;AAQG;;;;;;;;AAWH;AACA;AACA;;AAEJ;;AAGE;;;AAGA;;;AAIA;;;AAIA;;;;;AAMJ;;"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@betterinternship/components",
-  "version": "1.5.18",
+  "version": "1.5.19",
   "main": "dist/index.esm.js",
   "module": "dist/index.esm.js",
   "types": "dist/index.d.ts",