@plusscommunities/pluss-newsletter-web-sharing 1.3.10 → 1.4.2

package/dist/index.cjs.js

@@ -65,7 +65,6 @@ var $__default = /*#__PURE__*/_interopDefaultLegacy($);
 var _extends__default = /*#__PURE__*/_interopDefaultLegacy(_extends);
 var NewsletterPreview__default = /*#__PURE__*/_interopDefaultLegacy(NewsletterPreview);
 
-// import * as PlussCore from '../../pluss-core/src';
 var values = {
   featureKey: 'sharing',
   serviceKey: 'newsletterSharing',
@@ -159,6 +158,8 @@ var values = {
   textPermissionNewsletterManagement: 'Sharing Management',
   textPermissionNewsletterSubmission: 'Sharing Submission (Approval Required)'
 };
+
+// import * as PlussCore from '../../pluss-core/src';
 var FeatureConfig = {
   key: values.featureKey,
   singularName: values.textSingularName,
@@ -328,6 +329,7 @@ var TextFormatPopup = Components$1.TextFormatPopup;
 var OptionsSection = Components$1.OptionsSection;
 var FileInput = Components$1.FileInput;
 var Popup = Components$1.Popup;
+var HubSidebar = Components$1.HubSidebar;
 
 var Session = PlussCore__namespace.Session;
 var isTheBest = Session.isTheBest;
@@ -653,9 +655,9 @@ var getAnalyticsFilterOptions = Analytics.getAnalyticsFilterOptions; // Colours
 
 var COLOUR_BRANDING_MAIN = Colours.COLOUR_BRANDING_MAIN;
 var COLOUR_BRANDING_OFF = Colours.COLOUR_BRANDING_OFF;
-var COLOUR_BRANDING_ACTION = Colours.COLOUR_BRANDING_ACTION;
+Colours.COLOUR_BRANDING_ACTION;
 var COLOUR_BRANDING_APP = Colours.COLOUR_BRANDING_APP;
-var TEXT_LIGHT = Colours.TEXT_LIGHT; // Misc
+Colours.TEXT_LIGHT; // Misc
 
 var hideChat = Helper$1.hideChat;
 
@@ -1348,7 +1350,7 @@ var NewsletterSubmissions$1 = reactRedux.connect(mapStateToProps$8, {
 
 var Config = PlussCore__namespace.Config;
 var UTC_OFFSET = Config.env.utcOffset;
-var hasAvailableNews = Config.env.hasAvailableNews;
+Config.env.hasAvailableNews;
 var newsHaveTags = Config.env.newsHaveTags;
 var DEFAULT_ALLOW_COMMENTS = Config.env.defaultAllowComments;
 var logo = Config.env.logo;
@@ -1914,8 +1916,14 @@ var NewsHub = /*#__PURE__*/function (_Component) {
       _this.props.history.push(values.routeGenerateNewsletter);
     });
 
+    _defineProperty__default['default'](_assertThisInitialized__default['default'](_this), "addNew", function () {
+      if (validateAccess(_this.props.auth.site, values.permissionNewsletter, _this.props.auth) || validateAccess(_this.props.auth.site, values.permissionNewsletterSubmit, _this.props.auth)) {
+        _this.props.history.push(values.routeAddNewsletterEntry);
+      }
+    });
+
     var params = getUrlParams();
-    var selectedSection = 'thisMonth';
+    var selectedSection = 'all';
 
     if (params.tab) {
       selectedSection = params.tab;
@@ -2014,13 +2022,6 @@ var NewsHub = /*#__PURE__*/function (_Component) {
         });
       });
     }
-  }, {
-    key: "addNew",
-    value: function addNew() {
-      if (validateAccess(this.props.auth.site, values.permissionNewsletter, this.props.auth) || validateAccess(this.props.auth.site, values.permissionNewsletterSubmit, this.props.auth)) {
-        this.props.history.push(values.routeAddNewsletterEntry);
-      }
-    }
   }, {
     key: "canAddNew",
     value: function canAddNew(isClass) {
@@ -2054,105 +2055,78 @@ var NewsHub = /*#__PURE__*/function (_Component) {
     value: function renderLeftBar() {
       var _this4 = this;
 
-      if (validateAccess(this.props.auth.site, values.permissionNewsletterSubmit, this.props.auth) && !validateAccess(this.props.auth.site, values.permissionNewsletter, this.props.auth)) {
-        return null;
+      var sectionItems = [];
+
+      if (this.canAddNew()) {
+        sectionItems.push({
+          type: 'newButton',
+          text: 'New Post',
+          onClick: this.addNew
+        });
       }
 
-      return /*#__PURE__*/React__default['default'].createElement("div", {
-        className: "hub-sideContent"
-      }, /*#__PURE__*/React__default['default'].createElement("div", {
-        className: "hub-sideContent-topButton"
-      }), /*#__PURE__*/React__default['default'].createElement("div", {
-        style: {
-          paddingLeft: 15,
-          width: '100%'
-        }
-      }, /*#__PURE__*/React__default['default'].createElement("div", {
-        className: "fontMedium fontSize-36 text-dark",
-        style: styles$4.sideBarTitleSection
-      }, values.textTitleNews), /*#__PURE__*/React__default['default'].createElement("div", {
-        onClick: function onClick() {
-          _this4.setState({
-            selectedSection: 'Analytics'
-          });
-        },
-        className: "sideBarSection",
-        style: this.getSideBarSectionColour('Analytics')
-      }, /*#__PURE__*/React__default['default'].createElement("div", {
-        className: "fontMedium fontSize-36 text-dark",
-        style: {
-          lineHeight: '50px'
-        }
-      }, /*#__PURE__*/React__default['default'].createElement(FontAwesome__default['default'], {
-        name: "line-chart",
-        className: "sideBarSection__icon"
-      })), /*#__PURE__*/React__default['default'].createElement("div", {
-        className: "fontRegular fontSize-16 text-light lineHeight-22"
-      }, "Analytics")), /*#__PURE__*/React__default['default'].createElement("div", {
+      sectionItems.push({
+        type: 'navItem',
+        text: 'View Posts',
+        icon: 'eye',
+        isFontAwesome: true,
+        selected: this.state.selectedSection === 'all',
         onClick: function onClick() {
           _this4.setState({
             selectedSection: 'all'
           });
-        },
-        className: "sideBarSection",
-        style: this.getSideBarSectionColour('all')
-      }, /*#__PURE__*/React__default['default'].createElement("div", {
-        className: "fontMedium fontSize-36 text-dark",
-        style: {
-          lineHeight: '50px'
-        }
-      }, this.renderStats(this.state.allList.length, this.state.loadingAll)), /*#__PURE__*/React__default['default'].createElement("div", {
-        className: "fontRegular fontSize-16 text-light lineHeight-22"
-      }, "All posts")), /*#__PURE__*/React__default['default'].createElement("div", {
-        onClick: function onClick() {
-          _this4.setState({
-            selectedSection: 'thisMonth'
-          });
-        },
-        className: "sideBarSection",
-        style: this.getSideBarSectionColour('thisMonth')
-      }, /*#__PURE__*/React__default['default'].createElement("div", {
-        className: "fontMedium fontSize-36 text-dark",
-        style: {
-          lineHeight: '50px'
         }
-      }, this.renderStats(this.state.thisMonth.length, this.state.loadingAll)), /*#__PURE__*/React__default['default'].createElement("div", {
-        className: "fontRegular fontSize-16 text-light lineHeight-22"
-      }, "This month")), this.props.auth.site !== 'hq' && validateAccess(this.props.auth.site, values.permissionNewsletter, this.props.auth) && /*#__PURE__*/React__default['default'].createElement("div", {
+      });
+      sectionItems.push({
+        type: 'navItem',
+        text: 'Analytics',
+        icon: 'line-chart',
+        isFontAwesome: true,
+        selected: this.state.selectedSection === 'Analytics',
         onClick: function onClick() {
           _this4.setState({
-            selectedSection: 'submissions'
+            selectedSection: 'Analytics'
           });
-        },
-        className: "sideBarSection",
-        style: this.getSideBarSectionColour('submissions')
-      }, /*#__PURE__*/React__default['default'].createElement("div", {
-        className: "fontMedium fontSize-36",
-        style: {
-          lineHeight: '50px',
-          color: !this.state.loadingSubmissions && this.state.submissionEntries.length > 0 ? COLOUR_BRANDING_ACTION : TEXT_LIGHT
         }
-      }, this.renderStats(this.state.submissionEntries.length, this.state.loadingSubmissions)), /*#__PURE__*/React__default['default'].createElement("div", {
-        className: "fontRegular fontSize-16 text-light lineHeight-22"
-      }, "Submissions")), hasAvailableNews && /*#__PURE__*/React__default['default'].createElement("div", {
-        onClick: function onClick() {
-          _this4.setState({
-            selectedSection: 'available'
-          });
-        },
-        className: "sideBarSection",
-        style: this.getSideBarSectionColour('available')
-      }, /*#__PURE__*/React__default['default'].createElement("div", {
-        className: "fontMedium fontSize-36 text-dark",
-        style: {
-          lineHeight: '50px'
+      });
+
+      if (validateAccess(this.props.auth.site, values.permissionNewsletter, this.props.auth)) {
+        var submissionText = 'View Submissions';
+
+        if (!this.state.loadingSubmissions) {
+          submissionText = "View Submission".concat(getPluralS(this.state.submissionEntries.length), " (").concat(this.state.submissionEntries.length, ")");
         }
-      }, /*#__PURE__*/React__default['default'].createElement(FontAwesome__default['default'], {
-        name: "newspaper-o",
-        className: "sideBarSection__icon"
-      })), /*#__PURE__*/React__default['default'].createElement("div", {
-        className: "fontRegular fontSize-16 text-light lineHeight-22"
-      }, "Available posts"))));
+
+        sectionItems.push({
+          type: 'navItem',
+          text: submissionText,
+          // icon: 'question-circle-o',
+          // isFontAwesome: true,
+          selected: this.state.selectedSection === 'submissions',
+          onClick: function onClick() {
+            _this4.setState({
+              selectedSection: 'submissions'
+            });
+          }
+        });
+      }
+
+      if (isTheBest(this.props.auth, true)) {
+        sectionItems.push({
+          type: 'navItem',
+          text: values.textPrintNewsletter,
+          // icon: 'print',
+          // isFontAwesome: true,
+          onClick: this.goToGenerate
+        });
+      }
+
+      return /*#__PURE__*/React__default['default'].createElement(HubSidebar, {
+        sections: [{
+          title: values.textTitleNews,
+          items: sectionItems
+        }]
+      });
     }
   }, {
     key: "renderEventSubmitButton",
@@ -2221,17 +2195,7 @@ var NewsHub = /*#__PURE__*/function (_Component) {
         className: "hub-wrapperContainer"
       }, this.renderLeftBar(), /*#__PURE__*/React__default['default'].createElement("div", {
         className: "hub-headerContentWrapper"
-      }, /*#__PURE__*/React__default['default'].createElement(Header, null, this.canAddNew() && /*#__PURE__*/React__default['default'].createElement(AddButton, {
-        onClick: this.addNew.bind(this),
-        text: "NEW POST"
-      }), isTheBest(this.props.auth, true) && /*#__PURE__*/React__default['default'].createElement(Button, {
-        leftIcon: "print",
-        buttonType: "outlined",
-        onClick: this.goToGenerate,
-        narrow: true,
-        isActive: true,
-        className: "marginLeft-16"
-      }, values.textPrintNewsletter)), /*#__PURE__*/React__default['default'].createElement("div", {
+      }, /*#__PURE__*/React__default['default'].createElement(Header, null), /*#__PURE__*/React__default['default'].createElement("div", {
         className: "hub-contentWrapper"
       }, this.renderRight())));
     }

package/dist/index.esm.js

@@ -21,7 +21,6 @@ import { v4 } from 'uuid';
 import _extends from '@babel/runtime/helpers/extends';
 import NewsletterPreview from 'make-pluss-newsletter';
 
-// import * as PlussCore from '../../pluss-core/src';
 var values = {
   featureKey: 'sharing',
   serviceKey: 'newsletterSharing',
@@ -115,6 +114,8 @@ var values = {
   textPermissionNewsletterManagement: 'Sharing Management',
   textPermissionNewsletterSubmission: 'Sharing Submission (Approval Required)'
 };
+
+// import * as PlussCore from '../../pluss-core/src';
 var FeatureConfig = {
   key: values.featureKey,
   singularName: values.textSingularName,
@@ -284,6 +285,7 @@ var TextFormatPopup = Components$1.TextFormatPopup;
 var OptionsSection = Components$1.OptionsSection;
 var FileInput = Components$1.FileInput;
 var Popup = Components$1.Popup;
+var HubSidebar = Components$1.HubSidebar;
 
 var Session = PlussCore.Session;
 var isTheBest = Session.isTheBest;
@@ -609,9 +611,9 @@ var getAnalyticsFilterOptions = Analytics.getAnalyticsFilterOptions; // Colours
 
 var COLOUR_BRANDING_MAIN = Colours.COLOUR_BRANDING_MAIN;
 var COLOUR_BRANDING_OFF = Colours.COLOUR_BRANDING_OFF;
-var COLOUR_BRANDING_ACTION = Colours.COLOUR_BRANDING_ACTION;
+Colours.COLOUR_BRANDING_ACTION;
 var COLOUR_BRANDING_APP = Colours.COLOUR_BRANDING_APP;
-var TEXT_LIGHT = Colours.TEXT_LIGHT; // Misc
+Colours.TEXT_LIGHT; // Misc
 
 var hideChat = Helper$1.hideChat;
 
@@ -1304,7 +1306,7 @@ var NewsletterSubmissions$1 = connect(mapStateToProps$8, {
 
 var Config = PlussCore.Config;
 var UTC_OFFSET = Config.env.utcOffset;
-var hasAvailableNews = Config.env.hasAvailableNews;
+Config.env.hasAvailableNews;
 var newsHaveTags = Config.env.newsHaveTags;
 var DEFAULT_ALLOW_COMMENTS = Config.env.defaultAllowComments;
 var logo = Config.env.logo;
@@ -1870,8 +1872,14 @@ var NewsHub = /*#__PURE__*/function (_Component) {
       _this.props.history.push(values.routeGenerateNewsletter);
     });
 
+    _defineProperty(_assertThisInitialized(_this), "addNew", function () {
+      if (validateAccess(_this.props.auth.site, values.permissionNewsletter, _this.props.auth) || validateAccess(_this.props.auth.site, values.permissionNewsletterSubmit, _this.props.auth)) {
+        _this.props.history.push(values.routeAddNewsletterEntry);
+      }
+    });
+
     var params = getUrlParams();
-    var selectedSection = 'thisMonth';
+    var selectedSection = 'all';
 
     if (params.tab) {
       selectedSection = params.tab;
@@ -1970,13 +1978,6 @@ var NewsHub = /*#__PURE__*/function (_Component) {
         });
       });
     }
-  }, {
-    key: "addNew",
-    value: function addNew() {
-      if (validateAccess(this.props.auth.site, values.permissionNewsletter, this.props.auth) || validateAccess(this.props.auth.site, values.permissionNewsletterSubmit, this.props.auth)) {
-        this.props.history.push(values.routeAddNewsletterEntry);
-      }
-    }
   }, {
     key: "canAddNew",
     value: function canAddNew(isClass) {
@@ -2010,105 +2011,78 @@ var NewsHub = /*#__PURE__*/function (_Component) {
     value: function renderLeftBar() {
       var _this4 = this;
 
-      if (validateAccess(this.props.auth.site, values.permissionNewsletterSubmit, this.props.auth) && !validateAccess(this.props.auth.site, values.permissionNewsletter, this.props.auth)) {
-        return null;
+      var sectionItems = [];
+
+      if (this.canAddNew()) {
+        sectionItems.push({
+          type: 'newButton',
+          text: 'New Post',
+          onClick: this.addNew
+        });
       }
 
-      return /*#__PURE__*/React.createElement("div", {
-        className: "hub-sideContent"
-      }, /*#__PURE__*/React.createElement("div", {
-        className: "hub-sideContent-topButton"
-      }), /*#__PURE__*/React.createElement("div", {
-        style: {
-          paddingLeft: 15,
-          width: '100%'
-        }
-      }, /*#__PURE__*/React.createElement("div", {
-        className: "fontMedium fontSize-36 text-dark",
-        style: styles$4.sideBarTitleSection
-      }, values.textTitleNews), /*#__PURE__*/React.createElement("div", {
-        onClick: function onClick() {
-          _this4.setState({
-            selectedSection: 'Analytics'
-          });
-        },
-        className: "sideBarSection",
-        style: this.getSideBarSectionColour('Analytics')
-      }, /*#__PURE__*/React.createElement("div", {
-        className: "fontMedium fontSize-36 text-dark",
-        style: {
-          lineHeight: '50px'
-        }
-      }, /*#__PURE__*/React.createElement(FontAwesome, {
-        name: "line-chart",
-        className: "sideBarSection__icon"
-      })), /*#__PURE__*/React.createElement("div", {
-        className: "fontRegular fontSize-16 text-light lineHeight-22"
-      }, "Analytics")), /*#__PURE__*/React.createElement("div", {
+      sectionItems.push({
+        type: 'navItem',
+        text: 'View Posts',
+        icon: 'eye',
+        isFontAwesome: true,
+        selected: this.state.selectedSection === 'all',
         onClick: function onClick() {
           _this4.setState({
             selectedSection: 'all'
           });
-        },
-        className: "sideBarSection",
-        style: this.getSideBarSectionColour('all')
-      }, /*#__PURE__*/React.createElement("div", {
-        className: "fontMedium fontSize-36 text-dark",
-        style: {
-          lineHeight: '50px'
-        }
-      }, this.renderStats(this.state.allList.length, this.state.loadingAll)), /*#__PURE__*/React.createElement("div", {
-        className: "fontRegular fontSize-16 text-light lineHeight-22"
-      }, "All posts")), /*#__PURE__*/React.createElement("div", {
-        onClick: function onClick() {
-          _this4.setState({
-            selectedSection: 'thisMonth'
-          });
-        },
-        className: "sideBarSection",
-        style: this.getSideBarSectionColour('thisMonth')
-      }, /*#__PURE__*/React.createElement("div", {
-        className: "fontMedium fontSize-36 text-dark",
-        style: {
-          lineHeight: '50px'
         }
-      }, this.renderStats(this.state.thisMonth.length, this.state.loadingAll)), /*#__PURE__*/React.createElement("div", {
-        className: "fontRegular fontSize-16 text-light lineHeight-22"
-      }, "This month")), this.props.auth.site !== 'hq' && validateAccess(this.props.auth.site, values.permissionNewsletter, this.props.auth) && /*#__PURE__*/React.createElement("div", {
+      });
+      sectionItems.push({
+        type: 'navItem',
+        text: 'Analytics',
+        icon: 'line-chart',
+        isFontAwesome: true,
+        selected: this.state.selectedSection === 'Analytics',
         onClick: function onClick() {
           _this4.setState({
-            selectedSection: 'submissions'
+            selectedSection: 'Analytics'
           });
-        },
-        className: "sideBarSection",
-        style: this.getSideBarSectionColour('submissions')
-      }, /*#__PURE__*/React.createElement("div", {
-        className: "fontMedium fontSize-36",
-        style: {
-          lineHeight: '50px',
-          color: !this.state.loadingSubmissions && this.state.submissionEntries.length > 0 ? COLOUR_BRANDING_ACTION : TEXT_LIGHT
         }
-      }, this.renderStats(this.state.submissionEntries.length, this.state.loadingSubmissions)), /*#__PURE__*/React.createElement("div", {
-        className: "fontRegular fontSize-16 text-light lineHeight-22"
-      }, "Submissions")), hasAvailableNews && /*#__PURE__*/React.createElement("div", {
-        onClick: function onClick() {
-          _this4.setState({
-            selectedSection: 'available'
-          });
-        },
-        className: "sideBarSection",
-        style: this.getSideBarSectionColour('available')
-      }, /*#__PURE__*/React.createElement("div", {
-        className: "fontMedium fontSize-36 text-dark",
-        style: {
-          lineHeight: '50px'
+      });
+
+      if (validateAccess(this.props.auth.site, values.permissionNewsletter, this.props.auth)) {
+        var submissionText = 'View Submissions';
+
+        if (!this.state.loadingSubmissions) {
+          submissionText = "View Submission".concat(getPluralS(this.state.submissionEntries.length), " (").concat(this.state.submissionEntries.length, ")");
         }
-      }, /*#__PURE__*/React.createElement(FontAwesome, {
-        name: "newspaper-o",
-        className: "sideBarSection__icon"
-      })), /*#__PURE__*/React.createElement("div", {
-        className: "fontRegular fontSize-16 text-light lineHeight-22"
-      }, "Available posts"))));
+
+        sectionItems.push({
+          type: 'navItem',
+          text: submissionText,
+          // icon: 'question-circle-o',
+          // isFontAwesome: true,
+          selected: this.state.selectedSection === 'submissions',
+          onClick: function onClick() {
+            _this4.setState({
+              selectedSection: 'submissions'
+            });
+          }
+        });
+      }
+
+      if (isTheBest(this.props.auth, true)) {
+        sectionItems.push({
+          type: 'navItem',
+          text: values.textPrintNewsletter,
+          // icon: 'print',
+          // isFontAwesome: true,
+          onClick: this.goToGenerate
+        });
+      }
+
+      return /*#__PURE__*/React.createElement(HubSidebar, {
+        sections: [{
+          title: values.textTitleNews,
+          items: sectionItems
+        }]
+      });
     }
   }, {
     key: "renderEventSubmitButton",
@@ -2177,17 +2151,7 @@ var NewsHub = /*#__PURE__*/function (_Component) {
         className: "hub-wrapperContainer"
       }, this.renderLeftBar(), /*#__PURE__*/React.createElement("div", {
         className: "hub-headerContentWrapper"
-      }, /*#__PURE__*/React.createElement(Header, null, this.canAddNew() && /*#__PURE__*/React.createElement(AddButton, {
-        onClick: this.addNew.bind(this),
-        text: "NEW POST"
-      }), isTheBest(this.props.auth, true) && /*#__PURE__*/React.createElement(Button, {
-        leftIcon: "print",
-        buttonType: "outlined",
-        onClick: this.goToGenerate,
-        narrow: true,
-        isActive: true,
-        className: "marginLeft-16"
-      }, values.textPrintNewsletter)), /*#__PURE__*/React.createElement("div", {
+      }, /*#__PURE__*/React.createElement(Header, null), /*#__PURE__*/React.createElement("div", {
         className: "hub-contentWrapper"
       }, this.renderRight())));
     }