Amount Activity

The AmountActivity requests a numeric input, such as an amount to be paid, a quantity, or any numeric value required by the workflow.

Inputs

The AmountActivity expects the following properties:

• Title (string): A heading to indicate the purpose of the numeric input (e.g., "Enter Amount").
• Description (string): Additional instructions for the user (e.g., "Please enter the amount you want to deposit.").
• Placeholder (string): A hint for the numeric input field (e.g., "e.g., 100").
• ButtonCancelText (string): Text displayed on the cancel button (e.g., "Cancel").
• ButtonOKText (string): Text displayed on the confirmation button (e.g., "Submit").

Example Code

amountActivity: async (data: AmountActivityOptions) => {
  console.log("AmountActivity from agent:", data);
  await delay(300);

  return new Promise<{ action: WorkflowActivityUserAction; result: string }>((resolve) => {
    RootNavigation.navigate("WorkflowActivityScreen", {
      type: "amount",
      data,
      onConfirm: (result: string) => {
        console.log("AmountActivity result:", result);
        resolve({
          action: WorkflowActivityUserAction.OK,
          result,
        });
      },
      onReject: () => {
        console.log("AmountActivity result:", "Rejected");
        resolve({
          action: WorkflowActivityUserAction.Cancel,
          result: "",
        });
      },
    });
  });
};

Handling and Layout

When the user navigates to the WorkflowActivityScreen for an Amount Activity, the layout includes:

1. Title: Displays a heading to indicate the purpose of the numeric input (e.g., "Enter Amount").

2. Description: Provides instructions to guide the user on what amount to enter.

3. Amount Input:

   • A text input specifically designed to accept a numeric value. It should have a placeholder that indicates the expected value (e.g., "Enter amount").

4. Action Buttons:

   • Cancel Button: Allows the user to cancel their input, returning a Cancel action.
   • Confirm Button: Submits the user’s input, returning an OK action with the entered amount.

Output

The output for an Amount Activity depends on the user's interaction:

• If the user confirms, the resolved result will look like this:

{
  action: WorkflowActivityUserAction.OK,
  result: "100" // Example amount input by the user
}

• If the user cancels, the resolved result will look like this:

{
  action: WorkflowActivityUserAction.Cancel,
  result: ""
}

Example Layout Code for User Input

case "amount":
  return (
    <View style={styles.contentContainer}>
      <Text style={styles.subheading}>{toTitleCase(data.title)}</Text>
      <Text style={styles.modalText}>{data.description}</Text>
      <TextInput
        placeholder={data.placeholder}
        keyboardType="numeric"
        value={result}
        onChangeText={setResult}
        style={styles.textInput}
      />
      {errors.amount && <Text style={styles.errorText}>{errors.amount}</Text>}
      <View style={styles.actionButtonsContainer}>
        <TouchableOpacity onPress={handleCancel} style={styles.button}>
          <Text style={styles.actionButtonText}>{data.buttonCancelText}</Text>
        </TouchableOpacity>
        <TouchableOpacity onPress={handleConfirm} style={styles.button}>
          <Text style={styles.actionButtonText}>{data.buttonOKText}</Text>
        </TouchableOpacity>
      </View>
    </View>
  );