
Security News
Attackers Are Hunting High-Impact Node.js Maintainers in a Coordinated Social Engineering Campaign
Multiple high-impact npm maintainers confirm they have been targeted in the same social engineering campaign that compromised Axios.
@prequel/react
Advanced tools
Collection of React hooks for building your self-service data warehouse syncing feature in your webapp. See our documentation for usage and examples.
const useCreateDestination: (fetchToken: FetchAuthTokenWithPreparedDestination, origin: string, host?: string) => (destination: PreparedDestination) => Promise<CreateOrUpdateDestinationAPIResponse>;
Custom hook to create a new destination.
This hook returns an asynchronous function that creates a new destination using the provided token, origin, and an optional host. It utilizes a token fetched from a prepared destination.
| Parameter | Type | Description |
|---|---|---|
fetchToken | FetchAuthTokenWithPreparedDestination | A function to fetch the authentication token using a prepared destination. |
origin | string | The origin from where the request is made. |
host? | string | Optional host to which the request is made. Defaults to PREQUEL_US if not provided. |
A function that takes a prepared destination and returns a promise resolving to an API response containing the result of the destination creation.
The returned function accepts the following parameter:
destination: A PreparedDestination to create.(destination: PreparedDestination): Promise<CreateOrUpdateDestinationAPIResponse>;
| Parameter | Type |
|---|---|
destination | PreparedDestination |
Promise<CreateOrUpdateDestinationAPIResponse>
import { useCreateDestination, prepareDestinationWithForm } from "@prequel/react";
const createDestination = useCreateDestination(
fetchToken,
"app.example.co",
PREQUEL_HOST
);
// prepareDestinationWithForm usage elided...
async function onFormSubmit() {
const response = await createDestination(preparedDestination);
if (response.status === "success") {
// handle creation success
} else {
// handle creation failure
}
}
const useDeleteDestination: (fetchToken: FetchAuthTokenWithExistingDestination, origin: string, host?: string) => (destination: ExistingDestination) => Promise<DeleteDestinationAPIResponse>;
Custom hook to delete an existing destination.
This hook returns an asynchronous function that deletes an existing destination using the provided token, origin, and an optional host. It utilizes a token fetched from an existing destination.
| Parameter | Type | Description |
|---|---|---|
fetchToken | FetchAuthTokenWithExistingDestination | A function to fetch the authentication token using an existing destination. |
origin | string | The origin from where the request is made. |
host? | string | Optional host to which the request is made. Defaults to PREQUEL_US if not provided. |
A function that takes an existing destination and returns a promise resolving to an API response containing the result of the destination deletion.
The returned function has the following parameter:
destination: An ExistingDestination to delete.(destination: ExistingDestination): Promise<DeleteDestinationAPIResponse>;
| Parameter | Type |
|---|---|
destination | ExistingDestination |
Promise<DeleteDestinationAPIResponse>
import { useDeleteDestination } from "@prequel/react";
const deleteDestination = useDeleteDestination(
fetchToken,
"app.example.co",
PREQUEL_HOST
);
async function onSubmitDelete() {
const response = await deleteDestination(existingDestination);
if (response.status === "success") {
// handle update success
} else {
// handle update failure
}
}
const useDestination: (initialState?: Partial<Destination>) => [Destination, React.Dispatch<React.SetStateAction<Partial<Destination>>>];
Custom hook to manage the state of a destination.
This hook initializes the destination state with a default or provided initial state, and returns the current destination state along with a function to update it partially.
| Parameter | Type | Description |
|---|---|---|
initialState? | Partial<Destination> | Optional initial state to override the default destination state. |
[Destination, React.Dispatch<React.SetStateAction<Partial<Destination>>>]
An array containing the current destination state and a function to update the state partially.
import { useDestination } from "@prequel/react";
const [destination, setDestination] = useDestination({ name: "Example Destination" });
console.log("Destination Name:", destination.name); // "Example Destination"
setDestination((currentDestination) => ({ ...currentDestination, name: "Updated Destination Name" }));
console.log("Destination Name:", destination.name); // "Updated Destination Name"
const useDestinationForm: (destination: Destination, orgId: string, options?: UseDestinationFormOptions) => Form;
Custom hook to manage the state and behavior of a destination form.
This hook creates a form state for a given destination and organization ID, with optional settings to include internal fields, specify a host, and provide a vendor query.
| Parameter | Type | Description |
|---|---|---|
destination | Destination | The destination for which the form is created. |
orgId | string | The organization ID associated with the form. |
options? | UseDestinationFormOptions | Optional settings for the form behavior. |
Form
import { useDestination, useDestinationForm } from "@prequel/react";
const [destination, setDestination] = useDestination();
const destinationForm = useDestinationForm(
destination,
"your-prequel-org-uuid",
);
return (
<div>
{destinationForm.map((section) => (
// Render the section...
{section.fields((field) => (
// Render the field...
)}
))}
</div>
);
const useDestinationVendors: (host?: string) => any[];
| Parameter | Type |
|---|---|
host? | string |
any[]
const useGetDestinations: (fetchToken: FetchAuthToken, origin: string, host?: string) => () => Promise<GetDestinationsResponse>;
Custom hook to fetch a list of destinations.
This hook returns an asynchronous function that retrieves a list of destinations using the provided token, origin, and an optional host.
| Parameter | Type | Description |
|---|---|---|
fetchToken | FetchAuthToken | A function to fetch the authentication token. |
origin | string | The origin from where the request is made. |
host? | string | Optional host to which the request is made. If not provided, a default host will be used. |
A function that fetches and returns a promise resolving to the response containing the list of destinations.
The returned function does not take any parameters.
(): Promise<GetDestinationsResponse>;
Promise<GetDestinationsResponse>
This hook is deprecated and will be removed in a future version.
Please use useListDestinations instead for paginated destination retrieval.
import { useGetDestinations } from "@prequel/react";
const getDestinations = useGetDestinations(
fetchToken,
"app.example.co",
PREQUEL_HOST
);
const destinations = getDestinations();
const useGetModelsForRecipient: (fetchToken: FetchAuthToken, origin: string, host?: string) => () => Promise<any[]>;
Custom hook to fetch the models available for a particular recipient.
This hook returns an asynchronous function that retrieves a list of models using the provided token, origin, and an optional host. The models are scoped to the Recipient ID that was declared when creating the token.
| Parameter | Type | Description |
|---|---|---|
fetchToken | FetchAuthToken | A function to fetch the authentication token. |
origin | string | The origin from where the request is made. |
host? | string | Optional host to which the request is made. If not provided, a default host will be used. |
A function that fetches and returns a promise resolving to the response containing the list of models.
The returned function does not take any parameters.
(): Promise<any[]>;
Promise<any[]>
import { useGetModelsForRecipient } from "@prequel/react";
const getModels = useGetModelsForRecipient(
fetchToken,
"app.example.co",
PREQUEL_HOST
);
const models = getModels();
const useGetTransfers: (fetchToken: FetchAuthTokenWithExistingDestination, origin: string, host?: string) => (destination: ExistingDestination, params?: GetTransfersParams) => Promise<GetTransfersResponse>;
Custom hook to fetch a list of transfers for a given destination.
| Parameter | Type | Description |
|---|---|---|
fetchToken | FetchAuthTokenWithExistingDestination | A function to fetch the authentication token using an existing destination. |
origin | string | The origin from where the request is made. |
host? | string | Optional host to which the request is made. If not provided, a default host will be used. |
A function that fetches and returns a promise resolving to the response containing the list of transfers.
The returned function has the following parameters:
destination: The existing destination for which transfers are fetched.params: Optional parameters to filter the transfers.(destination: ExistingDestination, params?: GetTransfersParams): Promise<GetTransfersResponse>;
| Parameter | Type |
|---|---|
destination | ExistingDestination |
params? | GetTransfersParams |
Promise<GetTransfersResponse>
This hook is deprecated and will be removed in a future version.
Please use useListTransfers instead for paginated transfer retrieval.
This hook returns an asynchronous function that retrieves a list of transfers using the provided token, origin, destination, and optional host and parameters.
import { useGetTransfers, TransferStatus } from "@prequel/react";
// destination fetching elided...
const getTransfers = useGetTransfers(
fetchToken,
"app.example.co",
PREQUEL_HOST
);
// Get all transfers for destination
const allTransfers = getTransfers(destination);
// Get transfers for destination with limit
const someTransfers = getTransfers(destination, { count: 5 });
// Get all transfers for destination with success status
const successfulTransfers = getTransfers(destination, { status: TransferStatus.SUCCESS });
const useListDestinations: (fetchToken: FetchAuthToken, origin: string, host?: string) => (p?: ListResourceParameters) => Promise<ListResponse<ExistingDestination>>;
Custom hook to fetch a paginated list of destinations.
This hook returns an asynchronous function with optional pagination parameters that fetches a list of destinations alongside pagination metadata using the provided token, origin, and an optional host.
| Parameter | Type | Description |
|---|---|---|
fetchToken | FetchAuthToken | A function that retrieves an authorization token to access the API. |
origin | string | The origin from where the request is made. |
host? | string | Optional host to which the request is made. If not provided, a default host will be used. |
A function that accepts pagination parameters and returns a promise
resolving to a ListResponse object containing:
- results: The list of destinations.
- hasNext: Boolean indicating if more pages are available.
- cursor: A cursor to fetch the next page, if applicable.
The returned function accepts the following optional parameters:
pageSize: The number of destinations to fetch per page.cursor: A pagination cursor to specify the starting point for fetching. Initial requests should not include a
cursor. Response objects include a cursor to pass for the next page.(p?: ListResourceParameters): Promise<ListResponse<ExistingDestination>>;
| Parameter | Type |
|---|---|
p? | ListResourceParameters |
Promise<ListResponse<ExistingDestination>>
import { useListDestinations } from "@prequel/react";
const listDestinations = useListDestinations(
fetchToken,
"app.example.co",
PREQUEL_HOST
);
const result = await listDestinations({ pageSize: 10 });
console.log(result.results); // Array of destinations
console.log(result.hasNext); // true if more pages available
console.log(result.cursor); // Cursor for next page
const useListModels: (fetchToken: FetchAuthToken, origin: string, host?: string) => (p?: ListResourceParameters) => Promise<ListResponse<ModelConfig>>;
Custom hook to fetch a paginated list of models.
This hook returns an asynchronous function with optional pagination parameters that fetches a list of models alongside pagination metadata using the provided token, origin, and an optional host.
| Parameter | Type | Description |
|---|---|---|
fetchToken | FetchAuthToken | A function that retrieves an authorization token to access the API. |
origin | string | The origin from where the request is made. |
host? | string | Optional host to which the request is made. If not provided, a default host will be used. |
A function that accepts pagination parameters and returns a promise
resolving to a ListResponse object containing:
- results: The list of models.
- hasNext: Boolean indicating if more pages are available.
- cursor: A cursor to fetch the next page, if applicable.
The returned function accepts the following optional parameters:
pageSize: The number of models to fetch per page.cursor: A pagination cursor to specify the starting point for fetching. Initial requests should not include a
cursor. Response objects include a cursor to pass for the next page.(p?: ListResourceParameters): Promise<ListResponse<ModelConfig>>;
| Parameter | Type |
|---|---|
p? | ListResourceParameters |
Promise<ListResponse<ModelConfig>>
const useListProducts: (fetchToken: FetchAuthToken, origin: string, host?: string) => (p?: ListResourceParameters) => Promise<ListResponse<ProductConfig>>;
Custom hook to fetch a paginated list of products.
This hook returns an asynchronous function with optional pagination parameters that fetches a list of products alongside pagination metadata using the provided token, origin, and an optional host.
| Parameter | Type | Description |
|---|---|---|
fetchToken | FetchAuthToken | A function that retrieves an authorization token to access the API. |
origin | string | The origin from where the request is made. |
host? | string | Optional host to which the request is made. If not provided, a default host will be used. |
A function that accepts pagination parameters and returns a promise
resolving to a ListResponse object containing:
- results: The list of products.
- hasNext: Boolean indicating if more pages are available.
- cursor: A cursor to fetch the next page, if applicable.
The returned function accepts the following optional parameters:
pageSize: The number of products to fetch per page.cursor: A pagination cursor to specify the starting point for fetching. Initial requests should not include a
cursor. Response objects include a cursor to pass for the next page.(p?: ListResourceParameters): Promise<ListResponse<ProductConfig>>;
| Parameter | Type |
|---|---|
p? | ListResourceParameters |
Promise<ListResponse<ProductConfig>>
const useListTransfers: (fetchToken: FetchAuthToken, origin: string, host?: string) => (d: ExistingDestination, p?: ListResourceParameters) => Promise<ListResponse<Transfer>>;
Custom hook to fetch a paginated list of transfers for a destination.
This hook returns an asynchronous function with optional pagination parameters that fetches a list of transfers for the given destination alongside pagination metadata using the provided token, origin, and an optional host.
| Parameter | Type | Description |
|---|---|---|
fetchToken | FetchAuthToken | A function that retrieves an authorization token to access the API. |
origin | string | The origin from where the request is made. |
host? | string | Optional host to which the request is made. If not provided, a default host will be used. |
A function that accepts an existing destination and pagination parameters and returns a promise
resolving to a ListTransfersResponse object containing:
- transfers: The list of transfers.
- hasNext: Boolean indicating if more pages are available.
- cursor: A cursor to fetch the next page, if applicable.
The returned function accepts the following optional parameters:
destination: The existing destination for which to fetch transfers.pageSize: The number of destinations to fetch per page.cursor: A pagination cursor to specify the starting point for fetching. Initial requests should not include a
cursor. Response objects include a cursor to pass for the next page.(d: ExistingDestination, p?: ListResourceParameters): Promise<ListResponse<Transfer>>;
| Parameter | Type |
|---|---|
d | ExistingDestination |
p? | ListResourceParameters |
Promise<ListResponse<Transfer>>
const useModels: (fetchToken: FetchAuthToken, origin: string, host?: string) => any[];
Custom hook to fetch a list of models.
| Parameter | Type | Description |
|---|---|---|
fetchToken | FetchAuthToken | A function to fetch the authentication token. |
origin | string | The origin from where the request is made. |
host? | string | Optional host to which the request is made. If not provided, a default host will be used. |
any[]
This hook is deprecated and will be removed in a future version.
Please use useListModels instead for paginated model retrieval.
This hook returns the response containing a list of models using the provided token, origin, and an optional host.
import { useModels } from "@prequel/react";
const models = useModels(
fetchToken,
"app.example.co",
PREQUEL_HOST
);
const useProducts: (fetchToken: FetchAuthToken, origin: string, host?: string) => any[];
Custom hook to fetch a list of products.
| Parameter | Type | Description |
|---|---|---|
fetchToken | FetchAuthToken | A function to fetch the authentication token. |
origin | string | The origin from where the request is made. |
host? | string | Optional host to which the request is made. If not provided, a default host will be used. |
any[]
This hook is deprecated and will be removed in a future version.
Please use useListProducts instead for paginated product retrieval.
This hook returns the response containing a list of products using the provided token, origin, and an optional host.
const useTestConnection: (fetchToken: FetchAuthTokenWithPreparedDestination, origin: string, host?: string) => (destination: PreparedDestination) => Promise<TestConnectionAPIResponse>;
Custom hook to test the connection to a prepared destination.
This hook returns an asynchronous function that tests the connection to a given prepared destination using the provided token, origin, and an optional host.
| Parameter | Type | Description |
|---|---|---|
fetchToken | FetchAuthTokenWithPreparedDestination | A function to fetch the authentication token using a prepared destination. |
origin | string | The origin from where the request is made. |
host? | string | Optional host to which the request is made. Defaults to PREQUEL_US if not provided. |
A function that takes a prepared destination and returns a promise resolving to an API response containing the result of the connection test.
The returned function has the following parameter:
destination: The prepared destination to be tested.(destination: PreparedDestination): Promise<TestConnectionAPIResponse>;
| Parameter | Type |
|---|---|
destination | PreparedDestination |
Promise<TestConnectionAPIResponse>
import { useTestConnection } from "@prequel/react";
const testConnection = useTestConnection(
fetchToken,
"app.example.co",
PREQUEL_HOST
);
async function testDestinationConnection() {
const { data, status, message } = await testConnection(preparedDestination);
if (response.status === "success") {
// handle test success
} else {
// handle test failure
}
}
const useTestExistingConnection: (fetchToken: FetchAuthTokenWithExistingDestination, origin: string, host?: string) => (destination: ExistingDestination, updated: PreparedDestination) => Promise<APIResponse<{
status: string;
}>>;
Custom hook to test the existing connection to a destination.
This hook returns an asynchronous function that tests the connection between a given existing destination and a prepared destination. It utilizes a token fetched from an existing destination.
| Parameter | Type | Description |
|---|---|---|
fetchToken | FetchAuthTokenWithExistingDestination | A function to fetch the authentication token using an existing destination. |
origin | string | The origin from where the request is made. |
host? | string | Optional host to which the request is made. If not provided, a default host will be used. |
A function that takes an existing destination and a prepared destination, and returns a promise resolving to an API response containing the connection status.
The returned function has the following parameters:
destination: The existing destination for which the connection is tested.changed: The prepared destination with any changes that need to be tested.(destination: ExistingDestination, updated: PreparedDestination): Promise<APIResponse<{
status: string;
}>>;
| Parameter | Type |
|---|---|
destination | ExistingDestination |
updated | PreparedDestination |
Promise<APIResponse<{
status: string;
}>>
const useUpdateDestination: (fetchToken: FetchAuthTokenWithExistingDestination, origin: string, host?: string) => (destination: ExistingDestination, updated: PreparedDestination) => Promise<CreateOrUpdateDestinationAPIResponse>;
Custom hook to update an existing destination.
This hook returns an asynchronous function that updates an existing destination with the provided changes using the given token, origin, and an optional host.
| Parameter | Type | Description |
|---|---|---|
fetchToken | FetchAuthTokenWithExistingDestination | A function to fetch the authentication token using an existing destination. |
origin | string | The origin from where the request is made. |
host? | string | Optional host to which the request is made. Defaults to PREQUEL_US if not provided. |
A function that takes an existing destination and a prepared destination with changes, and returns a promise resolving to an API response containing the result of the update.
The returned function has the following parameters:
destination: The existing destination to be updated.changed: The prepared destination with changes to apply to the existing destination.(destination: ExistingDestination, updated: PreparedDestination): Promise<CreateOrUpdateDestinationAPIResponse>;
| Parameter | Type |
|---|---|
destination | ExistingDestination |
updated | PreparedDestination |
Promise<CreateOrUpdateDestinationAPIResponse>
const { useUpdateDestination } from "@prequel/react";
const updateDestination = useUpdateDestination(
fetchToken,
"app.example.co",
PREQUEL_HOST
);
// destination edits and preparation elided...
async function onSubmitUpdate() {
const response = await updateDestination(existingDestination, editedPreparedDestination);
if (response.status === "success") {
// handle update success
} else {
// handle update failure
}
}
const prepareDestinationWithForm: (d: Destination, f: Form | undefined) => PreparedDestination;
Function to prepare a destination using the given destination data and form.
This function takes a destination and an optional form, and returns a prepared destination that includes the necessary updates and modifications from the form.
| Parameter | Type | Description |
|---|---|---|
d | Destination | The destination data to be prepared. |
f | Form | undefined | The optional form containing updates and modifications for the destination. |
PreparedDestination
const parseServiceAccountKey: (k?: string) => ServiceAccountKey | undefined;
Function to parse a service account key from a JSON string.
This function takes an optional JSON string representing a service account key and returns the parsed service account key object. If the input string is undefined or cannot be parsed, it returns undefined.
| Parameter | Type | Description |
|---|---|---|
k? | string | The optional JSON string representing the service account key. |
ServiceAccountKey | undefined
const prepareDestinationFromExisting: (e: ExistingDestination) => Destination;
Function to prepare a destination from an existing destination.
This function takes an existing destination and transforms it into a new destination object, ready for further processing or updates.
| Parameter | Type | Description |
|---|---|---|
e | ExistingDestination | The existing destination to be transformed. |
Destination
const computeChangedFields: (e: ExistingDestination, d: PreparedDestination) => Partial<PreparedDestination>;
Function to compute the changed fields between an existing destination and a prepared destination.
This function takes an existing destination, a prepared destination, and an optional partial prepared destination. It returns the fields that have changed between the existing and prepared destinations, optionally including additional changes.
| Parameter | Type | Description |
|---|---|---|
e | ExistingDestination | The existing destination to compare. |
d | PreparedDestination | The prepared destination with potential changes. |
Partial<PreparedDestination>
function parseGcpIamRoleMetadata(string?: string): GcpExternalAccountMetadata;
Function to parse GCP IAM role metadata from a JSON string.
This function takes an optional JSON string representing GCP IAM role metadata and returns the parsed metadata object. If the input string is undefined or cannot be parsed, it returns undefined.
| Parameter | Type | Description |
|---|---|---|
string? | string | The optional JSON string representing the GCP IAM role metadata. |
GcpExternalAccountMetadata
FAQs
React hooks and components for adding Prequel to your app.
The npm package @prequel/react receives a total of 11,532 weekly downloads. As such, @prequel/react popularity was classified as popular.
We found that @prequel/react demonstrated a healthy version release cadence and project activity because the last version was released less than a year ago. It has 5 open source maintainers collaborating on the project.
Did you know?

Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.

Security News
Multiple high-impact npm maintainers confirm they have been targeted in the same social engineering campaign that compromised Axios.

Security News
Axios compromise traced to social engineering, showing how attacks on maintainers can bypass controls and expose the broader software supply chain.

Security News
Node.js has paused its bug bounty program after funding ended, removing payouts for vulnerability reports but keeping its security process unchanged.