synapse-react-client/dist/components/widgets/ImageFileHandle.js

[](https://badge.fury.io/js/synapse-react-client) [](https://github.com/prettier/prettie

import { jsx as s } from "react/jsx-runtime";
import * as f from "../../synapse-client/SynapseClient.js";
import "@sage-bionetworks/synapse-client/generated/models/ErrorResponseCode";
import "@sage-bionetworks/synapse-client/generated/models/TwoFactorAuthErrorResponse";
import "@sage-bionetworks/synapse-client/util/SynapseClientError";
import "@sage-bionetworks/synapse-types";
import "../../utils/functions/EntityTypeUtils.js";
import "../../utils/SynapseConstants.js";
import "lodash-es";
import "@sage-bionetworks/synapse-client/util/synapseClientFetch";
import { useSynapseContext as g } from "../../utils/context/SynapseContext.js";
import { useState as d, useEffect as u } from "react";
import { useInView as I } from "react-intersection-observer";
const E = (l) => {
  const {
    fileHandleAssociation: {
      fileHandleId: e,
      associateObjectId: t,
      associateObjectType: r
    },
    imgProps: m
  } = l, { accessToken: i } = g(), [a, c] = d(), { ref: p, inView: n } = I({
    triggerOnce: !0,
    rootMargin: "500px 0px"
  });
  return u(() => {
    e && t && r && n && f.getActualFileHandleByIdURL(
      e,
      i,
      r,
      t,
      !1
    ).then((o) => {
      c(o);
    }).catch((o) => {
      console.error("Error on retrieving file handle url ", o);
    });
  }, [
    n,
    e,
    t,
    i,
    r
  ]), /* @__PURE__ */ s("span", { ref: p, children: a && /* @__PURE__ */ s(
    "img",
    {
      className: "ImageFileHandle",
      src: a,
      alt: "",
      loading: "lazy",
      ...m
    }
  ) });
};
export {
  E as ImageFileHandle
};
//# sourceMappingURL=ImageFileHandle.js.map