@tuwaio/pulsar-react 0.0.3 → 0.0.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/README.md CHANGED
@@ -4,114 +4,139 @@
4
4
  [![License](https://img.shields.io/npm/l/@tuwaio/pulsar-react.svg)](./LICENSE)
5
5
  [![Build Status](https://img.shields.io/github/actions/workflow/status/TuwaIO/pulsar-core/release.yml?branch=main)](https://github.com/TuwaIO/pulsar-core/actions)
6
6
 
7
- Official React bindings for the Pulsar Engine. This package currently provides the essential **`useInitializeTransactionsPool`** hook to resume tracking pending transactions after a page reload.
7
+ Official React bindings for the Pulsar Engine. This package provides the essential **`useInitializeTransactionsPool`** hook to seamlessly integrate Pulsar's state with your application's lifecycle.
8
8
 
9
- ## 🏛️ Architecture
9
+ ---
10
+
11
+ ## 🏛️ What is `@tuwaio/pulsar-react`?
12
+
13
+ This package is the official bridge between the framework-agnostic `@tuwaio/pulsar-core` and a React application. It provides hooks and utilities that simplify the process of connecting Pulsar's state management to the React component lifecycle.
10
14
 
11
- This package acts as a lightweight connector between the framework-agnostic Pulsar engine and a React application. It helps integrate Pulsar's state with the React component lifecycle.
15
+ Its primary role is to ensure that transaction tracking can resume reliably after a page reload.
12
16
 
13
17
  ---
14
18
 
15
19
  ## 💾 Installation
16
20
 
17
- To use this package, you need the core Pulsar stack.
21
+ To use this package, you need the complete Pulsar stack, including `wagmi` for EVM interactions.
18
22
 
19
23
  ```bash
20
- pnpm add @tuwaio/pulsar-react @tuwaio/pulsar-core @tuwaio/pulsar-evm
24
+ # Using pnpm
25
+ pnpm add @tuwaio/pulsar-react @tuwaio/pulsar-core @tuwaio/pulsar-evm wagmi viem zustand immer
26
+
27
+ # Using npm
28
+ npm install @tuwaio/pulsar-react @tuwaio/pulsar-core @tuwaio/pulsar-evm wagmi viem zustand immer
29
+
30
+ # Using yarn
31
+ yarn add @tuwaio/pulsar-react @tuwaio/pulsar-core @tuwaio/pulsar-evm wagmi viem zustand immer
21
32
  ```
22
33
 
23
34
  ---
24
35
 
25
36
  ## 🚀 Getting Started
26
37
 
27
- The `useInitializeTransactionsPool` hook is designed to be called once when your application loads. It requires the `initializeTransactionsPool` function, which is provided by the main Pulsar store.
38
+ The recommended way to integrate Pulsar with React is to create a vanilla store instance, create a bounded hook for it, and then use `useInitializeTransactionsPool` in your main layout component.
28
39
 
29
- Here is a complete example of the recommended setup:
40
+ Here is a complete step-by-step example:
30
41
 
31
- ### Step 1: Create Your `usePulsar` Hook
42
+ ### Step 1: Create the Pulsar Store and Hook
32
43
 
33
- In your application, create a custom hook to access the Pulsar store, which is created by a function from `@tuwaio/pulsar-core`.
44
+ First, create your vanilla Pulsar store and a reusable, bounded hook to access it. This pattern is recommended by Zustand for type safety and ease of use.
34
45
 
35
46
  ```tsx
36
- // hooks/usePulsar.ts
47
+ // src/store/pulsar.ts
37
48
  import { createBoundedUseStore, createPulsarStore } from '@tuwaio/pulsar-core';
49
+ import { evmAdapter } from '@tuwaio/pulsar-evm';
50
+ import { wagmiConfig, chains } from '../configs/wagmi'; // Your wagmi config
51
+
52
+ // 1. Create the vanilla store instance
53
+ const pulsarStore = createPulsarStore({
54
+ name: 'my-app-pulsar-storage',
55
+ adapters: [evmAdapter(wagmiConfig, chains)],
56
+ // ... other configurations
57
+ });
38
58
 
39
- export const usePulsar = createBoundedUseStore(
40
- createPulsarStore({
41
- name: 'pulsar-storage',
42
- // Plug in the EVM adapter with its config for example
43
- adapters: [
44
- evmAdapter(wagmiConfig, [mainnet, sepolia]),
45
- ],
46
- // ... other configurations
47
- }),
48
- );
59
+ // 2. Create and export the bounded hook for React components
60
+ export const usePulsar = createBoundedUseStore(pulsarStore);
61
+
62
+ // 3. Export the vanilla store for non-React usage if needed
63
+ export default pulsarStore;
49
64
  ```
50
65
 
51
- ### Step 2: Create an Initializer Component
66
+ ### Step 2: Initialize the Store in Your App
52
67
 
53
- Create a small, client-side component that uses the hook from this package to initialize the store.
68
+ Create a small, client-side component that uses the `useInitializeTransactionsPool` hook. This component's job is to re-activate trackers for pending transactions when the app loads.
54
69
 
55
70
  ```tsx
56
- // components/TransactionInitializer.tsx
71
+ // src/components/PulsarInitializer.tsx
57
72
  'use client';
58
73
 
59
74
  import { useInitializeTransactionsPool } from '@tuwaio/pulsar-react';
60
- import { usePulsar } from '../hooks/usePulsar';
75
+ import { usePulsar } from '../store/pulsar';
61
76
 
62
- export const TransactionInitializer = () => {
63
- // 1. Get the initialization function from the core store hook
64
- const { initializeTransactionsPool } = usePulsar();
77
+ export const PulsarInitializer = () => {
78
+ // Get the initialization function from the store via our custom hook
79
+ const initializeTransactionsPool = usePulsar((state) => state.initializeTransactionsPool);
65
80
 
66
- // 2. Pass it to the hook from this package to run on mount
67
- useInitializeTransactionsPool(initializeTransactionsPool);
81
+ // Pass the function to the hook from this package
82
+ useInitializeTransactionsPool({ initializeTransactionsPool });
68
83
 
69
- return null; // This component renders nothing
84
+ return null; // This component renders nothing to the DOM
70
85
  };
71
86
  ```
72
87
 
73
- ### Step 3: Add the Initializer to Your App
88
+ ### Step 3: Add the Initializer to Your Root Layout
74
89
 
75
- Place the `TransactionInitializer` component at a high level in your application tree so it runs on every page load.
90
+ Finally, place the `PulsarInitializer` component at a high level in your application tree (e.g., in your root layout or providers component) so it runs on every page load.
76
91
 
77
92
  ```tsx
78
- // app/layout.tsx or app/providers.tsx
93
+ // src/app/layout.tsx (Next.js example)
79
94
  import { WagmiProvider } from 'wagmi';
80
95
  import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
81
-
82
- import { wagmiConfig } from './wagmi';
83
- import { TransactionInitializer } from '../components/TransactionInitializer';
96
+ import { wagmiConfig } from '../configs/wagmi';
97
+ import { PulsarInitializer } from '../components/PulsarInitializer';
84
98
 
85
99
  const queryClient = new QueryClient();
86
100
 
87
- export function Providers({ children }) {
101
+ export default function RootLayout({ children }) {
88
102
  return (
89
- <WagmiProvider config={wagmiConfig}>
90
- <QueryClientProvider client={queryClient}>
91
- <TransactionInitializer />
92
- {children}
93
- </QueryClientProvider>
94
- </WagmiProvider>
103
+ <html lang="en">
104
+ <body>
105
+ <WagmiProvider config={wagmiConfig}>
106
+ <QueryClientProvider client={queryClient}>
107
+ <PulsarInitializer />
108
+ {children}
109
+ </QueryClientProvider>
110
+ </WagmiProvider>
111
+ </body>
112
+ </html>
95
113
  );
96
114
  }
97
115
  ```
98
116
 
117
+ With this setup, your application is now fully configured to track transactions and resume tracking across page reloads.
118
+
99
119
  ---
100
120
 
101
- ## 📖 API: `useInitializeTransactionsPool`
121
+ ## 📖 API Reference
122
+
123
+ ### `useInitializeTransactionsPool(params)`
124
+
125
+ This is the primary hook exported by this package. Its sole purpose is to re-initialize the transaction store on component mount.
126
+
127
+ #### **Parameters**
102
128
 
103
- This is the only hook exported by this package. Its purpose is to re-initialize the transaction store on page load.
129
+ The hook accepts a single object with the following properties:
104
130
 
105
- ### Parameters
106
- - `initializeTransactionsPool`: The initialization function obtained from your `usePulsar` hook.
107
- - `customErrorHandler?`: (Optional) A callback function to handle any errors during initialization.
131
+ - `initializeTransactionsPool: () => Promise<void>`: **(Required)** The initialization function obtained from your Pulsar store.
132
+ - `onError?: (error: Error) => void`: **(Optional)** A callback function to handle any errors that occur during initialization. If not provided, errors will be logged to the console.
108
133
 
109
134
  ---
110
135
 
111
136
  ## 🤝 Contributing
112
137
 
113
- As this package grows, contributions will be welcome! Please read our main **[Contribution Guidelines](https://github.com/TuwaIO/workflows/blob/main/CONTRIBUTING.md)**.
138
+ Contributions are welcome\! Please read our main **[Contribution Guidelines](https://github.com/TuwaIO/workflows/blob/main/CONTRIBUTING.md)**.
114
139
 
115
140
  ## 📄 License
116
141
 
117
- This project is licensed under the **Apache-2.0 License**.
142
+ This project is licensed under the **Apache-2.0 License** - see the [LICENSE](./LICENSE) file for details.
package/dist/index.d.mts CHANGED
@@ -4,11 +4,35 @@
4
4
  */
5
5
  /**
6
6
  * A React hook that triggers the initialization of the transaction pool when the component mounts.
7
- * This ensures that any pending transactions from a previous session are picked up and tracked again.
8
7
  *
9
- * @param {() => Promise<void>} initializeTransactionsPool - The `initializeTransactionsPool` function from the Zustand store.
10
- * @param {(error: Error) => void} [customErrorHandler] - An optional custom function to handle errors during initialization. Defaults to console.error.
8
+ * This should be used once in your application's layout or root component. It ensures that any
9
+ * pending transactions from a previous session (stored in `localStorage`) are picked up and
10
+
11
+ * their trackers are re-activated.
12
+ *
13
+ * @param {object} params - The parameters for the hook.
14
+ * @param {() => Promise<void>} params.initializeTransactionsPool - The `initializeTransactionsPool` function from your Pulsar store instance.
15
+ * @param {(error: Error) => void} [params.onError] - An optional custom function to handle any errors that occur during initialization. Defaults to `console.error`.
16
+ *
17
+ * @example
18
+ * ```tsx
19
+ * import { useInitializeTransactionsPool } from '@tuwaio/pulsar-react';
20
+ * import { pulsarStore } from './path/to/your/store';
21
+ *
22
+ * function AppLayout({ children }) {
23
+ * // This hook will run once when the layout mounts.
24
+ * useInitializeTransactionsPool({
25
+ * initializeTransactionsPool: pulsarStore.getState().initializeTransactionsPool,
26
+ * onError: (err) => console.warn('Failed to re-initialize trackers:', err),
27
+ * });
28
+ *
29
+ * return <div>{children}</div>;
30
+ * }
31
+ * ```
11
32
  */
12
- declare const useInitializeTransactionsPool: (initializeTransactionsPool: () => Promise<void>, customErrorHandler?: (error: Error) => void) => void;
33
+ declare const useInitializeTransactionsPool: ({ initializeTransactionsPool, onError, }: {
34
+ initializeTransactionsPool: () => Promise<void>;
35
+ onError?: (error: Error) => void;
36
+ }) => void;
13
37
 
14
38
  export { useInitializeTransactionsPool };
package/dist/index.d.ts CHANGED
@@ -4,11 +4,35 @@
4
4
  */
5
5
  /**
6
6
  * A React hook that triggers the initialization of the transaction pool when the component mounts.
7
- * This ensures that any pending transactions from a previous session are picked up and tracked again.
8
7
  *
9
- * @param {() => Promise<void>} initializeTransactionsPool - The `initializeTransactionsPool` function from the Zustand store.
10
- * @param {(error: Error) => void} [customErrorHandler] - An optional custom function to handle errors during initialization. Defaults to console.error.
8
+ * This should be used once in your application's layout or root component. It ensures that any
9
+ * pending transactions from a previous session (stored in `localStorage`) are picked up and
10
+
11
+ * their trackers are re-activated.
12
+ *
13
+ * @param {object} params - The parameters for the hook.
14
+ * @param {() => Promise<void>} params.initializeTransactionsPool - The `initializeTransactionsPool` function from your Pulsar store instance.
15
+ * @param {(error: Error) => void} [params.onError] - An optional custom function to handle any errors that occur during initialization. Defaults to `console.error`.
16
+ *
17
+ * @example
18
+ * ```tsx
19
+ * import { useInitializeTransactionsPool } from '@tuwaio/pulsar-react';
20
+ * import { pulsarStore } from './path/to/your/store';
21
+ *
22
+ * function AppLayout({ children }) {
23
+ * // This hook will run once when the layout mounts.
24
+ * useInitializeTransactionsPool({
25
+ * initializeTransactionsPool: pulsarStore.getState().initializeTransactionsPool,
26
+ * onError: (err) => console.warn('Failed to re-initialize trackers:', err),
27
+ * });
28
+ *
29
+ * return <div>{children}</div>;
30
+ * }
31
+ * ```
11
32
  */
12
- declare const useInitializeTransactionsPool: (initializeTransactionsPool: () => Promise<void>, customErrorHandler?: (error: Error) => void) => void;
33
+ declare const useInitializeTransactionsPool: ({ initializeTransactionsPool, onError, }: {
34
+ initializeTransactionsPool: () => Promise<void>;
35
+ onError?: (error: Error) => void;
36
+ }) => void;
13
37
 
14
38
  export { useInitializeTransactionsPool };
package/dist/index.js CHANGED
@@ -1,2 +1,2 @@
1
- 'use strict';var react=require('react');var t=async(r,o)=>{try{await r();}catch(i){o(i);}},n=(r,o)=>{let i=e=>{o?o(e):console.error("Failed to initialize transactions pool:",e);};react.useEffect(()=>{t(r,i);},[r,o]);};exports.useInitializeTransactionsPool=n;//# sourceMappingURL=index.js.map
1
+ 'use strict';var react=require('react');var c=({initializeTransactionsPool:r,onError:o})=>{react.useEffect(()=>{(async()=>{try{await r();}catch(e){(o??(i=>console.error("Failed to initialize transactions pool:",i)))(e);}})();},[r,o]);};exports.useInitializeTransactionsPool=c;//# sourceMappingURL=index.js.map
2
2
  //# sourceMappingURL=index.js.map
package/dist/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/hooks/useInitializeTransactionsPool.tsx"],"names":["loadTransactions","initializeTransactionsPool","errorHandler","error","useInitializeTransactionsPool","customErrorHandler","handleError","useEffect"],"mappings":"wCAeA,IAAMA,CAAAA,CAAmB,MACvBC,CAAAA,CACAC,CAAAA,GACkB,CAClB,GAAI,CACF,MAAMD,IACR,CAAA,MAASE,CAAAA,CAAO,CACdD,CAAAA,CAAaC,CAAc,EAC7B,CACF,CAAA,CASaC,CAAAA,CAAgC,CAC3CH,CAAAA,CACAI,CAAAA,GACG,CACH,IAAMC,CAAAA,CAAeH,CAAAA,EAAiB,CAChCE,CAAAA,CACFA,CAAAA,CAAmBF,CAAK,CAAA,CAExB,OAAA,CAAQ,KAAA,CAAM,yCAAA,CAA2CA,CAAK,EAElE,EAEAI,eAAAA,CAAU,IAAM,CAGdP,CAAAA,CAAiBC,CAAAA,CAA4BK,CAAW,EAC1D,CAAA,CAAG,CAACL,CAAAA,CAA4BI,CAAkB,CAAC,EACrD","file":"index.js","sourcesContent":["/**\n * @file This file defines a React hook for initializing the transaction pool.\n * This hook is crucial for resuming the tracking of pending transactions after a page reload.\n */\n\nimport { useEffect } from 'react';\n\n/**\n * An internal helper function to safely execute the initialization process.\n * It wraps the call in a try-catch block to handle any potential errors.\n *\n * @param {() => Promise<void>} initializeTransactionsPool - The async function from the store that starts the tracking process for pending transactions.\n * @param {(error: Error) => void} errorHandler - A callback function to handle any errors that occur during initialization.\n * @returns {Promise<void>}\n */\nconst loadTransactions = async (\n initializeTransactionsPool: () => Promise<void>,\n errorHandler: (error: Error) => void,\n): Promise<void> => {\n try {\n await initializeTransactionsPool();\n } catch (error) {\n errorHandler(error as Error);\n }\n};\n\n/**\n * A React hook that triggers the initialization of the transaction pool when the component mounts.\n * This ensures that any pending transactions from a previous session are picked up and tracked again.\n *\n * @param {() => Promise<void>} initializeTransactionsPool - The `initializeTransactionsPool` function from the Zustand store.\n * @param {(error: Error) => void} [customErrorHandler] - An optional custom function to handle errors during initialization. Defaults to console.error.\n */\nexport const useInitializeTransactionsPool = (\n initializeTransactionsPool: () => Promise<void>,\n customErrorHandler?: (error: Error) => void,\n) => {\n const handleError = (error: Error) => {\n if (customErrorHandler) {\n customErrorHandler(error);\n } else {\n console.error('Failed to initialize transactions pool:', error);\n }\n };\n\n useEffect(() => {\n // The dependency array ensures this effect runs only when the function reference changes,\n // which should typically be only on the initial render.\n loadTransactions(initializeTransactionsPool, handleError);\n }, [initializeTransactionsPool, customErrorHandler]);\n};\n"]}
1
+ {"version":3,"sources":["../src/hooks/useInitializeTransactionsPool.tsx"],"names":["useInitializeTransactionsPool","initializeTransactionsPool","onError","useEffect","error","e"],"mappings":"4CAmCaA,CAAAA,CAAgC,CAAC,CAC5C,0BAAA,CAAAC,CAAAA,CACA,QAAAC,CACF,CAAA,GAGM,CACJC,eAAAA,CAAU,IAAM,EACe,SAAY,CACvC,GAAI,CACF,MAAMF,IACR,CAAA,MAASG,EAAO,CAAA,CACOF,CAAAA,GAAaG,GAAa,OAAA,CAAQ,KAAA,CAAM,0CAA2CA,CAAC,CAAA,CAAA,EAC5FD,CAAc,EAC7B,CACF,KAOF,CAAA,CAAG,CAACH,CAAAA,CAA4BC,CAAO,CAAC,EAC1C","file":"index.js","sourcesContent":["/**\n * @file This file defines a React hook for initializing the transaction pool.\n * This hook is crucial for resuming the tracking of pending transactions after a page reload.\n */\n\nimport { useEffect } from 'react';\n\n/**\n * A React hook that triggers the initialization of the transaction pool when the component mounts.\n *\n * This should be used once in your application's layout or root component. It ensures that any\n * pending transactions from a previous session (stored in `localStorage`) are picked up and\n\n * their trackers are re-activated.\n *\n * @param {object} params - The parameters for the hook.\n * @param {() => Promise<void>} params.initializeTransactionsPool - The `initializeTransactionsPool` function from your Pulsar store instance.\n * @param {(error: Error) => void} [params.onError] - An optional custom function to handle any errors that occur during initialization. Defaults to `console.error`.\n *\n * @example\n * ```tsx\n * import { useInitializeTransactionsPool } from '@tuwaio/pulsar-react';\n * import { pulsarStore } from './path/to/your/store';\n *\n * function AppLayout({ children }) {\n * // This hook will run once when the layout mounts.\n * useInitializeTransactionsPool({\n * initializeTransactionsPool: pulsarStore.getState().initializeTransactionsPool,\n * onError: (err) => console.warn('Failed to re-initialize trackers:', err),\n * });\n *\n * return <div>{children}</div>;\n * }\n * ```\n */\nexport const useInitializeTransactionsPool = ({\n initializeTransactionsPool,\n onError,\n}: {\n initializeTransactionsPool: () => Promise<void>;\n onError?: (error: Error) => void;\n}) => {\n useEffect(() => {\n const reinitializeTrackers = async () => {\n try {\n await initializeTransactionsPool();\n } catch (error) {\n const errorHandler = onError ?? ((e: Error) => console.error('Failed to initialize transactions pool:', e));\n errorHandler(error as Error);\n }\n };\n\n // Run the initialization process.\n reinitializeTrackers();\n\n // The dependency array is empty to ensure this effect runs only once on mount.\n // The functions from a vanilla Zustand store are stable and do not need to be in the array.\n }, [initializeTransactionsPool, onError]);\n};\n"]}
package/dist/index.mjs CHANGED
@@ -1,2 +1,2 @@
1
- import {useEffect}from'react';var t=async(r,o)=>{try{await r();}catch(i){o(i);}},n=(r,o)=>{let i=e=>{o?o(e):console.error("Failed to initialize transactions pool:",e);};useEffect(()=>{t(r,i);},[r,o]);};export{n as useInitializeTransactionsPool};//# sourceMappingURL=index.mjs.map
1
+ import {useEffect}from'react';var c=({initializeTransactionsPool:r,onError:o})=>{useEffect(()=>{(async()=>{try{await r();}catch(e){(o??(i=>console.error("Failed to initialize transactions pool:",i)))(e);}})();},[r,o]);};export{c as useInitializeTransactionsPool};//# sourceMappingURL=index.mjs.map
2
2
  //# sourceMappingURL=index.mjs.map
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/hooks/useInitializeTransactionsPool.tsx"],"names":["loadTransactions","initializeTransactionsPool","errorHandler","error","useInitializeTransactionsPool","customErrorHandler","handleError","useEffect"],"mappings":"8BAeA,IAAMA,CAAAA,CAAmB,MACvBC,CAAAA,CACAC,CAAAA,GACkB,CAClB,GAAI,CACF,MAAMD,IACR,CAAA,MAASE,CAAAA,CAAO,CACdD,CAAAA,CAAaC,CAAc,EAC7B,CACF,CAAA,CASaC,CAAAA,CAAgC,CAC3CH,CAAAA,CACAI,CAAAA,GACG,CACH,IAAMC,CAAAA,CAAeH,CAAAA,EAAiB,CAChCE,CAAAA,CACFA,CAAAA,CAAmBF,CAAK,CAAA,CAExB,OAAA,CAAQ,KAAA,CAAM,yCAAA,CAA2CA,CAAK,EAElE,EAEAI,SAAAA,CAAU,IAAM,CAGdP,CAAAA,CAAiBC,CAAAA,CAA4BK,CAAW,EAC1D,CAAA,CAAG,CAACL,CAAAA,CAA4BI,CAAkB,CAAC,EACrD","file":"index.mjs","sourcesContent":["/**\n * @file This file defines a React hook for initializing the transaction pool.\n * This hook is crucial for resuming the tracking of pending transactions after a page reload.\n */\n\nimport { useEffect } from 'react';\n\n/**\n * An internal helper function to safely execute the initialization process.\n * It wraps the call in a try-catch block to handle any potential errors.\n *\n * @param {() => Promise<void>} initializeTransactionsPool - The async function from the store that starts the tracking process for pending transactions.\n * @param {(error: Error) => void} errorHandler - A callback function to handle any errors that occur during initialization.\n * @returns {Promise<void>}\n */\nconst loadTransactions = async (\n initializeTransactionsPool: () => Promise<void>,\n errorHandler: (error: Error) => void,\n): Promise<void> => {\n try {\n await initializeTransactionsPool();\n } catch (error) {\n errorHandler(error as Error);\n }\n};\n\n/**\n * A React hook that triggers the initialization of the transaction pool when the component mounts.\n * This ensures that any pending transactions from a previous session are picked up and tracked again.\n *\n * @param {() => Promise<void>} initializeTransactionsPool - The `initializeTransactionsPool` function from the Zustand store.\n * @param {(error: Error) => void} [customErrorHandler] - An optional custom function to handle errors during initialization. Defaults to console.error.\n */\nexport const useInitializeTransactionsPool = (\n initializeTransactionsPool: () => Promise<void>,\n customErrorHandler?: (error: Error) => void,\n) => {\n const handleError = (error: Error) => {\n if (customErrorHandler) {\n customErrorHandler(error);\n } else {\n console.error('Failed to initialize transactions pool:', error);\n }\n };\n\n useEffect(() => {\n // The dependency array ensures this effect runs only when the function reference changes,\n // which should typically be only on the initial render.\n loadTransactions(initializeTransactionsPool, handleError);\n }, [initializeTransactionsPool, customErrorHandler]);\n};\n"]}
1
+ {"version":3,"sources":["../src/hooks/useInitializeTransactionsPool.tsx"],"names":["useInitializeTransactionsPool","initializeTransactionsPool","onError","useEffect","error","e"],"mappings":"kCAmCaA,CAAAA,CAAgC,CAAC,CAC5C,0BAAA,CAAAC,CAAAA,CACA,QAAAC,CACF,CAAA,GAGM,CACJC,SAAAA,CAAU,IAAM,EACe,SAAY,CACvC,GAAI,CACF,MAAMF,IACR,CAAA,MAASG,EAAO,CAAA,CACOF,CAAAA,GAAaG,GAAa,OAAA,CAAQ,KAAA,CAAM,0CAA2CA,CAAC,CAAA,CAAA,EAC5FD,CAAc,EAC7B,CACF,KAOF,CAAA,CAAG,CAACH,CAAAA,CAA4BC,CAAO,CAAC,EAC1C","file":"index.mjs","sourcesContent":["/**\n * @file This file defines a React hook for initializing the transaction pool.\n * This hook is crucial for resuming the tracking of pending transactions after a page reload.\n */\n\nimport { useEffect } from 'react';\n\n/**\n * A React hook that triggers the initialization of the transaction pool when the component mounts.\n *\n * This should be used once in your application's layout or root component. It ensures that any\n * pending transactions from a previous session (stored in `localStorage`) are picked up and\n\n * their trackers are re-activated.\n *\n * @param {object} params - The parameters for the hook.\n * @param {() => Promise<void>} params.initializeTransactionsPool - The `initializeTransactionsPool` function from your Pulsar store instance.\n * @param {(error: Error) => void} [params.onError] - An optional custom function to handle any errors that occur during initialization. Defaults to `console.error`.\n *\n * @example\n * ```tsx\n * import { useInitializeTransactionsPool } from '@tuwaio/pulsar-react';\n * import { pulsarStore } from './path/to/your/store';\n *\n * function AppLayout({ children }) {\n * // This hook will run once when the layout mounts.\n * useInitializeTransactionsPool({\n * initializeTransactionsPool: pulsarStore.getState().initializeTransactionsPool,\n * onError: (err) => console.warn('Failed to re-initialize trackers:', err),\n * });\n *\n * return <div>{children}</div>;\n * }\n * ```\n */\nexport const useInitializeTransactionsPool = ({\n initializeTransactionsPool,\n onError,\n}: {\n initializeTransactionsPool: () => Promise<void>;\n onError?: (error: Error) => void;\n}) => {\n useEffect(() => {\n const reinitializeTrackers = async () => {\n try {\n await initializeTransactionsPool();\n } catch (error) {\n const errorHandler = onError ?? ((e: Error) => console.error('Failed to initialize transactions pool:', e));\n errorHandler(error as Error);\n }\n };\n\n // Run the initialization process.\n reinitializeTrackers();\n\n // The dependency array is empty to ensure this effect runs only once on mount.\n // The functions from a vanilla Zustand store are stable and do not need to be in the array.\n }, [initializeTransactionsPool, onError]);\n};\n"]}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@tuwaio/pulsar-react",
3
- "version": "0.0.3",
3
+ "version": "0.0.4",
4
4
  "private": false,
5
5
  "author": "Oleksandr Tkach",
6
6
  "license": "Apache-2.0",
@@ -41,7 +41,7 @@
41
41
  "react": ">=19"
42
42
  },
43
43
  "devDependencies": {
44
- "@types/react": "^19.1.10",
44
+ "@types/react": "^19.1.12",
45
45
  "react": "^19.1.1",
46
46
  "tsup": "^8.5.0",
47
47
  "typescript": "^5.9.2"