@capillarytech/creatives-library 6.4.0 → 6.5.0

package/app.js

@@ -6,6 +6,8 @@ import createHistory from 'history/lib/createBrowserHistory';
 import { applyRouterMiddleware, Router, useRouterHistory } from 'react-router';
 import { syncHistoryWithStore } from 'react-router-redux';
 import { useScroll } from 'react-router-scroll';
+import Bugsnag from '@bugsnag/js';
+import BugsnagPluginReact from '@bugsnag/plugin-react';
 import CapV2 from 'v2Containers/Cap';
 import Cap from 'containers/Cap';
 import { LocaleProvider } from 'antd';
@@ -35,6 +37,53 @@ const history = syncHistoryWithStore(browserHistory, store, {
   selectLocationState: makeSelectLocationState(),
 });
 
+const bugSnagErrorCallback = event => {
+  let userId;
+  let userName;
+  let userEmail;
+  let orgId;
+  let orgName;
+  try {
+    const {
+      id,
+      firstName,
+      lastName,
+      loginName,
+      proxyOrgList,
+    } = JSON.parse(window.localStorage.getItem('user'));
+    orgId = window.localStorage.getItem('orgID');
+    userId = id;
+    userName = `${firstName} ${lastName}`;
+    userEmail = loginName;
+    orgName = proxyOrgList.find(({orgID}) => orgID === Number(orgId)).orgName;
+  } catch (error) {
+    userId = '';
+    userName = '';
+    userEmail = '';
+    orgId = '';
+    orgName = '';
+  }
+  event.addMetadata('org', {
+    name: orgName,
+    id: orgId,
+  })
+  event.setUser(userId, userEmail, userName);
+};
+
+Bugsnag.start({
+  // eslint-disable-next-line no-undef
+  appVersion: BUGSNAG_APP_VERSION,
+  // eslint-disable-next-line no-undef
+  apiKey: BUGSNAG_API_KEY,
+  releaseStage: window.location.hostname,
+  plugins: [new BugsnagPluginReact()],
+  onError: bugSnagErrorCallback,
+});
+
+const ErrorBoundary = Bugsnag.getPlugin('react').createErrorBoundary(React);
+
+export const BugsnagClient = Bugsnag;
+
 const rootRoute = {
   component: (props) => {
     // eslint-disable-next-line react/prop-types
@@ -46,20 +95,24 @@ const rootRoute = {
   childRoutes: createRoutes(store),
 };
 
+const ErrorScreen = () => <React.Fragment />;
+
 const render = (messages) => {
   ReactDOM.render(
     <Provider store={store}>
       <LocaleProvider>
-        <LanguageProvider messages={messages}>
-          <div>
-            <Router
-              history={(history)}
-              routes={rootRoute}
-              render={applyRouterMiddleware(useScroll())
-              }
-            />
-          </div>
-        </LanguageProvider>
+        <ErrorBoundary FallbackComponent={ErrorScreen}>
+          <LanguageProvider messages={messages}>
+            <div>
+              <Router
+                history={(history)}
+                routes={rootRoute}
+                render={applyRouterMiddleware(useScroll())
+                }
+              />
+            </div>
+          </LanguageProvider>
+        </ErrorBoundary>
       </LocaleProvider>
     </Provider>,
     document.getElementById('app')

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@capillarytech/creatives-library",
   "author": "meharaj",
-  "version": "6.4.0",
+  "version": "6.5.0",
   "description": "Capillary creatives ui",
   "main": "./index.js",
   "module": "./index.es.js",
@@ -13,7 +13,9 @@
   "license": "LicenseRef-LICENSE",
   "dependencies": {
     "@babel/polyfill": "7.4.3",
-    "@capillarytech/cap-ui-utils": "1.2.4",
+    "@bugsnag/js": "^7.2.1",
+    "@bugsnag/plugin-react": "^7.2.1",
+    "@capillarytech/cap-ui-utils": "1.2.6",
     "babel-cli": "^6.26.0",
     "chalk": "1.1.3",
     "jquery": "^3.3.1",
@@ -28,6 +30,7 @@
     "redux-immutable": "3.0.8",
     "reselect": "2.5.4",
     "styled-components": "^3.2.1",
-    "whatwg-fetch": "2.0.1"
+    "whatwg-fetch": "2.0.1",
+    "webpack-bugsnag-plugins": "^1.4.3"
   }
 }

package/v2Containers/MobilePush/Edit/index.js

@@ -343,16 +343,16 @@ export class Edit extends React.Component { // eslint-disable-line react/prefer-
       licenseCode: selectedWeChatAccount.sourceAccountIdentifier,
     };
     if (this.props.location.query && this.props.location.query.module !== 'dvs') {
-      obj.definition.mode = this.props.Edit.templateDetails.mode || get(this, 'props.Edit.templateDetails.definition.mode');
+      obj.definition.mode = get(this, 'props.Edit.templateDetails.mode', '') || get(this, 'props.Edit.templateDetails.definition.mode', '');
     }
     const android = {};
-    Object.keys(formData[0]).forEach((data) => {
+    Object.keys(formData[0] || {}).forEach((data) => {
       if (!!formData[0][data] && data !== "tabKey") {
         android[data] = formData[0][data];
       }
     });
     const ios = {};
-    Object.keys(formData[1]).forEach((data) => {
+    Object.keys(formData[1] || {}).forEach((data) => {
       if (!!formData[1][data] && data !== "tabKey") {
         ios[data] = formData[1][data];
       }