import _asyncToGenerator from "@babel/runtime/helpers/asyncToGenerator";
import React from 'react';
import { notificationsApi, useLocalLabels } from '@sentecacommerce-theme/lib';
import { useToasts } from 'react-toast-notifications';
import { Message } from './Components';
import { NavigationSkeleton } from '../NavigationSkeleton';
import { Spinner } from '../../../Common';
var CustomerMessageStatusUpdateDTOStatusEnum;

(function (CustomerMessageStatusUpdateDTOStatusEnum) {
  CustomerMessageStatusUpdateDTOStatusEnum["Read"] = "read";
  CustomerMessageStatusUpdateDTOStatusEnum["Unread"] = "unread";
})(CustomerMessageStatusUpdateDTOStatusEnum || (CustomerMessageStatusUpdateDTOStatusEnum = {}));

export var Notifications = () => {
  var _data$results, _data$results2;

  var {
    addToast
  } = useToasts();
  var {
    data,
    isFetching
  } = notificationsApi.useGet();
  var [markAsRead] = notificationsApi.useSetStatus({
    onSuccess: () => addToast(labels.deletedMessage, {
      appearance: 'success',
      autoDismiss: true
    })
  });
  var filteredResults = data == null ? void 0 : (_data$results = data.results) == null ? void 0 : _data$results.filter(message => message.status !== 'read');
  var isEmpty = (filteredResults == null ? void 0 : filteredResults.length) === 0;
  var labels = useLocalLabels();
  return /*#__PURE__*/React.createElement(NavigationSkeleton, {
    url: "notifications",
    header: "Notifications"
  }, isFetching ? /*#__PURE__*/React.createElement(Spinner, null) : data == null ? void 0 : (_data$results2 = data.results) == null ? void 0 : _data$results2.map((_ref) => {
    var {
      message,
      _id,
      status
    } = _ref;
    if (status === 'read') return null;
    return /*#__PURE__*/React.createElement(Message, {
      key: "Message__" + _id,
      handleRead: /*#__PURE__*/_asyncToGenerator(function* () {
        return yield markAsRead({
          id: _id,
          dto: {
            status: CustomerMessageStatusUpdateDTOStatusEnum.Read
          }
        });
      }),
      header: message.header,
      content: message.body
    });
  }), isEmpty && /*#__PURE__*/React.createElement("p", null, labels.noNotifications));
};
//# sourceMappingURL=index.js.map