@twreporter/universal-header 3.0.17 → 3.1.0-rc.1

package/lib/components/hamburger-menu.js

@@ -11,7 +11,8 @@ var _styledComponents = _interopRequireDefault(require("styled-components"));
 var _headerContext = _interopRequireWildcard(require("../contexts/header-context"));
 var _links = require("../utils/links");
 var _theme = require("../utils/theme");
-var _channels = require("../constants/channels");
+var _channels = _interopRequireDefault(require("../constants/channels"));
+var _channelsNew = _interopRequireDefault(require("../constants/channels-new"));
 var _hamburgerMenu = require("../constants/hamburger-menu");
 var _actionButton = require("./action-button");
 var _hamburgerMenuItem = require("./hamburger-menu-item");
@@ -26,11 +27,20 @@ var _input = require("@twreporter/react-components/lib/input");
 var _categorySet = require("@twreporter/core/lib/constants/category-set");
 var _theme2 = require("@twreporter/core/lib/constants/theme");
 var _rwd = require("@twreporter/react-components/lib/rwd");
+var _featureFlag = require("@twreporter/core/lib/constants/feature-flag");
 var _hamburgerFooter = _interopRequireDefault(require("./hamburger-footer"));
 var _map = _interopRequireDefault(require("lodash/map"));
 var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7; // context
 // utils
 // constants
+// import {
+//   CHANNEL_KEY,
+//   CHANNEL_ORDER,
+//   CHANNEL_TYPE,
+//   CHANNEL_LABEL,
+//   CHANNEL_LINK_TYPE,
+//   CHANNEL_DROPDOWN,
+// } from '../constants/channels'
 // components
 // @twreporter
 // Footer
@@ -50,6 +60,13 @@ function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(
 var _ = {
   map: _map["default"]
 };
+var _ref = _featureFlag.LAWMAKER ? _channelsNew["default"] : _channels["default"],
+  CHANNEL_KEY = _ref.CHANNEL_KEY,
+  CHANNEL_ORDER = _ref.CHANNEL_ORDER,
+  CHANNEL_TYPE = _ref.CHANNEL_TYPE,
+  CHANNEL_LABEL = _ref.CHANNEL_LABEL,
+  CHANNEL_LINK_TYPE = _ref.CHANNEL_LINK_TYPE,
+  CHANNEL_DROPDOWN = _ref.CHANNEL_DROPDOWN;
 
 // global var
 var reserveHeightForIos15 = 48;
@@ -115,17 +132,17 @@ var StyledMobileHamburgerAction = /*#__PURE__*/(0, _styledComponents["default"])
   displayName: "hamburger-menu__StyledMobileHamburgerAction",
   componentId: "sc-15rzowt-12"
 })(["width:100%;"]);
-var DropdownContent = function DropdownContent(_ref) {
-  var itemKey = _ref.itemKey,
-    isActive = _ref.isActive,
-    toggleFunc = _ref.toggleFunc;
+var DropdownContent = function DropdownContent(_ref2) {
+  var itemKey = _ref2.itemKey,
+    isActive = _ref2.isActive,
+    toggleFunc = _ref2.toggleFunc;
   var _useContext = (0, _react.useContext)(_headerContext["default"]),
     releaseBranch = _useContext.releaseBranch,
     isLinkExternal = _useContext.isLinkExternal;
   var _useContext2 = (0, _react.useContext)(_headerContext.HamburgerContext),
     closeHamburgerMenu = _useContext2.closeHamburgerMenu;
   var subItemJSX;
-  if (itemKey === _channels.CHANNEL_KEY.category) {
+  if (itemKey === CHANNEL_KEY.category) {
     // category
     subItemJSX = _.map(_categorySet.CATEGORY_ORDER, function (catKey) {
       var label = _categorySet.CATEGORY_LABEL[catKey];
@@ -142,7 +159,7 @@ var DropdownContent = function DropdownContent(_ref) {
     });
   } else {
     // subcategory
-    subItemJSX = _.map(_channels.CHANNEL_DROPDOWN[itemKey], function (subItem, key) {
+    subItemJSX = _.map(CHANNEL_DROPDOWN[itemKey], function (subItem, key) {
       var type = subItem.type;
       var label, path;
       if (type === 'subcategory') {
@@ -168,7 +185,7 @@ var DropdownContent = function DropdownContent(_ref) {
       });
     });
   }
-  var label = _channels.CHANNEL_LABEL[itemKey];
+  var label = CHANNEL_LABEL[itemKey];
   var handleClick = function handleClick() {
     return toggleFunc(itemKey);
   };
@@ -201,17 +218,17 @@ var Content = function Content() {
     activeKey = _useState2[0],
     setActiveKey = _useState2[1];
   var itemLinks = (0, _links.getChannelLinks)(isLinkExternal, releaseBranch);
-  var itemJSX = _.map(_channels.CHANNEL_ORDER, function (itemKey, index) {
+  var itemJSX = _.map(CHANNEL_ORDER, function (itemKey, index) {
     // divider
     if (itemKey === 'divider') {
       return /*#__PURE__*/_react["default"].createElement(DividerContainer, {
         key: index
       }, /*#__PURE__*/_react["default"].createElement(_divider["default"], null));
     }
-    var label = _channels.CHANNEL_LABEL[itemKey];
-    var type = _channels.CHANNEL_TYPE[itemKey];
+    var label = CHANNEL_LABEL[itemKey];
+    var type = CHANNEL_TYPE[itemKey];
     // link type
-    if (type === _channels.CHANNEL_LINK_TYPE) {
+    if (type === CHANNEL_LINK_TYPE) {
       var link = itemLinks && itemLinks[itemKey];
       if (!label || !link) {
         return;
@@ -238,8 +255,8 @@ var Content = function Content() {
   });
   return /*#__PURE__*/_react["default"].createElement(ContentSection, null, itemJSX);
 };
-var HamburgerMenu = function HamburgerMenu(_ref2) {
-  var props = _extends({}, (_objectDestructuringEmpty(_ref2), _ref2));
+var HamburgerMenu = function HamburgerMenu(_ref3) {
+  var props = _extends({}, (_objectDestructuringEmpty(_ref3), _ref3));
   var _useContext5 = (0, _react.useContext)(_headerContext["default"]),
     theme = _useContext5.theme,
     releaseBranch = _useContext5.releaseBranch,

package/lib/constants/channels-new.js

@@ -0,0 +1,69 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = exports.DESKTOP_CHANNEL_ORDER = exports.CHANNEL_TYPE = exports.CHANNEL_PATH = exports.CHANNEL_ORDER = exports.CHANNEL_LINK_TYPE = exports.CHANNEL_LABEL = exports.CHANNEL_KEY = exports.CHANNEL_DROPDOWN_TYPE = exports.CHANNEL_DROPDOWN = void 0;
+var _infogram = require("@twreporter/core/lib/constants/infogram");
+var _categorySet = require("@twreporter/core/lib/constants/category-set");
+var _CHANNEL_PATH, _CHANNEL_LABEL, _CHANNEL_TYPE, _CHANNEL_DROPDOWN;
+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); }
+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(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
+function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
+var channelKey = {
+  latest: 'latest',
+  topic: 'topic',
+  category: 'category',
+  opinion: 'opinion',
+  column: 'column',
+  humanStory: 'human-story',
+  photography: 'photography',
+  podcast: 'podcast',
+  kidsReporter: 'kids-reporter',
+  infographic: 'infographic',
+  lawmaker: 'lawmaker'
+};
+var CHANNEL_KEY = exports.CHANNEL_KEY = channelKey;
+
+// external links are in external-links.js file
+var CHANNEL_PATH = exports.CHANNEL_PATH = (_CHANNEL_PATH = {}, _defineProperty(_CHANNEL_PATH, channelKey.latest, '/latest'), _defineProperty(_CHANNEL_PATH, channelKey.topic, '/topics'), _defineProperty(_CHANNEL_PATH, channelKey.humanStory, '/tags/58db34a30f56b40d001ae6a6'), _defineProperty(_CHANNEL_PATH, channelKey.photography, '/photography'), _defineProperty(_CHANNEL_PATH, channelKey.infographic, "/tags/".concat(_infogram.INFOGRAM_ID)), _CHANNEL_PATH);
+var CHANNEL_LABEL = exports.CHANNEL_LABEL = (_CHANNEL_LABEL = {}, _defineProperty(_CHANNEL_LABEL, channelKey.latest, '最新'), _defineProperty(_CHANNEL_LABEL, channelKey.topic, '深度專題'), _defineProperty(_CHANNEL_LABEL, channelKey.category, '議題'), _defineProperty(_CHANNEL_LABEL, channelKey.opinion, '評論'), _defineProperty(_CHANNEL_LABEL, channelKey.column, '專欄'), _defineProperty(_CHANNEL_LABEL, channelKey.humanStory, '人物故事'), _defineProperty(_CHANNEL_LABEL, channelKey.photography, '影像'), _defineProperty(_CHANNEL_LABEL, channelKey.podcast, 'Podcast'), _defineProperty(_CHANNEL_LABEL, channelKey.kidsReporter, '少年報導者'), _defineProperty(_CHANNEL_LABEL, channelKey.infographic, '數位敘事'), _defineProperty(_CHANNEL_LABEL, channelKey.lawmaker, '報導者觀測站'), _CHANNEL_LABEL);
+var channelLinkType = 'link';
+var channelDropDownType = 'drop-down';
+var CHANNEL_LINK_TYPE = exports.CHANNEL_LINK_TYPE = channelLinkType;
+var CHANNEL_DROPDOWN_TYPE = exports.CHANNEL_DROPDOWN_TYPE = channelDropDownType;
+var CHANNEL_TYPE = exports.CHANNEL_TYPE = (_CHANNEL_TYPE = {}, _defineProperty(_CHANNEL_TYPE, channelKey.latest, channelLinkType), _defineProperty(_CHANNEL_TYPE, channelKey.topic, channelLinkType), _defineProperty(_CHANNEL_TYPE, channelKey.category, channelDropDownType), _defineProperty(_CHANNEL_TYPE, channelKey.opinion, channelDropDownType), _defineProperty(_CHANNEL_TYPE, channelKey.column, channelLinkType), _defineProperty(_CHANNEL_TYPE, channelKey.humanStory, channelLinkType), _defineProperty(_CHANNEL_TYPE, channelKey.photography, channelLinkType), _defineProperty(_CHANNEL_TYPE, channelKey.podcast, channelDropDownType), _defineProperty(_CHANNEL_TYPE, channelKey.kidsReporter, channelLinkType), _defineProperty(_CHANNEL_TYPE, channelKey.infographic, channelLinkType), _defineProperty(_CHANNEL_TYPE, channelKey.lawmaker, channelLinkType), _CHANNEL_TYPE);
+var CHANNEL_DROPDOWN = exports.CHANNEL_DROPDOWN = (_CHANNEL_DROPDOWN = {}, _defineProperty(_CHANNEL_DROPDOWN, channelKey.opinion, [{
+  type: 'subcategory',
+  key: _categorySet.SUBCATEGORY_PATH.bookReview
+}, {
+  type: 'subcategory',
+  key: _categorySet.SUBCATEGORY_PATH.letter
+}, {
+  type: 'subcategory',
+  key: _categorySet.SUBCATEGORY_PATH.all
+}]), _defineProperty(_CHANNEL_DROPDOWN, channelKey.podcast, [{
+  type: 'path',
+  label: '關於報導者 Podcast',
+  path: '/a/podcast-list'
+}, {
+  type: 'subcategory',
+  key: _categorySet.SUBCATEGORY_PATH.theRealStory
+}, {
+  type: 'subcategory',
+  key: _categorySet.SUBCATEGORY_PATH.onTheGround
+}]), _CHANNEL_DROPDOWN);
+var CHANNEL_ORDER = exports.CHANNEL_ORDER = [channelKey.latest, 'divider', channelKey.topic, channelKey.category, channelKey.opinion, channelKey.humanStory, 'divider', channelKey.photography, channelKey.podcast, channelKey.kidsReporter, channelKey.lawmaker, channelKey.infographic, 'divider'];
+var DESKTOP_CHANNEL_ORDER = exports.DESKTOP_CHANNEL_ORDER = [channelKey.latest, channelKey.topic, channelKey.category];
+var _default = exports["default"] = {
+  CHANNEL_LINK_TYPE: CHANNEL_LINK_TYPE,
+  CHANNEL_DROPDOWN_TYPE: CHANNEL_DROPDOWN_TYPE,
+  CHANNEL_PATH: CHANNEL_PATH,
+  CHANNEL_LABEL: CHANNEL_LABEL,
+  CHANNEL_TYPE: CHANNEL_TYPE,
+  CHANNEL_ORDER: CHANNEL_ORDER,
+  DESKTOP_CHANNEL_ORDER: DESKTOP_CHANNEL_ORDER,
+  CHANNEL_KEY: CHANNEL_KEY,
+  CHANNEL_DROPDOWN: CHANNEL_DROPDOWN
+};

package/lib/constants/channels.js

@@ -62,5 +62,7 @@ var _default = exports["default"] = {
   CHANNEL_LABEL: CHANNEL_LABEL,
   CHANNEL_TYPE: CHANNEL_TYPE,
   CHANNEL_ORDER: CHANNEL_ORDER,
-  DESKTOP_CHANNEL_ORDER: DESKTOP_CHANNEL_ORDER
+  DESKTOP_CHANNEL_ORDER: DESKTOP_CHANNEL_ORDER,
+  CHANNEL_KEY: CHANNEL_KEY,
+  CHANNEL_DROPDOWN: CHANNEL_DROPDOWN
 };

package/lib/constants/external-links.js

@@ -15,6 +15,7 @@ var links = {
   twitter: 'https://twitter.com/tw_reporter_org',
   youtube: 'https://www.youtube.com/c/TwreporterOrg',
   kidsReporter: 'https://kids.twreporter.org/',
-  publicationAndMerchandise: 'https://twreporter.waca.ec/'
+  publicationAndMerchandise: 'https://twreporter.waca.ec/',
+  lawmaker: 'https://lawmaker.twreporter.org/'
 };
 var _default = exports["default"] = links;

package/lib/utils/links.js

@@ -24,6 +24,7 @@ var _channels = require("../constants/channels");
 var _externalLinks = _interopRequireDefault(require("../constants/external-links"));
 var _requestOrigins = _interopRequireDefault(require("@twreporter/core/lib/constants/request-origins"));
 var _releaseBranch = _interopRequireDefault(require("@twreporter/core/lib/constants/release-branch"));
+var _featureFlag = require("@twreporter/core/lib/constants/feature-flag");
 var _forEach = _interopRequireDefault(require("lodash/forEach"));
 var _reduce = _interopRequireDefault(require("lodash/reduce"));
 var _split = _interopRequireDefault(require("lodash/split"));
@@ -178,6 +179,9 @@ function getChannelLinks() {
     return res;
   }, {});
   links[_channels.CHANNEL_KEY.kidsReporter] = __composeExternalLink(__getExternalLinks().kidsReporter, '_blank');
+  if (_featureFlag.LAWMAKER) {
+    links[_channels.CHANNEL_KEY.lawmaker] = __composeExternalLink(__getExternalLinks().lawmaker, '_blank');
+  }
   return links;
 }
 function getTabBarLinks() {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@twreporter/universal-header",
-  "version": "3.0.17",
+  "version": "3.1.0-rc.1",
   "description": "Universal header of TWReporter sites",
   "main": "lib/index.js",
   "scripts": {
@@ -22,8 +22,8 @@
   "dependencies": {
     "@material-symbols/svg-400": "^0.27.2",
     "@reduxjs/toolkit": "^2.2.5",
-    "@twreporter/core": "^1.25.0",
-    "@twreporter/react-components": "^9.8.0",
+    "@twreporter/core": "^1.26.0-rc.0",
+    "@twreporter/react-components": "^9.8.1-rc.1",
     "lodash": "^4.17.11",
     "prop-types": "^15.6.2",
     "querystring": "^0.2.0",
@@ -58,5 +58,5 @@
     "react-dom": "^18.2.0",
     "storybook": "^8.1.11"
   },
-  "gitHead": "9f07f03e73804fdfed6ec077ce352cb4db791a84"
+  "gitHead": "666a7b9c16a5e8ba895e1a722598359b69909d6c"
 }