@fle-ui/plus-im-record 0.0.7-beta.0 → 0.0.8-beta.1

package/es/index.d.ts

@@ -1,21 +1,24 @@
-import React from 'react';
+import React, { UIEventHandler } from 'react';
+import { RecordSession } from './ChatMessageList';
 import { apiCreate, Env } from './api';
 import { IMMessage } from './@types';
 import './styles/index.less';
 /**
  * @name 客服记录组件
- * @description 代码由小鲤客服平台搬运简化而来
+ * @description 代码由小鲤客服平台搬运简来.
  */
 export interface IMRecordProps {
     env?: Env;
     token?: string;
-    msgRecords: IMMessage[];
-    onScrollTop?: () => void;
-    recordSession?: {
-        relationId: string | number;
-        accid: string;
-        relationType?: number;
-    };
+    h5?: boolean;
+    msgs: IMMessage[];
+    myAccount?: string;
+    loadingStarus?: 'loading' | 'nomore';
+    onScrollTop?: UIEventHandler<HTMLDivElement>;
+    onScrollBottom?: UIEventHandler<HTMLDivElement>;
+    style?: React.CSSProperties;
+    isSessionEnd?: boolean;
+    recordSession?: RecordSession;
 }
 export interface ImContextProps {
     api: ReturnType<typeof apiCreate>;

package/es/index.js

@@ -1,4 +1,6 @@
 function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+var _excluded = ["env", "token", "msgs", "recordSession"];
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
@@ -14,30 +16,33 @@ function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o =
 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 React, { createContext, useEffect, useState } from 'react';
+function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } } return target; }
+import React, { createContext, useEffect, useRef, useState } from 'react';
 import ChatMessageList from './ChatMessageList';
 import { apiCreate } from './api';
 import './styles/index.less';
 export var ImContext = /*#__PURE__*/createContext({});
 var IMRecord = function IMRecord(_ref) {
   var env = _ref.env,
-    msgRecords = _ref.msgRecords,
     token = _ref.token,
+    msgs = _ref.msgs,
     recordSession = _ref.recordSession,
-    onScrollTop = _ref.onScrollTop;
+    restProps = _objectWithoutProperties(_ref, _excluded);
   var api = apiCreate(env, token);
   var _useState = useState({}),
     _useState2 = _slicedToArray(_useState, 2),
     accountsMap = _useState2[0],
     setAccountsMap = _useState2[1];
+  var messageListDomRef = useRef(null);
   useEffect(function () {
-    var accids = _toConsumableArray(new Set(msgRecords.map(function (x) {
+    var accids = _toConsumableArray(new Set(msgs.map(function (x) {
       return x.from;
     })));
     if (accids.length) {
       getAccountByAccids(accids);
     }
-  }, [msgRecords]);
+  }, [msgs]);
   function getAccountByAccids(accids) {
     api.getAccountInfoByAccid({
       accids: accids
@@ -60,17 +65,13 @@ var IMRecord = function IMRecord(_ref) {
     value: {
       api: api
     }
-  }, /*#__PURE__*/React.createElement(ChatMessageList, {
-    msgs: msgRecords,
+  }, /*#__PURE__*/React.createElement(ChatMessageList, _extends({
+    ref: messageListDomRef,
+    msgs: msgs,
     h5: true,
-    style: {
-      height: '100%',
-      background: '#f7f7f7'
-    },
     accountsMap: accountsMap,
     isSessionEnd: true,
-    recordSession: recordSession,
-    onScrollTop: onScrollTop
-  }));
+    recordSession: recordSession
+  }, restProps)));
 };
 export default IMRecord;

package/lib/ChatMessageItem/index.d.ts

@@ -1,5 +1,6 @@
 import React from 'react';
 import { IMMessage } from '../@types';
+import { RecordSession } from '../ChatMessageList';
 import './index.less';
 declare const ChatMessageItem: React.FC<{
     h5?: boolean;
@@ -9,9 +10,6 @@ declare const ChatMessageItem: React.FC<{
     myAccount?: string;
     accountInfo: any;
     isSessionEnd: boolean;
-    recordSession?: {
-        relationId: string | number;
-        accid: string;
-    };
+    recordSession?: RecordSession;
 }>;
 export default ChatMessageItem;

package/lib/ChatMessageItem/index.less

@@ -103,6 +103,6 @@
 // 对话-H5
 .@{prefix}.h5 {
   .@{prefix}-body {
-    max-width: 270px;
+    max-width: 276px;
   }
 }

package/lib/ChatMessageList/index.d.ts

@@ -3,12 +3,18 @@ import { IMMessage } from '../@types';
 import './index.less';
 declare const LOADING_STATUS: any;
 export type LoadingStatus = keyof typeof LOADING_STATUS | undefined;
+export interface RecordSession {
+    relationId?: string | number;
+    accid?: string;
+    relationType?: number;
+}
 export interface ChatMessageListProps {
     h5?: boolean;
     msgs: IMMessage[];
     myAccount?: string;
     loadingStarus?: LoadingStatus;
     onScrollTop?: UIEventHandler<HTMLDivElement>;
+    onScrollBottom?: UIEventHandler<HTMLDivElement>;
     accountsMap?: Record<string, {
         accid: string;
         nickname: string;
@@ -16,11 +22,7 @@ export interface ChatMessageListProps {
     }>;
     style?: React.CSSProperties;
     isSessionEnd?: boolean;
-    recordSession?: {
-        relationId: string | number;
-        accid: string;
-        relationType?: number;
-    };
+    recordSession?: RecordSession;
 }
 declare const ChatMessageList: React.ForwardRefExoticComponent<ChatMessageListProps & React.RefAttributes<HTMLDivElement>>;
 export default ChatMessageList;

package/lib/ChatMessageList/index.js

@@ -17,8 +17,8 @@ var LOAD_LIMIT = 15;
 var ChatMessageList = /*#__PURE__*/_react.default.forwardRef(function (_ref, ref) {
   var h5 = _ref.h5,
     msgs = _ref.msgs,
-    _ref$onScrollTop = _ref.onScrollTop,
-    onScrollTop = _ref$onScrollTop === void 0 ? function () {} : _ref$onScrollTop,
+    onScrollTop = _ref.onScrollTop,
+    onScrollBottom = _ref.onScrollBottom,
     _ref$loadingStarus = _ref.loadingStarus,
     loadingStarus = _ref$loadingStarus === void 0 ? '' : _ref$loadingStarus,
     myAccount = _ref.myAccount,
@@ -32,8 +32,10 @@ var ChatMessageList = /*#__PURE__*/_react.default.forwardRef(function (_ref, ref
   var onScrollHandler = (0, _utils.debounce)(function (e) {
     var scrollElRef = ref;
     if (!(scrollElRef === null || scrollElRef === void 0 ? void 0 : scrollElRef.current)) return;
+    var isBottom = scrollElRef.current.scrollTop >= scrollElRef.current.scrollHeight - scrollElRef.current.clientHeight - 20;
     var isTop = scrollElRef.current.scrollTop < 20;
     isTop && (onScrollTop === null || onScrollTop === void 0 ? void 0 : onScrollTop(e));
+    isBottom && (onScrollBottom === null || onScrollBottom === void 0 ? void 0 : onScrollBottom(e));
   }, 200);
   return /*#__PURE__*/_react.default.createElement("div", {
     className: prefixCls,

package/lib/ChatMessageList/index.less

@@ -1,7 +1,8 @@
 @prefix: chart;
 
 .@{prefix}-messages {
-  flex: 1;
+  width: 100%;
+  height: 100%;
   position: relative;
   overflow: hidden;
   display: flex;

package/lib/GoodsCard/index.d.ts

@@ -9,6 +9,7 @@ declare const OrderCard: React.FC<{
         productId: any;
         relationId?: any;
         relationType?: any;
+        orderProductId?: number;
     };
 }>;
 export default OrderCard;

package/lib/GoodsCard/index.js

@@ -26,7 +26,8 @@ var OrderCard = function OrderCard(props) {
     content = props.content;
   var productId = content.productId,
     relationId = content.relationId,
-    relationType = content.relationType;
+    relationType = content.relationType,
+    orderProductId = content.orderProductId;
   var _useState = (0, _react.useState)({}),
     _useState2 = _slicedToArray(_useState, 2),
     data = _useState2[0],
@@ -38,7 +39,8 @@ var OrderCard = function OrderCard(props) {
       api.getProductById({
         productId: productId,
         relationId: relationId,
-        relationType: relationType
+        relationType: relationType,
+        orderProductId: orderProductId
       }).then(function (_ref) {
         var data = _ref.data;
         setData(data || {});

package/lib/GoodsCard/index.less

@@ -1,7 +1,7 @@
 @prefix: chart-messages-item;
 
 .@{prefix}-goods {
-  width: 272px;
+  max-width: 272px;
   padding-bottom: 2px;
   &-info {
     display: flex;

package/lib/GoodsOrderCard/index.d.ts

@@ -1,4 +1,5 @@
 import React from 'react';
+import { RecordSession } from '../ChatMessageList';
 import './index.less';
 export declare function fitUrl(url: string): string;
 declare const GoodsOrderCard: React.FC<{
@@ -8,10 +9,6 @@ declare const GoodsOrderCard: React.FC<{
     onClose?: Function;
     orderSn?: any;
     orderId?: any;
-    recordSession?: {
-        relationId: string | number;
-        accid: string;
-        relationType?: number;
-    };
+    recordSession?: RecordSession;
 }>;
 export default GoodsOrderCard;

package/lib/GoodsOrderCard/index.js

@@ -70,7 +70,7 @@ var GoodsOrderCard = function GoodsOrderCard(props) {
     data = _useState2[0],
     setData = _useState2[1];
   (0, _react.useEffect)(function () {
-    if ((orderId || orderSn) && relationId && accid) {
+    if (orderId || orderSn) {
       api.getCSOrder({
         orderSn: orderSn,
         orderId: Number(orderId) || orderId,

package/lib/GoodsOrderCard/index.less

@@ -1,7 +1,7 @@
 @prefix: chart-messages-item;
 
 .@{prefix}-order {
-  width: 272px;
+  max-width: 272px;
   padding-bottom: 2px;
 
   &-info {

package/lib/ParseSession/AudioPlayer.d.ts

@@ -0,0 +1,14 @@
+import React from 'react';
+interface AudioPlayerProps {
+    prefix: string;
+    msg: {
+        idClient: string;
+        flow: string;
+    };
+    url: string;
+    dur: number;
+    text?: string;
+    style?: React.CSSProperties;
+}
+declare const AudioPlayer: React.FC<AudioPlayerProps>;
+export default AudioPlayer;

package/lib/ParseSession/AudioPlayer.js

@@ -0,0 +1,98 @@
+"use strict";
+
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireWildcard(require("react"));
+var _Icon = _interopRequireDefault(require("../Icon"));
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
+function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+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; }
+var AudioPlayer = function AudioPlayer(_ref) {
+  var prefix = _ref.prefix,
+    msg = _ref.msg,
+    url = _ref.url,
+    dur = _ref.dur,
+    text = _ref.text,
+    _ref$style = _ref.style,
+    style = _ref$style === void 0 ? {} : _ref$style;
+  var audioRef = (0, _react.useRef)(null);
+  var _useState = (0, _react.useState)(false),
+    _useState2 = _slicedToArray(_useState, 2),
+    animationFlag = _useState2[0],
+    setAnimationFlag = _useState2[1];
+  var pauseAllAudio = function pauseAllAudio() {
+    var audio = document.getElementById('fxMessageAudio');
+    audio === null || audio === void 0 ? void 0 : audio.pause();
+    return audio;
+  };
+  var pauseAllVideo = function pauseAllVideo() {
+    var videoElements = document.getElementsByTagName('video');
+    for (var i = 0; i < videoElements.length; i++) {
+      if (videoElements[i].id.startsWith('fxMessageVideo-')) {
+        videoElements[i].pause();
+      }
+    }
+  };
+  var handleAudioClick = function handleAudioClick() {
+    var _audioRef$current;
+    pauseAllVideo();
+    var oldAudio = pauseAllAudio();
+    var msgId = oldAudio === null || oldAudio === void 0 ? void 0 : oldAudio.getAttribute('msgId');
+    if (msgId === msg.idClient) {
+      setAnimationFlag(false);
+      return;
+    }
+    var audio = new Audio(url);
+    audio.id = 'fxMessageAudio';
+    audio.setAttribute('msgId', msg.idClient);
+    audio.play();
+    (_audioRef$current = audioRef.current) === null || _audioRef$current === void 0 ? void 0 : _audioRef$current.appendChild(audio);
+    audio.addEventListener('ended', function () {
+      var _audio$parentNode;
+      setAnimationFlag(false);
+      (_audio$parentNode = audio.parentNode) === null || _audio$parentNode === void 0 ? void 0 : _audio$parentNode.removeChild(audio);
+    });
+    audio.addEventListener('pause', function () {
+      var _audio$parentNode2;
+      setAnimationFlag(false);
+      (_audio$parentNode2 = audio.parentNode) === null || _audio$parentNode2 === void 0 ? void 0 : _audio$parentNode2.removeChild(audio);
+    });
+    setAnimationFlag(true);
+  };
+  var duration = Math.floor(dur) || 0;
+  var durations = {
+    mm: Math.floor(duration / 60),
+    ss: duration % 60
+  };
+  return /*#__PURE__*/_react.default.createElement("div", {
+    className: "".concat(prefix, "-audio"),
+    ref: audioRef,
+    style: _objectSpread({}, style)
+  }, /*#__PURE__*/_react.default.createElement("div", {
+    className: msg.flow === 'in' ? "".concat(prefix, "-audio-in") : "".concat(prefix, "-audio-out"),
+    onClick: handleAudioClick
+  }, /*#__PURE__*/_react.default.createElement("span", null, ' ', "".concat(durations.mm > 0 ? "".concat(durations.mm, "'") : '', " ").concat(durations.ss, "\"")), /*#__PURE__*/_react.default.createElement("span", {
+    className: "".concat(prefix, "-audio-icon")
+  }, animationFlag ? /*#__PURE__*/_react.default.createElement("img", {
+    src: "https://qa-oss.elebuys.com/tmpdir/202401152050070000640984.gif"
+  }) : /*#__PURE__*/_react.default.createElement(_Icon.default, {
+    type: "icon-a-yuyin2"
+  }))), text && /*#__PURE__*/_react.default.createElement("div", {
+    className: "".concat(prefix, "-audio-audio2text")
+  }, text));
+};
+var _default = exports.default = AudioPlayer;

package/lib/ParseSession/audioAndVideoTool.d.ts

@@ -0,0 +1,3 @@
+export declare const pauseAllAudio: () => HTMLAudioElement;
+export declare const pauseOtherVideo: (idClient: string) => void;
+export declare const pauseAllVideo: () => void;

package/lib/ParseSession/audioAndVideoTool.js

@@ -0,0 +1,27 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.pauseOtherVideo = exports.pauseAllVideo = exports.pauseAllAudio = void 0;
+var pauseAllAudio = exports.pauseAllAudio = function pauseAllAudio() {
+  var audio = document.getElementById('fxMessageAudio');
+  audio === null || audio === void 0 ? void 0 : audio.pause();
+  return audio;
+};
+var pauseOtherVideo = exports.pauseOtherVideo = function pauseOtherVideo(idClient) {
+  var videoElements = document.getElementsByTagName('video');
+  for (var i = 0; i < videoElements.length; i++) {
+    if (videoElements[i].id !== "fxMessageVideo-".concat(idClient)) {
+      videoElements[i].pause();
+    }
+  }
+};
+var pauseAllVideo = exports.pauseAllVideo = function pauseAllVideo() {
+  var videoElements = document.getElementsByTagName('video');
+  for (var i = 0; i < videoElements.length; i++) {
+    if (videoElements[i].id.startsWith('fxMessageVideo-')) {
+      videoElements[i].pause();
+    }
+  }
+};

package/lib/ParseSession/index.d.ts

@@ -1,5 +1,6 @@
 import React from 'react';
 import { IMMessage } from '../@types';
+import { RecordSession } from '../ChatMessageList';
 import './index.less';
 export interface IParseSessionProps {
     prefix?: string;
@@ -8,14 +9,7 @@ export interface IParseSessionProps {
     msg: IMMessage;
     isSessionEnd?: boolean;
     onChartHistoryClick?: Function;
-    recordSession?: {
-        relationId: string | number;
-        accid: string;
-        relationType?: number;
-    };
+    recordSession?: RecordSession;
 }
-export declare const pauseAllAudio: () => HTMLAudioElement;
-export declare const pauseOtherVideo: (idClient: string) => void;
-export declare const pauseAllVideo: () => void;
 declare const ParseSession: React.FC<IParseSessionProps>;
 export default ParseSession;