Why Gemfury? Push, build, and install  RubyGems npm packages Python packages Maven artifacts PHP packages Go Modules Debian packages RPM packages NuGet packages

Repository URL to install this package:

Details    
Size: Mime:
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t["return"] && (u = t["return"](), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
import { Fragment, useEffect, useMemo, useState } from 'react';
import { useSelector } from 'react-redux';
import isSupportedVideo from '@filerobot/utils/lib/isSupportedVideo';
import LinkHelper from '@filerobot/utils/lib/LinkHelper';
import getItemIcon from '@filerobot/utils/lib/getItemIcon';
import getFileLink from '@filerobot/utils/lib/getFileLink';
import isImage from '@filerobot/utils/lib/isImage';
import convertVideoFileTypeToSupported from '@filerobot/utils/lib/convertVideoFileTypeToSupported';
import { Canvas } from 'react-filerobot-media-annotator';
import getFormattedPreviewUrl from '@filerobot/utils/lib/getFormattedPreviewUrl';
import { PLUGINS_IDS } from '@filerobot/utils/lib/constants';
import { useCore } from '@filerobot/core/lib/hooks';
import getFileAssetsTokenUrl from '@filerobot/utils/lib/getFileAssetsTokenUrl';
import { selectIsShareboxView } from '../../../slices/views.slice';
import { useExplorer } from '../../../hooks/';
import { DEFAULT_ZOOM_RATIO } from './Body.constants';
import Styled from './Body.styled';
import { jsx as _jsx } from "react/jsx-runtime";
import { Fragment as _Fragment } from "react/jsx-runtime";
import { jsxs as _jsxs } from "react/jsx-runtime";
var BodyFile = function BodyFile(_ref) {
  var _file$url, _file$info, _file$remote, _file$remote$body, _file$url2;
  var file = _ref.file,
    zoomRatio = _ref.zoomRatio,
    panningDimens = _ref.panningDimens,
    isCommentsTabOpened = _ref.isCommentsTabOpened,
    setPanningDimens = _ref.setPanningDimens,
    isPanEnabled = _ref.isPanEnabled,
    imgEl = _ref.imgEl,
    setImgRef = _ref.setImgRef,
    previewEl = _ref.previewEl,
    isPdfPreviewSupported = _ref.isPdfPreviewSupported,
    videoEl = _ref.videoEl,
    setVideoRef = _ref.setVideoRef,
    isTransparencySupported = _ref.isTransparencySupported,
    isMediaLoadingFailed = _ref.isMediaLoadingFailed,
    setIsMediaLoadingFailed = _ref.setIsMediaLoadingFailed;
  var _useCore = useCore(),
    getPlugin = _useCore.getPlugin,
    container = _useCore.opts.container;
  var _useExplorer = useExplorer(),
    isDevEnv = _useExplorer.isDevEnv,
    floaty = _useExplorer.opts.floaty;
  var isShareboxView = useSelector(selectIsShareboxView);
  var hiddenImageLoading = isPdfPreviewSupported || isSupportedVideo(file) || !isShareboxView;
  var _useState = useState(!hiddenImageLoading),
    _useState2 = _slicedToArray(_useState, 2),
    isImageLoading = _useState2[0],
    setIsImageLoading = _useState2[1];
  var videoUrl = '';
  var isBgRemoved = file.bgRemoved;
  var fileVersionPreviewUrl = getFileLink(file, (file === null || file === void 0 ? void 0 : (_file$url = file.url) === null || _file$url === void 0 ? void 0 : _file$url.version_preview_link) && 'version_preview_link');

  // file.info.preview is preview for big files and always proffered to use if exists, please note that order here matters
  var filePreviewUrl = ((_file$info = file.info) === null || _file$info === void 0 ? void 0 : _file$info.preview) || fileVersionPreviewUrl || (file === null || file === void 0 ? void 0 : file.preview) || (file === null || file === void 0 ? void 0 : (_file$remote = file.remote) === null || _file$remote === void 0 ? void 0 : (_file$remote$body = _file$remote.body) === null || _file$remote$body === void 0 ? void 0 : _file$remote$body.url) || file.blob || '';
  var pdfPath = useMemo(function () {
    return getFileLink(file);
  }, [file]);
  var previewUrl = getFormattedPreviewUrl({
    url: filePreviewUrl,
    isDevEnv: isDevEnv,
    isHubMode: floaty,
    containerToken: container,
    provideContainerToken: Boolean(file === null || file === void 0 ? void 0 : (_file$url2 = file.url) === null || _file$url2 === void 0 ? void 0 : _file$url2.version_preview_link)
  });
  useEffect(function () {
    if (zoomRatio <= DEFAULT_ZOOM_RATIO) {
      setPanningDimens({
        x: 0,
        y: 0
      });
    }
  }, [zoomRatio]);
  var toggleVideo = function toggleVideo() {
    if (!videoEl || isCommentsTabOpened) {
      return;
    }
    if (videoEl.current.paused) {
      videoEl.current.play();
    } else {
      videoEl.current.pause();
    }
  };
  var renderAnnotatorCanvas = function renderAnnotatorCanvas(mediaRef) {
    return /*#__PURE__*/_jsx(Styled.CanvasWrapper, {
      children: (mediaRef === null || mediaRef === void 0 ? void 0 : mediaRef.current) && /*#__PURE__*/_jsx(Canvas, {
        mediaRef: mediaRef
      })
    });
  };
  var getImgSrc = function getImgSrc() {
    var _previewEl$current;
    var defaultIconSrc = getItemIcon({
      fileOrFolder: file
    });
    var href = isImage(file) && previewUrl ? previewUrl : defaultIconSrc || '';

    // No need extra params for local file. Case: upload file required metadata field.
    if (isImage(file) && !file.url && file !== null && file !== void 0 && file.preview) {
      return href;
    }
    if (isBgRemoved) {
      href = file.url;
    }
    return new LinkHelper({
      href: href
    }).appendSearchParams({
      func: 'bound',
      org_if_sml: 1,
      w: Math.floor(((_previewEl$current = previewEl.current) === null || _previewEl$current === void 0 ? void 0 : _previewEl$current.offsetWidth) * devicePixelRatio)
    });
  };
  useEffect(function () {
    if (hiddenImageLoading || isImageLoading) return;
    setIsImageLoading(true);
  }, [filePreviewUrl]);
  var loadImageHandler = function loadImageHandler() {
    setIsImageLoading(false);
  };
  if (isPdfPreviewSupported) {
    var targetPlugin = getPlugin(PLUGINS_IDS.PDF_JS);
    return /*#__PURE__*/_jsx(Fragment, {
      children: /*#__PURE__*/_jsx(targetPlugin.render, {
        pdfPath: pdfPath,
        file: file
      })
    }, targetPlugin.id);
  }
  if (isSupportedVideo(file) && !isMediaLoadingFailed) {
    var _file$url3, _previewEl$current2, _previewEl$current3;
    if (file !== null && file !== void 0 && (_file$url3 = file.url) !== null && _file$url3 !== void 0 && _file$url3.cdn) {
      var _file$url4;
      videoUrl = getFileAssetsTokenUrl(file === null || file === void 0 ? void 0 : (_file$url4 = file.url) === null || _file$url4 === void 0 ? void 0 : _file$url4.cdn, isDevEnv);
    } else {
      videoUrl = filePreviewUrl;
    }
    return /*#__PURE__*/_jsxs(_Fragment, {
      children: [/*#__PURE__*/_jsx(Styled.VideoWrapper, {
        onClick: toggleVideo,
        children: /*#__PURE__*/_jsx("video", {
          onError: function onError() {
            return setIsMediaLoadingFailed(true);
          },
          ref: setVideoRef,
          width: (_previewEl$current2 = previewEl.current) === null || _previewEl$current2 === void 0 ? void 0 : _previewEl$current2.offsetWidth,
          height: (_previewEl$current3 = previewEl.current) === null || _previewEl$current3 === void 0 ? void 0 : _previewEl$current3.offsetHeight,
          children: /*#__PURE__*/_jsx("source", {
            src: videoUrl,
            type: convertVideoFileTypeToSupported(file.type)
          })
        })
      }), isCommentsTabOpened && renderAnnotatorCanvas(videoEl)]
    });
  }
  return /*#__PURE__*/_jsxs(_Fragment, {
    children: [/*#__PURE__*/_jsx(Styled.Skeleton, {
      absolutePosition: true,
      hidden: !isImageLoading
    }), /*#__PURE__*/_jsx(Styled.BodyFile, {
      ref: setImgRef,
      src: getImgSrc(),
      alt: file === null || file === void 0 ? void 0 : file.name,
      draggable: false,
      $zoomRatio: zoomRatio,
      onLoad: loadImageHandler,
      hidden: isImageLoading,
      $pan: panningDimens,
      $isPanEnabled: isPanEnabled,
      $isTransparencySupported: isTransparencySupported
    }), isCommentsTabOpened && renderAnnotatorCanvas(imgEl)]
  });
};
export default BodyFile;