@twreporter/universal-header/lib/components/channels.js

Universal header of TWReporter sites

"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 _propTypes = _interopRequireDefault(require("prop-types"));
var _styledComponents = _interopRequireDefault(require("styled-components"));
var _headerContext = _interopRequireDefault(require("../contexts/header-context"));
var _links = require("../utils/links");
var _channels = require("../constants/channels");
var _customizedLink = _interopRequireDefault(require("@twreporter/react-components/lib/customized-link"));
var _categorySet = require("@twreporter/core/lib/constants/category-set");
var _button = require("@twreporter/react-components/lib/button");
var _icon = require("@twreporter/react-components/lib/icon");
var _divider = _interopRequireDefault(require("@twreporter/react-components/lib/divider"));
var _map = _interopRequireDefault(require("lodash/map"));
var _reduce = _interopRequireDefault(require("lodash/reduce"));
var _concat = _interopRequireDefault(require("lodash/concat"));
var _excluded = ["onClickHambuger"]; // util
// constant
// @twreporter
// lodash
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 && Object.prototype.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 _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 = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
var _ = {
  map: _map["default"],
  reduce: _reduce["default"],
  concat: _concat["default"]
};
var Item = /*#__PURE__*/_styledComponents["default"].div.withConfig({
  displayName: "channels__Item",
  componentId: "nu2llv-0"
})(["display:flex;align-items:center;a{text-decoration:none;}"]);
var CategoryContainer = /*#__PURE__*/_styledComponents["default"].div.withConfig({
  displayName: "channels__CategoryContainer",
  componentId: "nu2llv-1"
})(["display:flex;align-items:center;justify-content:space-between;width:100%;padding:8px 16px;"]);
var ChannelContainer = /*#__PURE__*/_styledComponents["default"].div.withConfig({
  displayName: "channels__ChannelContainer",
  componentId: "nu2llv-2"
})(["display:flex;flex-direction:column;align-items:center;"]);
var ChannelItem = function ChannelItem(_ref) {
  var _ref$link = _ref.link,
    link = _ref$link === void 0 ? {} : _ref$link,
    _ref$label = _ref.label,
    label = _ref$label === void 0 ? '' : _ref$label;
  var _useContext = (0, _react.useContext)(_headerContext["default"]),
    theme = _useContext.theme;
  return /*#__PURE__*/_react["default"].createElement(Item, null, /*#__PURE__*/_react["default"].createElement(_customizedLink["default"], link, /*#__PURE__*/_react["default"].createElement(_button.TextButton, {
    text: label,
    size: "L",
    theme: theme,
    style: _button.TextButton.Style.DARK
  })));
};
ChannelItem.propTypes = {
  link: _propTypes["default"].object,
  label: _propTypes["default"].string
};
var Channel = function Channel(_ref2) {
  var onClickHambuger = _ref2.onClickHambuger,
    props = _objectWithoutProperties(_ref2, _excluded);
  var _useContext2 = (0, _react.useContext)(_headerContext["default"]),
    isLinkExternal = _useContext2.isLinkExternal,
    releaseBranch = _useContext2.releaseBranch,
    theme = _useContext2.theme;
  var hamburgerIcon = /*#__PURE__*/_react["default"].createElement(_icon.Hamburger, {
    releaseBranch: releaseBranch
  });
  var ItemJSX = _.reduce(_channels.DESKTOP_CHANNEL_ORDER, function (res, channelKey) {
    if (channelKey === _channels.CHANNEL_KEY.category) {
      var categoryJSX = _.map(_categorySet.CATEGORY_ORDER, function (categoryKey) {
        var label = _categorySet.CATEGORY_LABEL[categoryKey];
        var path = "/categories/".concat(categoryKey);
        var link = (0, _links.getLink)(isLinkExternal, releaseBranch, path);
        return /*#__PURE__*/_react["default"].createElement(ChannelItem, {
          key: categoryKey,
          label: label,
          link: link
        });
      });
      res = _.concat(res, categoryJSX);
    } else {
      var label = _channels.CHANNEL_LABEL[channelKey];
      var link = (0, _links.getLink)(isLinkExternal, releaseBranch, _channels.CHANNEL_PATH[channelKey]);
      if (label && link) {
        res.push( /*#__PURE__*/_react["default"].createElement(ChannelItem, {
          key: channelKey,
          label: label,
          link: link
        }));
      }
    }
    return res;
  }, []);
  return /*#__PURE__*/_react["default"].createElement(ChannelContainer, props, /*#__PURE__*/_react["default"].createElement(CategoryContainer, null, /*#__PURE__*/_react["default"].createElement(_button.IconButton, {
    iconComponent: hamburgerIcon,
    theme: theme,
    onClick: onClickHambuger
  }), ItemJSX), /*#__PURE__*/_react["default"].createElement(_divider["default"], null));
};
Channel.propTypes = {
  onClickHambuger: _propTypes["default"].func
};
var _default = exports["default"] = Channel;