Merge pull request #456 from giranm/release/0.6.0-beta.0

.github/workflows/cd-workflow.yml

@@ -27,7 +27,7 @@ jobs:
       - name: Set-up Node
         uses: actions/setup-node@v1
         with:
-          node-version: '16.13.0'
+          node-version: '16.19.0'
       - name: Install Yarn
         run: npm install -g yarn
       - name: Get yarn cache directory path

.github/workflows/test-workflow.yml

@@ -42,7 +42,7 @@ jobs:
     needs: build-id
     runs-on: ubuntu-latest
     container:
-      image: cypress/browsers:node16.13.0-chrome95-ff94
+      image: cypress/browsers:node16.16.0-chrome107-ff107
       options: --user 1001
     strategy:
       fail-fast: false

.tool-versions

@@ -1,2 +1,2 @@
 # MUST match .node-version
-nodejs 16.13.0
+nodejs 16.19.0

README.md

@@ -30,7 +30,7 @@ If you wish to maintain + deploy your own version of PagerDuty Live, we recommen
 
 #### Local Development
 
-1. Install [NodeJS v16.13](https://nodejs.org/tr/blog/release/v16.13.0/) via [`asdf install`](https://github.com/asdf-vm/asdf) / [`nvm`](https://github.com/nvm-sh/nvm)
+1. Install [NodeJS v16.19](https://nodejs.org/tr/blog/release/v16.19.0/) via [`asdf install`](https://github.com/asdf-vm/asdf) / [`nvm`](https://github.com/nvm-sh/nvm)
 
 2. `$ git clone` repo to desired destination and `$ cd pd-live-react` into directory
 

cypress/e2e/Query/query.spec.js

@@ -8,6 +8,7 @@ import {
 import {
   acceptDisclaimer,
   waitForIncidentTable,
+  updateAutoAcceptIncidentQuery,
   activateButton,
   deactivateButton,
   checkIncidentCellContentAllRows,
@@ -43,7 +44,7 @@ describe('Query Incidents', { failFast: { enabled: false } }, () => {
   });
 
   it('Query for incidents within T-1 since date', () => {
-    // Limit dataset to resolved low-urgency incidents
+    // Limit dataset to high-urgency triggered, ackd and resolved incidents
     activateButton('query-status-resolved-button');
     deactivateButton('query-urgency-low-button');
 
@@ -66,16 +67,27 @@ describe('Query Incidents', { failFast: { enabled: false } }, () => {
       }
     });
 
-    // Reset query for next test
+    // Reset query for next test - both high and low-urgency triggered, ackd and resolved incidents
     activateButton('query-urgency-low-button');
   });
 
-  it('Query for incidents exceeding MAX_INCIDENTS_LIMIT; Cancel Request', () => {
+  it('Query for incidents exceeding MAX_INCIDENTS_LIMIT with auto accept incident query on', () => {
     // Update since date to T-2
     const queryDate = moment()
       .subtract(2, 'days')
       .set({ hour: 0, minute: 0, second: 0, millisecond: 0 });
     cy.get('#query-date-input').clear().type(queryDate.format('DD/MM/yyyy')).type('{enter}');
+    waitForIncidentTable();
+  });
+
+  it('Query for incidents exceeding MAX_INCIDENTS_LIMIT with auto accept incident query off; Cancel Request', () => {
+    // Set auto accept incident query to false to test cancel & allow request
+    updateAutoAcceptIncidentQuery(false);
+    // Update since date to T-3
+    const queryDate = moment()
+    .subtract(3, 'days')
+    .set({ hour: 0, minute: 0, second: 0, millisecond: 0 });
+    cy.get('#query-date-input').clear().type(queryDate.format('DD/MM/yyyy')).type('{enter}');
 
     // Cancel request from modal
     cy.get('#cancel-incident-query-button').click();
@@ -88,7 +100,7 @@ describe('Query Incidents', { failFast: { enabled: false } }, () => {
     deactivateButton('query-status-resolved-button');
   });
 
-  it('Query for incidents exceeding MAX_INCIDENTS_LIMIT; Accept Request', () => {
+  it('Query for incidents exceeding MAX_INCIDENTS_LIMIT with auto accept incident query off; Accept Request', () => {
     // Accept request from modal
     activateButton('query-status-resolved-button');
     cy.get('#retrieve-incident-query-button').click();
@@ -104,6 +116,8 @@ describe('Query Incidents', { failFast: { enabled: false } }, () => {
       .set({ hour: 0, minute: 0, second: 0, millisecond: 0 });
     cy.get('#query-date-input').clear().type(queryDate.format('DD/MM/yyyy')).type('{enter}');
     waitForIncidentTable();
+    // Reset auto accept incident query to true
+    updateAutoAcceptIncidentQuery(true);
   });
 
   it('Query for triggered incidents only', () => {

cypress/e2e/Settings/settings.spec.js

@@ -11,6 +11,7 @@ import {
   updateUserLocale,
   updateDefaultSinceDateLookback,
   updateMaxIncidentsLimit,
+  updateMaxRateLimit,
   updateAutoAcceptIncidentQuery,
   updateAutoRefreshInterval,
   manageIncidentTableColumns,
@@ -90,6 +91,17 @@ describe('Manage Settings', { failFast: { enabled: false } }, () => {
       ).to.equal(maxIncidentsLimit));
   });
 
+  it('Update max rate limit', () => {
+    const maxRateLimit = faker.datatype.number({ min: 100, max: 1000 });
+    updateMaxRateLimit(maxRateLimit);
+    cy.window()
+      .its('store')
+      .invoke('getState')
+      .then((state) => expect(
+        Number(state.settings.maxRateLimit),
+      ).to.equal(maxRateLimit));
+  });
+
   it('Update auto-accept incident query', () => {
     [true, false].forEach((autoAcceptIncidentsQuery) => {
       updateAutoAcceptIncidentQuery(autoAcceptIncidentsQuery);

cypress/support/util/common.js

@@ -277,6 +277,18 @@ export const updateMaxIncidentsLimit = (limit = 200) => {
   cy.get('.close').click();
 };
 
+export const updateMaxRateLimit = (limit = 200) => {
+  cy.get('.settings-panel-dropdown').click();
+  cy.get('.dropdown-item').contains('Settings').click();
+  cy.get('.nav-item').contains('User Profile').click();
+
+  cy.get('#user-profile-max-rate-limit-input').clear().type(`${limit}{enter}`);
+
+  cy.get('.btn').contains('Update User Profile').click();
+  checkActionAlertsModalContent('Updated user profile settings');
+  cy.get('.close').click();
+};
+
 export const updateAutoAcceptIncidentQuery = (autoAcceptIncidentsQuery = false) => {
   cy.get('.settings-panel-dropdown').click();
   cy.get('.dropdown-item').contains('Settings').click();

i18next-parser.config.js

@@ -8,9 +8,10 @@ module.exports = {
   defaultNamespace: 'translation',
   // Default namespace used in your i18next config
 
-  defaultValue: '',
+  defaultValue: (locale, namespace, key, value) => key,
   // Default value to give to empty keys
   // You may also specify a function accepting the locale, namespace, and key as arguments
+  // Ref: https://github.com/giranm/pd-live-react/pull/375
 
   indentation: 2,
   // Indentation of the catalog files
@@ -42,7 +43,7 @@ module.exports = {
   lineEnding: 'auto',
   // Control the line ending. See options at https://github.com/ryanve/eol
 
-  locales: ['en', 'fr', 'es', 'de', 'ja', 'id'],
+  locales: ['en', 'fr', 'es', 'de', 'ja', 'id', 'pt', 'pt-br'],
   // An array of the locales in your applications
 
   namespaceSeparator: ':',
@@ -65,15 +66,6 @@ module.exports = {
   sort: true,
   // Whether or not to sort the catalog. Can also be a [compareFunction](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/sort#parameters)
 
-  skipDefaultValues: false,
-  // Whether to ignore default values
-  // You may also specify a function accepting the locale and namespace as arguments
-
-  useKeysAsDefaultValue: true,
-  // Whether to use the keys as the default value; ex. "Hello": "Hello", "World": "World"
-  // This option takes precedence over the `defaultValue` and `skipDefaultValues` options
-  // You may also specify a function accepting the locale and namespace as arguments
-
   verbose: false,
   // Display info about the parsing including some stats
 

package.json

@@ -1,12 +1,12 @@
 {
   "name": "pd-live-react",
   "homepage": "https://giranm.github.io/pd-live-react",
-  "version": "0.5.1-beta.0",
+  "version": "0.6.0-beta.0",
   "private": true,
   "dependencies": {
-    "@braintree/sanitize-url": "^6.0.0",
-    "@craco/craco": "7.0.0-alpha.3",
-    "@datadog/browser-rum": "^4.23.1",
+    "@braintree/sanitize-url": "^6.0.2",
+    "@craco/craco": "7.0.0",
+    "@datadog/browser-rum": "^4.32.1",
     "@fortawesome/fontawesome-svg-core": "^6.2.0",
     "@fortawesome/free-brands-svg-icons": "^6.2.0",
     "@fortawesome/free-regular-svg-icons": "^6.2.0",
@@ -16,43 +16,43 @@
     "@testing-library/jest-dom": "^5.16.5",
     "@testing-library/react": "^12.1.5",
     "@testing-library/user-event": "^14.4.3",
-    "@wojtekmaj/enzyme-adapter-react-17": "^0.6.7",
-    "autoprefixer": "10.4.12",
-    "axios": "^1.1.3",
+    "@wojtekmaj/enzyme-adapter-react-17": "^0.8.0",
+    "autoprefixer": "10.4.13",
+    "axios": "^1.2.2",
     "babel-eslint": "^10.1.0",
     "bootstrap": "^4.6.2",
     "bottleneck": "^2.19.5",
     "date-fns": "^2.29.3",
     "enzyme": "^3.11.0",
     "font-awesome": "^4.7.0",
     "fuse.js": "^6.6.2",
-    "i18next": "^22.0.4",
+    "i18next": "^22.4.8",
     "i18next-browser-languagedetector": "^7.0.1",
-    "immer": "^9.0.15",
+    "immer": "^9.0.18",
     "jsonpath-plus": "^7.2.0",
     "lodash": "^4.17.21",
     "mezr": "^0.6.2",
     "moment": "^2.29.4",
     "node-sass": "^7.0.3",
     "react": "^17.0.2",
     "react-bootstrap": "^1.6.6",
-    "react-datepicker": "^4.8.0",
+    "react-datepicker": "^4.10.0",
     "react-dom": "^17.0.2",
-    "react-dual-listbox": "^3.0.1",
-    "react-i18next": "^12.0.0",
+    "react-dual-listbox": "^4.0.0",
+    "react-i18next": "^12.1.5",
     "react-inject-env": "^2.0.1",
     "react-redux": "^8.0.5",
     "react-scripts": "5.0.1",
-    "react-select": "^5.6.0",
+    "react-select": "^5.7.0",
     "react-table": "^7.8.0",
     "react-window": "^1.8.8",
-    "redux": "^4.2.0",
+    "redux": "^4.2.1",
     "redux-persist": "^6.0.0",
     "redux-saga": "^1.2.1",
     "styled-components": "^5.3.6",
-    "use-debounce": "^8.0.4",
+    "use-debounce": "^9.0.3",
     "validator": "^13.7.0",
-    "web-vitals": "^3.0.3"
+    "web-vitals": "^3.1.0"
   },
   "resolutions": {
     "autoprefixer": "10.4.5"
@@ -96,38 +96,38 @@
     "@4tw/cypress-drag-drop": "^2.2.1",
     "@babel/preset-env": "^7.18.9",
     "@babel/preset-react": "^7.16.7",
-    "@cypress/react": "6.2.1",
-    "@cypress/webpack-dev-server": "^2.5.0",
+    "@cypress/react": "7.0.1",
+    "@cypress/webpack-dev-server": "^3.2.3",
     "@faker-js/faker": "^7.6.0",
-    "cy2": "^3.1.7",
+    "cy2": "^3.4.3",
     "cypress": "^10.10.0",
-    "cypress-fail-fast": "^5.0.1",
+    "cypress-fail-fast": "^7.0.0",
     "eslint": "^7.32.0",
     "eslint-config-airbnb": "^18.2.1",
-    "eslint-config-prettier": "^8.5.0",
+    "eslint-config-prettier": "^8.6.0",
     "eslint-config-react-app": "^7.0.1",
     "eslint-plugin-cypress": "^2.12.1",
-    "eslint-plugin-import": "^2.26.0",
-    "eslint-plugin-jsx-a11y": "^6.6.1",
+    "eslint-plugin-import": "^2.27.5",
+    "eslint-plugin-jsx-a11y": "^6.7.0",
     "eslint-plugin-prettier": "^4.2.1",
-    "eslint-plugin-react": "^7.31.8",
+    "eslint-plugin-react": "^7.32.1",
     "eslint-plugin-react-hooks": "^4.6.0",
     "genversion": "^3.1.1",
     "gh-pages": "^4.0.0",
     "html-webpack-plugin": "5",
-    "i18next-parser": "^6.6.0",
+    "i18next-parser": "^7.6.0",
     "identity-obj-proxy": "^3.0.0",
     "jest-canvas-mock": "^2.4.0",
     "jest-location-mock": "^1.0.9",
-    "prettier": "^2.6.2",
+    "prettier": "^2.8.0",
     "prettier-eslint": "^15.0.1",
     "prettier-eslint-cli": "^7.1.0",
     "redux-mock-store": "^1.5.4",
     "redux-saga-test-plan": "^4.0.6",
     "resolve-url-loader": "^5.0.0",
     "string.prototype.replaceall": "^1.0.6",
     "svg-jest": "^1.0.1",
-    "wait-on": "^6.0.1",
+    "wait-on": "^7.0.1",
     "yarn-audit-fix": "^9.3.6"
   }
 }

src/App.js

@@ -53,6 +53,7 @@ import {
 } from 'redux/response_plays/actions';
 import {
   checkConnectionStatus as checkConnectionStatusConnected,
+  updateQueueStats as updateQueueStatsConnected,
   checkAbilities as checkAbilitiesConnected,
 } from 'redux/connection/actions';
 import {
@@ -61,6 +62,9 @@ import {
 import {
   store,
 } from 'redux/store';
+import {
+  limiter,
+} from 'util/pd-api-wrapper';
 
 import {
   PD_OAUTH_CLIENT_ID,
@@ -80,6 +84,7 @@ const App = ({
   userAuthorize,
   checkAbilities,
   checkConnectionStatus,
+  updateQueueStats,
   getServicesAsync,
   getTeamsAsync,
   getPrioritiesAsync,
@@ -190,6 +195,16 @@ const App = ({
     return () => clearInterval(clearingInterval);
   }, [userAuthorized]);
 
+  // Setup queue stats update for status beacon tooltip
+  useEffect(() => {
+    const queueStateInterval = setInterval(() => {
+      if (userAuthorized) {
+        updateQueueStats(limiter.counts());
+      }
+    }, 1000);
+    return () => clearInterval(queueStateInterval);
+  }, [userAuthorized]);
+
   // Setup auto-refresh for incidents
   useEffect(() => {
     const refreshInterval = setInterval(() => {
@@ -250,6 +265,7 @@ const mapDispatchToProps = (dispatch) => ({
   userAuthorize: () => dispatch(userAuthorizeConnected()),
   checkAbilities: () => dispatch(checkAbilitiesConnected()),
   checkConnectionStatus: () => dispatch(checkConnectionStatusConnected()),
+  updateQueueStats: (queueStats) => dispatch(updateQueueStatsConnected(queueStats)),
   getServicesAsync: (teamIds) => dispatch(getServicesAsyncConnected(teamIds)),
   getTeamsAsync: () => dispatch(getTeamsAsyncConnected()),
   getPrioritiesAsync: () => dispatch(getPrioritiesAsyncConnected()),

src/components/ConfirmQueryModal/ConfirmQueryModalComponent.js

@@ -25,6 +25,7 @@ const ConfirmQueryModalComponent = ({
     t,
   } = useTranslation();
   const {
+    // eslint-disable-next-line no-unused-vars
     maxIncidentsLimit,
   } = settings;
   const {
@@ -46,7 +47,7 @@ const ConfirmQueryModalComponent = ({
           {t('Current query parameters match X incidents', { totalIncidentsFromQuery })}
           {'. '}
           <br />
-          {t('Only the first X incidents will be retrieved', { maxIncidentsLimit })}
+          {t('Retrieving notes and alerts could take a long time')}
           {'. '}
           <br />
           <br />

src/components/ConfirmQueryModal/ConfirmQueryModalComponent.test.js

@@ -35,7 +35,7 @@ describe('ConfirmQueryModalComponent', () => {
     expect(wrapper.find('.modal-body').at(0).getDOMNode().textContent).toEqual(
       [
         `Current query parameters match ${totalIncidentsFromQuery} incidents.`,
-        `Only the first ${limit} incidents will be retrieved. Continue?`,
+        'Retrieving notes and alerts could take a long time. Continue?',
       ].join(' '),
     );
   });