sometimes you have to deal with multiple React.Refs. This is short helper

combineRef.ts

export const combineRef = <T>(...refs: (React.Ref<T> | string | void)[]) => {
  // basically, JSX elements allows string refs for backward-compatiblity
  // there's certain case runtime check needed
  if (process.env.NODE_ENV !== "production" && refs.some((x) => typeof x === "string")) {
    throw new Error("string refs are forbbiden");
  }
  return (node: T | null | undefined) => {
    for (const ref of refs) {
      if (!ref || typeof ref === "string") {
        continue;
      }
      setRef(ref, node);
    }
  };
};

const setRef = <T>(ref: React.Ref<T>, node: T) => {
  if (typeof ref === "function") {
    ref(node);
  } else if (ref) {
    (ref as any).current = node;
  }
};