How to merge object methods by composing them?

[batusai513]

Hi, first of all, thanks for your hard work with this library and the readme for it.
I want to merge two objects that have methods on them, when working with lodash mergeWith function I compared the two values and returned a new function like this:

function inspectionFormMergeCustomizer(objValue, srcValue, key) {
  if (
    typeof objValue === 'function' &&
    typeof srcValue === 'function'
  ) {
    return (transformed, ...args) => {
      return objValue(srcValue(transformed, ...args), ...args);
    };
  }
}

the problem with lodash mergeWith is that I lost all type information.

I was looking at this library and it seems it is possible to do that, but my TS skill is still very low and cannot think on how to do it, Is it possible to do something similar and still infer the types from the resulting composed function?

Thanks in advance for any help.

[RebeccaStevens]

Here's how you would customize deepmerge-ts to compose the functions:

import { deepmergeCustom } from "deepmerge-ts";

export const myDeepmerge = deepmergeCustom({
  mergeOthers: (values, utils) => {
    if (areAllFunctions(values)) {
      return composeFunctions(values);
    }
    return utils.defaultMergeFunctions.mergeOthers(values, utils);
  },
});

function areAllFunctions(
  values: readonly unknown[]
): values is ReadonlyArray<(...args: unknown[]) => unknown> {
  return values.every((value) => typeof value === "function");
}

function composeFunctions(fns: ReadonlyArray<(...args: unknown[]) => unknown>) {
  return (param: unknown) =>
    fns.reduceRight((accumulator, fn) => fn(accumulator), param);
}

However this won't necessarily have the right type information for the composed function.
As long as the functions that are composed together don't require generic information, then the composed function's typing can be inferred.

Could you give me an example of a function you'd like to compose? Then I can adjust the code above to give the right type info.

[batusai513]

Thanks for the tip.

Here is an excerpt of the object signature method i want to "compose":

type CreateCustomValidator = (params: {
  validators: Partial<FieldsValidatorsObject>;
  formNames: FormNames;
  errorMessages: CarleadCreationErrorMessages;
  locale: AppLocales;
}) => Partial<FieldsValidatorsObject>;

type params = {
  createSteps: (formNames: FormNames) => TupleOfSteps[];
  createCustomValidator?: CreateCustomValidator;
}

and this is the complete mergeCustomizer I am using with lodash mergeWith:

function inspectionFormMergeCustomizer(objValue, srcValue, key) {
  // depending on the key, I know that this method accepts the previous
  // validators as params to the new validator function.
  // not exactly a compose fn which accepts the previous return as param
  if (
    key === 'createCustomValidator' &&
    typeof objValue === 'function' &&
    typeof srcValue === 'function'
  ) {
    return ({ validators, ...args }) => {
      return objValue({
        validators: srcValue({ validators, ...args }),
        ...args,
      });
    };
  }
  // merge does not concat arrays by default
  if (
    key === 'payloadMappers' &&
    Array.isArray(objValue) &&
    Array.isArray(srcValue)
  ) {
    return objValue.concat(srcValue);
  }
}

depending on the key I knew what the method accepts as parameter (each method accept different parameters) and built a custom compose fn that evaluated the previous and sent the returned value as part of the new fn arguments.

[RebeccaStevens]

import { deepmergeCustom, type DeepMergeOptions } from "deepmerge-ts";

import type { CreateCustomValidator } from "./path/to/this/type";

const inspectionFormMergeCustomizer: DeepMergeOptions["mergeRecords"] = (
  values,
  utils
) => {
  const defaultMerge = utils.defaultMergeFunctions.mergeRecords(values, utils);
  const customValidators = values
    .filter((value) => value.createCustomValidator !== undefined)
    .map((value) => value.createCustomValidator);

  if (
    customValidators.length <= 1 ||
    !areAllFunctions<CreateCustomValidator>(customValidators)
  ) {
    return defaultMerge;
  }

  return {
    ...defaultMerge,
    createCustomValidator: composeCreateCustomValidator(customValidators),
  };
};

export const myDeepmerge = deepmergeCustom({
  mergeRecords: inspectionFormMergeCustomizer,
});

function areAllFunctions<T extends (...args: any[]) => unknown>(
  values: readonly unknown[]
): values is ReadonlyArray<T> {
  return values.every((value) => typeof value === "function");
}

function composeCreateCustomValidator(
  fns: ReadonlyArray<CreateCustomValidator>
) {
  return ({ validators, ...args }: Parameters<CreateCustomValidator>[0]) =>
    fns.reduceRight(
      (validators, fn) => fn({ validators, ...args }),
      validators
    );
}

In order to only compose functions with the key "createCustomValidator", we need to detect this one level up inside the merge records function (rather than the merge others function).

Note: I'm working on a new feature to get access to meta data such as a property's key more easily, but it isn't yet available.

The typings should be correct without needing to write any fancy typings.

[batusai513]

@RebeccaStevens Thanks a lot for your detailed answer I was able to understand a bit more how the library works and solved my use case, please let me know how I can help to make this library better 🙇🏻.