cozy-search/dist/components/Conversations/Sources/Sources.js

UI components about search bar and IA assistant

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = void 0;

var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));

var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));

var _react = _interopRequireWildcard(require("react"));

var _cozyClient = require("cozy-client");

var _Box = _interopRequireDefault(require("cozy-ui/transpiled/react/Box"));

var _Chips = _interopRequireDefault(require("cozy-ui/transpiled/react/Chips"));

var _Grow = _interopRequireDefault(require("cozy-ui/transpiled/react/Grow"));

var _Icon = _interopRequireDefault(require("cozy-ui/transpiled/react/Icon"));

var _MultiFiles = _interopRequireDefault(require("cozy-ui/transpiled/react/Icons/MultiFiles"));

var _Right = _interopRequireDefault(require("cozy-ui/transpiled/react/Icons/Right"));

var _I18n = require("cozy-ui/transpiled/react/providers/I18n");

var _SourcesItem = _interopRequireDefault(require("./SourcesItem"));

var _queries = require("../../queries");

var _excluded = ["data"];

function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }

function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }

var Sources = function Sources(_ref) {
  var messageId = _ref.messageId,
      files = _ref.files;

  var _useState = (0, _react.useState)(false),
      _useState2 = (0, _slicedToArray2.default)(_useState, 2),
      showSources = _useState2[0],
      setShowSources = _useState2[1];

  var _useI18n = (0, _I18n.useI18n)(),
      t = _useI18n.t;

  var ref = (0, _react.useRef)();

  var handleShowSources = function handleShowSources() {
    setShowSources(function (v) {
      return !v;
    });
  }; // we want to scroll down to the sources button when it is displayed


  (0, _react.useEffect)(function () {
    var _ref$current;

    (_ref$current = ref.current) === null || _ref$current === void 0 ? void 0 : _ref$current.scrollIntoView(false);
  }, []);
  (0, _react.useEffect)(function () {
    if (showSources) {
      var sourcesBottom = ref.current.getBoundingClientRect().bottom;
      var innerContainer = document.getElementsByClassName('cozyDialogContent')[0];
      var innerContainerBottom = innerContainer.getBoundingClientRect().bottom;

      if (sourcesBottom > innerContainerBottom) {
        ref.current.scrollIntoView(false);
      }
    }
  }, [showSources]);
  return /*#__PURE__*/_react.default.createElement(_Box.default, {
    ref: ref,
    className: "u-mt-1-half",
    pl: "44px"
  }, /*#__PURE__*/_react.default.createElement(_Chips.default, {
    className: "u-mb-1",
    icon: /*#__PURE__*/_react.default.createElement(_Icon.default, {
      icon: _MultiFiles.default,
      className: "u-ml-half"
    }),
    label: t('assistant.sources', files.length),
    deleteIcon: /*#__PURE__*/_react.default.createElement(_Icon.default, {
      className: "u-h-1",
      icon: _Right.default,
      rotate: showSources ? 90 : 0
    }),
    clickable: true,
    onClick: handleShowSources,
    onDelete: handleShowSources
  }), /*#__PURE__*/_react.default.createElement(_Grow.default, {
    in: showSources,
    style: {
      transformOrigin: '0 0 0'
    },
    mountOnEnter: true,
    unmountOnExit: true
  }, /*#__PURE__*/_react.default.createElement("div", null, files.map(function (file) {
    return /*#__PURE__*/_react.default.createElement(_SourcesItem.default, {
      key: "".concat(messageId, "-").concat(file._id),
      file: file
    });
  }))));
};

var SourcesWithFilesQuery = function SourcesWithFilesQuery(_ref2) {
  var messageId = _ref2.messageId,
      sources = _ref2.sources;
  var fileIds = sources.map(function (source) {
    return source.id;
  });
  var filesByIds = (0, _queries.buildFilesByIds)(fileIds);

  var _useQuery = (0, _cozyClient.useQuery)(filesByIds.definition, filesByIds.options),
      files = _useQuery.data,
      queryResult = (0, _objectWithoutProperties2.default)(_useQuery, _excluded);

  var isLoading = (0, _cozyClient.isQueryLoading)(queryResult);
  if (isLoading || files.length === 0) return null;
  return /*#__PURE__*/_react.default.createElement(Sources, {
    messageId: messageId,
    files: files
  });
};

var _default = SourcesWithFilesQuery;
exports.default = _default;