@atlaskit/editor-nodeview-data-provider/dist/es2019/hooks.js

NodeView data provider for @atlaskit/editor-core plugins

export function useNodeViewDataProvider() {
  // Implementation pending
}
import { useEffect, useMemo, useState } from 'react';

// re exported to avoid type issues
// this type is only used in jsdoc comments in this file.

/**
 * Access the value via {@link NodeViewDataProvider} when cached.
 *
 * It will return the value of the provider if it is already available.
 *
 * For more information on building caches, see {@link buildCaches}.
 *
 * @example
 * ```ts
 * await buildCaches({ adf, oneTickProviders: [emojiNodeViewDataProvider] });
 * const value = useNodeViewDataProviderValue({ provider: emojiNodeViewDataProvider, node });
 * if (value) {
 *  return <SinglePassRenderEmoji emoji={value} />;
 * }
 * return <LegacyMultiPassRenderEmoji node={node} />;
 * ```
 */
export function useNodeViewDataProviderValue(options) {
  const providerValue = useMemo(() => options.provider.cache[options.provider.nodeToKey(options.node)], [options.provider, options.node]);
  return providerValue;
}

// The following hooks are not expected to be used with the initial experimentation of the NodeViewDataProvider
// and are not covered in the initial tests.
// They are provided as a reference

/**
 *
 *
 * This hook is intended to simplify accessing data via the one tick providers.
 *
 * ```ts
 * const value = useNodeViewDataProviderGet(emojiProvider, emojiNode);
 *
 * if (value.state === 'loading') {
 *   return <Loading />;
 * }
 * if (value.state === 'failed') {
 *  return <Fallback />;
 * }
 * return <Emoji properties=(value.result) />
 * ```
 */
export function useNodeViewDataProviderGet(options) {
  const getResult = useMemo(() => options.provider.get(options.node), [options.provider, options.node]);
  let [resolved, setResolved] = useState(getResult !== undefined && !isPromise(getResult) ? getResult : undefined);
  useEffect(() => {
    if (!isPromise(getResult)) {
      return;
    }
    let cancelled = false;
    (async function () {
      try {
        let resolved = await getResult;
        if (!cancelled) {
          setResolved(resolved);
        }
      } catch {
        setResolved('error');
      }
    })();
    return () => {
      cancelled = true;
    };
  }, [getResult]);
  if (resolved === undefined) {
    return {
      state: 'loading',
      result: undefined
    };
  }
  if (resolved === 'error') {
    return {
      state: 'failed',
      result: undefined
    };
  }
  return {
    state: 'resolved',
    result: resolved
  };
}
function isPromise(obj) {
  return !!obj && (typeof obj === 'object' || typeof obj === 'function') &&
  // @ts-ignore
  typeof obj.then === 'function';
}