useFlowScripts

Hook for executing multiple Flow scripts simultaneously and retrieving their data.

Import

import { useFlowScripts } from '@doodlesteam/flooks';

Usage

const MyComponent = () => {
  const { data, isLoading, error } = useFlowScripts({
    scripts: [
      { code: 'flow-cadut-script-code-1', args: [/* script 1 arguments */] },
      { code: 'flow-cadut-script-code-2', args: [/* script 2 arguments */] }
    ],
    scopeKey: 'unique-scope-key',
  });
 
  if (isLoading) return <div>Loading...</div>;
  if (error) return <div>Error: {error.message}</div>;
 
  return <div>Scripts Results: {JSON.stringify(data)}</div>;
};

API Reference

Props

useFlowScripts accepts a useFlowScriptsProps object:

• scripts: useFlowScriptsInnerProps[] - An array of objects, each containing the code and optional args for each script.
• scopeKey: string (optional) - A unique key to scope the query results.
• select: (data: TQueryFnData) => TData (optional) - A function to transform or select a part of the returned data.
• autoCast: boolean (optional) - Automatically cast the results to the desired type.
• Additional properties from UseQueryOptions of @tanstack/react-query for more advanced query handling.

Example

const { data, error } = useFlowScripts({
  scripts: [
    { code: 'flow-cadut-script-code-1', args: [/* script 1 arguments */] },
    { code: 'flow-cadut-script-code-2', args: [/* script 2 arguments */] }
  ],
  scopeKey: 'unique-scope-key',
});

Return Value

The hook returns a UseQueryResult object, which includes:

• data: An array containing the results of each executed script.
• isLoading: A boolean indicating if the queries are in progress.
• error: An error object if any of the queries failed.