> ## Documentation Index
> Fetch the complete documentation index at: https://developer.dromo.io/llms.txt
> Use this file to discover all available pages before exploring further.

# Concatenating and Splitting Fields via addField

This guide demonstrates how to use step hooks to add or remove fields midway through an import.

<Info>
  For more information on the `instance.addField` method, see the [Reference](/reference/hooks#instanceaddfield) documentation. For more information on the `instance.removeField` method, see the [Reference](/reference/hooks#instanceremovefield) documentation.
</Info>

<CodeGroup>
  ```javascript JavaScript theme={null}
  dromo.registerStepHook("REVIEW_STEP", function (instance, data) {
    instance.addField({
      label: "Full Name",
      key: "fullName",
    });
  });

  dromo.registerStepHook("REVIEW_STEP_POST_HOOKS", function (instance, data) {
    instance.removeField("firstName");
    instance.removeField("lastName");
  });

  dromo.registerRowHook(function (data, mode) {
    let out: IRowHookOutput = { row: {} };
    if (data.row.firstName && data.row.lastName && mode === "init") {
      out.row = {};
      out.row.fullName = {
        value: data.row.firstName.value + " " + data.row.lastName.value,
        info: [
          {
            message: "combined first and last name into full name",
            level: "info",
          },
        ],
      };
    }
    return out;
  });
  ```

  ```jsx React theme={null}
  <DromoUploader
    licenseKey="FRONTEND_API_KEY"
    ...
    stepHooks={[
      {
        type: "REVIEW_STEP",
        callback: (instance, _data) => {
          instance.addField({
            label: "Full Name",
            key: "fullName",
          })
        }
      },
      {
        type: "REVIEW_STEP_POST_HOOKS",
        callback: (instance, _data) => {
          instance.removeField("firstName");
          instance.removeField("lastName");
        }
      }
    ]}
    rowHooks={[
      (data: IRowHookInput, mode: string) => {
        let out: IRowHookOutput = { row: {} };
        if (data.row.firstName && data.row.lastName && mode === 'init') {
          out.row = {};
          out.row.fullName = {
            value: data.row.firstName.value + " " + data.row.lastName.value,
            info: [
              {
                message: "combined first and last name into full name",
                level: "info"
              }
            ]
          }
        }
        return out
      }
    ]}>
    Launch Dromo
  </DromoUploader>
  ```
</CodeGroup>