[ch31343] [Intermittent] Continuous loading PD/SSFA Data in Programme…

… Document (#1830)

* [ch28888] Indicator calculation methods are not displayed sometimes

* added piwik to frontend_cluster

* update common submodule ref

* updated common module ref

* [ch31343] [Intermittent] Continuous loading PD/SSFA Data in Programme Document

* [ch31343] [Intermittent] Continuous loading PD/SSFA Data in Programme Document

* adjustments

* updated circleCi for this branch

* adjustments

* updated prp_common reference

.circleci/config.yml

@@ -255,6 +255,7 @@ workflows:
                 - master
                 - staging
                 - develop
+                - pd-overview-loading
                 - update-packages-fixes
       - build_and_deploy_fe_cluster:
           filters:

frontend_ip/src_ts/elements/ip-reporting/pd-details-overview.ts

@@ -24,9 +24,8 @@ import {Debouncer} from '@polymer/polymer/lib/utils/debounce';
 import {timeOut} from '@polymer/polymer/lib/utils/async';
 import {EtoolsPrpAjaxEl} from '../../etools-prp-common/elements/etools-prp-ajax';
 import Settings from '../../etools-prp-common/settings';
-import {currentProgrammeDocument} from '../../etools-prp-common/redux/selectors/programmeDocuments';
 import {computeLoaded, hasAmendments, computeReportingRequirements} from './js/pd-details-overview-functions';
-import {RootState} from '../../typings/redux.types';
+import {pdAdd, pdSetCount} from '../../redux/actions/pd';
 
 /**
  * @polymer
@@ -103,11 +102,6 @@ class PdDetailsOverview extends UtilsMixin(LocalizeMixin(ReduxConnectedElement))
       }
     </style>
 
-    <etools-prp-ajax
-        id="programmeDocuments"
-        url="[[programmeDocumentsUrl]]">
-    </etools-prp-ajax>
-
     <etools-prp-ajax
         id="programmeDocumentDetail"
         url="[[programmeDocumentDetailUrl]]">
@@ -291,7 +285,7 @@ class PdDetailsOverview extends UtilsMixin(LocalizeMixin(ReduxConnectedElement))
   `;
   }
 
-  @property({type: Object, computed: '_currentProgrammeDocument(rootState)'})
+  @property({type: Object})
   pd: GenericObject = {};
 
   @property({type: Object})
@@ -319,9 +313,6 @@ class PdDetailsOverview extends UtilsMixin(LocalizeMixin(ReduxConnectedElement))
   @property({type: String, computed: 'getReduxStateValue(rootState.programmeDocuments.current)'})
   pdId!: string;
 
-  @property({type: String, computed: '_computeProgrammeDocumentsUrl(locationId)'})
-  programmeDocumentsUrl!: string;
-
   @property({type: String, computed: '_computePdDetailsUrl(locationId, pdId)'})
   programmeDocumentDetailUrl!: string;
 
@@ -358,10 +349,6 @@ class PdDetailsOverview extends UtilsMixin(LocalizeMixin(ReduxConnectedElement))
     return computeReportingRequirements(reportingPeriods, Settings.dateFormat);
   }
 
-  _computeProgrammeDocumentsUrl(locationId: string) {
-    return locationId ? Endpoints.programmeDocuments(locationId) : '';
-  }
-
   _computePdDetailsUrl(locationId: string, pdId: string) {
     if (!locationId || !pdId) {
       return;
@@ -393,18 +380,21 @@ class PdDetailsOverview extends UtilsMixin(LocalizeMixin(ReduxConnectedElement))
 
       pdThunk()
         .then((res: any) => {
-          this.pd = res.data;
+          this.set('pd', res.data);
+          // if PD is missing from state programmeDocuments need to add it because
+          // it's loaded from list in other places with currentProgrammeDocument
+          const pdFromList = this.rootState.programmeDocuments.all.find((x) => String(x.id) === String(res.data.id));
+          if (!pdFromList) {
+            this.reduxStore.dispatch(pdAdd(res.data));
+            this.reduxStore.dispatch(pdSetCount(++this.rootState.programmeDocuments.all.length));
+          }
         })
         .catch((err: GenericObject) => {
           console.log(err);
         });
     });
   }
 
-  _currentProgrammeDocument(rootState: RootState) {
-    return currentProgrammeDocument(rootState);
-  }
-
   disconnectedCallback() {
     super.disconnectedCallback();
 

frontend_ip/src_ts/endpoints.ts

@@ -22,7 +22,7 @@ const Endpoints = {
   },
 
   programmeDocuments(locationId: string) {
-    return this._buildUrl('/unicef/' + locationId + '/programme-document/?page_size=all');
+    return this._buildUrl('/unicef/' + locationId + '/programme-document/');
   },
 
   programmeDocumentDetail(locationId: string, pdId: string) {

frontend_ip/src_ts/pages/app/ip-reporting/pd.ts

@@ -158,7 +158,7 @@ class PageIpReportingPd extends SortingMixin(UtilsMixin(ReduxConnectedElement))
   disconnectedCallback() {
     super.disconnectedCallback();
 
-    if (this.fetchPdsDebouncer && this.fetchPdsDebouncer.isActive) {
+    if (this.fetchPdsDebouncer && this.fetchPdsDebouncer.isActive()) {
       this.fetchPdsDebouncer.cancel();
     }
   }

frontend_ip/src_ts/redux/actions/pd.ts

@@ -14,6 +14,13 @@ export const pdSet = function (data: any) {
   };
 };
 
+export const pdAdd = function (data: any) {
+  return {
+    type: Constants.ADD_PROGRAMME_DOCUMENTS,
+    data: data
+  };
+};
+
 export const pdSetCount = function (count: number) {
   return {
     type: Constants.SET_PROGRAMME_DOCUMENTS_COUNT,

frontend_ip/src_ts/redux/reducers/programmeDocuments.ts

@@ -1,5 +1,6 @@
 import {combineReducers} from 'redux';
 import Constants from '../../etools-prp-common/constants';
+import {GenericObject} from '../../etools-prp-common/typings/globals.types';
 
 export class ProgrammeDocumentsState {
   all: any[] = [];
@@ -15,11 +16,14 @@ export const ProgrammeDocuments = combineReducers({
   loading: loadingPDsReducer
 });
 
-function allPDsReducer(state = [], action: any) {
+function allPDsReducer(state: GenericObject[] = [], action: any) {
   switch (action.type) {
     case Constants.SET_PROGRAMME_DOCUMENTS:
       return action.data.slice();
 
+    case Constants.ADD_PROGRAMME_DOCUMENTS:
+      return state.concat([action.data]);
+
     case Constants.RESET:
       return [];