import { _ as _slicedToArray } from './slicedToArray-be2f7a22.js';
import React, { useState, useEffect } from 'react';
import { useRouter } from 'next/router';
import Container from 'react-bootstrap/Container';
import ADGutter from './ADGutter.js';
import AD728x90 from './AD728x90.js';
import Header from './Header.js';
import { Column1 } from './Column1.js';
import { Column2 } from './Column2.js';
import { Column3 } from './Column3.js';
import MagazineNav from './NavMagazine.js';
import { NavNative } from './NavNative.js';
import { NavNormal } from './NavNormal.js';
import { NavDvm } from './NavDvm.js';
import { HamMagazine } from './HamMagazine.js';
import './_commonjsHelpers-0c4b6f40.js';
import './web.dom.iterable-4109ff68.js';
import './es6.string.iterator-bc33758b.js';
import './_to-object-b50e61c3.js';
import './core.get-iterator-method-133dfacd.js';
import './AdSlot.js';
import './extends-60e0e1c6.js';
import './_object-pie-133f504a.js';
import 'prop-types';
import './index-2446af28.js';
import './events-6c3a7a63.js';
import './debounce-533d9748.js';
import './isSymbol-a7e9aafe.js';
import './toNumber-5aeba6e7.js';
import './Beam.js';
import './stringify-59c8f690.js';
import './asyncToGenerator-7f8f9219.js';
import './_library-528f1934.js';
import './_iter-detect-7e5e5ce2.js';
import './Segment.js';
import './main-b5c5aac1.js';
import 'next/head';
import 'react-bootstrap/Row';
import 'react-bootstrap/Col';
import './SideFooter.js';
import './defineProperty-f5ff6f5a.js';
import './define-property-fe54dc9f.js';
import './react-social-icons-91f9716f.js';
import './get-3c308da4.js';
import './eq-bdcbf886.js';
import './ConferenceBanner-9162d0ca.js';
import './ADSponsoredResources.js';
import './LeftNav.js';
import 'react-bootstrap/ListGroup';
import './ADWebcast.js';
import './PageFilter.js';
import 'react-bootstrap';
import 'react-bootstrap/Nav';
import 'react-bootstrap/Navbar';
import 'react-bootstrap/NavDropdown';
import './index.esm-d6f88d94.js';
import './iconBase-602d52fe.js';
import './index.esm-3fdda599.js';
import './NavFooter-c29526b7.js';
import './index.esm-8016b507.js';
import './SocialSearchComponent-cd38ae60.js';
import './SocialIcons.js';
import 'react-bootstrap/Form';
import 'react-bootstrap/FormControl';
import 'react-bootstrap/Button';
import './Search.js';

// Main
var TemplateNormal = function TemplateNormal(props) {
  var config = props.config,
      title = props.title,
      keywords = props.keywords,
      description = props.description,
      website = props.website,
      horizontalAD = props.config.horizontalAD,
      showFilter = props.showFilter,
      filterParams = props.filterParams,
      filters = props.filters,
      defaultFilter = props.defaultFilter,
      showRightAd = props.showRightAd,
      sponsoredFlag = props.sponsoredFlag,
      _props$noTitle = props.noTitle,
      noTitle = _props$noTitle === undefined ? false : _props$noTitle;

  var router = useRouter();

  var _useState = useState(0),
      _useState2 = _slicedToArray(_useState, 2),
      currentPage = _useState2[0],
      setCurrentPage = _useState2[1];

  useEffect(function () {
    router.asPath && router.asPath.split('?').forEach(function (item) {
      if (item.includes('page=')) {
        setCurrentPage(item.split('=')[1]);
      } else {
        setCurrentPage(0);
      }
    });
  }, [router]);
  var navigation = function navigation() {
    switch (config.navComponent) {
      case 'normal':
        return React.createElement(NavNormal, { logo: website.logo, dataObject: config.navItems });
      case 'magazine':
        return React.createElement(MagazineNav, { logo: website.logo, mobileLogo: website.mobileLogo, dataObject: config.navItems, subNav: config.leftItems, website: website });
      case 'native':
        return React.createElement(NavNative, { logo: website.logo, dataObject: config.navItems, subNav: config.leftItems, website: website });
      case 'dvm':
        return React.createElement(NavDvm, { logo: website.logo, dataObject: config.navItems, mobileLogo: website.logo, subNav: config.leftItems, website: website });
      case 'hamburgerNav':
        return React.createElement(HamMagazine, {
          socialFooterNav: true,
          logo: website.logo,
          dataObject: config.navItems,
          mobileLogo: website.logo,
          subNav: config.leftItems,
          website: website.siteSettingCache,
          showLogin: website.showLogin
        });
      default:
        return React.createElement('noNav', null);
    }
  };

  var adTargeting = { desktop: {}, mobile: {} };
  if (horizontalAD.targeting) {
    adTargeting = horizontalAD.targeting;
  }
  if (website.sponsoredAd) {
    website.sponsoredAd['targeting'] = adTargeting;
  }
  if (website.gutterAd) {
    website.gutterAd['targeting'] = adTargeting;
  }
  function layout() {
    switch (config.columns) {
      case '1':
        return React.createElement(
          Column1,
          { title: title },
          props.children
        );
      case '2':
        return React.createElement(
          Column2,
          { title: title, rightItems: config.rightItems, website: website },
          props.children
        );
      case '3':
        return React.createElement(
          Column3,
          {
            title: title,
            leftItems: config.leftItems,
            rightItems: config.rightItems,
            website: website,
            showFilter: showFilter,
            getParams: filterParams,
            filters: filters,
            defaultFilter: defaultFilter,
            showRightAd: showRightAd,
            logo: website.brandLogo },
          props.children
        );
      default:
        return React.createElement('noLayout', null);
    }
  }

  return React.createElement(
    'section',
    null,
    noTitle ? React.createElement(Header, {
      isLiveSite: config.isLiveSite,
      keyword: keywords,
      description: description + ('' + (router && router.query && router.query.page ? '| Page ' + router.query.page : ''))
    }) : React.createElement(Header, {
      title: title ? title + ' ' + (currentPage !== 0 ? '| Page ' + currentPage + ' ' : router && router.query && router.query.page ? '| Page ' + router.query.page + ' ' : '') + '| ' + website.title : website.title + ' ' + (currentPage !== 0 ? '| Page ' + currentPage + ' ' : router && router.query && router.query.page ? '| Page ' + router.query.page + ' ' : ''),
      isLiveSite: config.isLiveSite,
      keyword: keywords,
      description: description + ('' + (router && router.query && router.query.page ? '| Page ' + router.query.page : ''))
    }),
    navigation(),
    sponsoredFlag ? React.createElement('div', { style: { height: '50px' } }) : React.createElement(
      React.Fragment,
      null,
      horizontalAD && horizontalAD.networkID && horizontalAD.adUnit && React.createElement(
        Container,
        null,
        React.createElement(AD728x90, { networkID: horizontalAD.networkID, adUnit: horizontalAD.adUnit, targeting: adTargeting })
      )
    ),
    website.gutterAd && !sponsoredFlag && React.createElement(ADGutter, { title: 'gutter-ad', gutterAd: website.gutterAd }),
    React.createElement(
      Container,
      null,
      layout()
    )
  );
};

export default TemplateNormal;
