import _taggedTemplateLiteralLoose from "@babel/runtime/helpers/taggedTemplateLiteralLoose";
import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/objectWithoutPropertiesLoose";

var _templateObject, _templateObject2, _templateObject3, _templateObject4;

import React from 'react';
import styled from 'styled-components';
import { useCmsContentList, useLocalLabels, useConfigState } from '@sentecacommerce-theme/lib';
import { Loader, Typography } from '../../../Common';
import { Pagination, BlogItem } from './Components';
export var BlogListing = () => {
  var {
    blogConfig
  } = useConfigState();
  var labels = useLocalLabels();
  var {
    data
  } = useCmsContentList({
    type: blogConfig.key,
    limit: blogConfig.limit || 6,
    sort: 'createdAt;desc'
  });

  if (!data) {
    return /*#__PURE__*/React.createElement(LoaderContainer, null, /*#__PURE__*/React.createElement(Loader, null));
  }

  var {
    results
  } = data,
      rest = _objectWithoutPropertiesLoose(data, ["results"]);

  return !!results.length ? /*#__PURE__*/React.createElement(Container, null, /*#__PURE__*/React.createElement(Title, null, labels.title), results == null ? void 0 : results.map(content => /*#__PURE__*/React.createElement(BlogItem, {
    data: content,
    key: content._id,
    slug: content.key
  })), /*#__PURE__*/React.createElement(Pagination, rest)) : /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Title, null, labels.title), /*#__PURE__*/React.createElement(NoPostsContainer, null, /*#__PURE__*/React.createElement("p", null, labels.noPosts)));
};
var LoaderContainer = styled.div.attrs({
  className: 'd-flex align-items-center justify-content-center'
})(_templateObject || (_templateObject = _taggedTemplateLiteralLoose(["\n  min-height: calc(100vh - (20rem + 40rem));\n  position: relative;\n"])));
var Container = styled.div.attrs({
  className: 'd-flex flex-column'
})(_templateObject2 || (_templateObject2 = _taggedTemplateLiteralLoose([""])));
var Title = styled(Typography).attrs({
  as: 'h1',
  variant: 2,
  className: 'mt-2 mt-3'
})(_templateObject3 || (_templateObject3 = _taggedTemplateLiteralLoose(["\n  font-weight: bold;\n"])));
var NoPostsContainer = styled.div.attrs({
  className: 'd-flex align-items-center justify-content-center'
})(_templateObject4 || (_templateObject4 = _taggedTemplateLiteralLoose(["\n  min-height: calc(100vh - (20rem + 40rem));\n"])));
//# sourceMappingURL=index.js.map