[push] skippable audience estimation

Author: Cihad Tekin

plugins/push/frontend/public/javascripts/countly.views.js

@@ -97,6 +97,7 @@
                 isFetchEventsLoading: false,
                 isFetchLocationsLoading: false,
                 isLoading: false,
+                isEstimationLoading: false,
                 localizationOptions: [],
                 userPropertiesOptions: [],
                 cohortOptions: [],
@@ -476,7 +477,7 @@
                     return;
                 }
                 if (this.shouldEstimate(nextStep, currentStep)) {
-                    return this.estimate();
+                    this.estimate(); // estimate in the background
                 }
                 if (this.shouldValidateContentBeforeExit(nextStep, currentStep)) {
                     return this.$refs.content.validate();
@@ -521,6 +522,9 @@
             setIsLoading: function(value) {
                 this.isLoading = value;
             },
+            setEstimationLoading: function(value) {
+                this.isEstimationLoading = value;
+            },
             getQueryFilter: function() {
                 if (!this.queryFilter) {
                     return {};
@@ -534,7 +538,7 @@
                         resolve(false);
                         return;
                     }
-                    self.setIsLoading(true);
+                    self.setEstimationLoading(true);
                     var options = {};
                     options.isLocationSet = self.isLocationSet;
                     options.from = self.from;
@@ -570,7 +574,7 @@
                         CountlyHelpers.notify({ message: error.message, type: "error"});
                         resolve(false);
                     }).finally(function() {
-                        self.setIsLoading(false);
+                        self.setEstimationLoading(false);
                     });
                 });
             },

plugins/push/frontend/public/templates/push-notification-drawer.html

@@ -769,7 +769,10 @@
                             <cly-tooltip-icon :tooltip="i18n('push-notification.compose-message-tooltip')" icon="ion ion-help-circled"> </cly-tooltip-icon>
                         </div>
                         <div>
-                            <el-checkbox :value="multipleLocalizations" @change="onMultipleLocalizationChange">
+                            <div class="cly-vue-push-notification-drawer__checkbox-text" v-if="isEstimationLoading">
+                                <i class="fa fa-spin fa-spinner" style="font-size: 16px;margin-right: 6px;"></i> {{i18n('push-notification.allow-to-set-different-content')}}
+                            </div>
+                            <el-checkbox :value="multipleLocalizations" @change="onMultipleLocalizationChange" v-else>
                                 <div class="cly-vue-push-notification-drawer__checkbox-text">{{i18n('push-notification.allow-to-set-different-content')}}</div>
                             </el-checkbox>
                         </div>
@@ -1195,7 +1198,10 @@
                                         {{previewCohorts(pushNotificationUnderEdit.cohorts).join(', ')}}
                                     </template>
                                 </review-section-row>
-                                <review-section-row v-if="shouldDisplayNumberOfUsers" :label="i18n('push-notification.current-number-of-users')" :value="currentNumberOfUsers"></review-section-row>
+                                <review-section-row v-if="shouldDisplayNumberOfUsers" :label="i18n('push-notification.current-number-of-users')">
+                                    <template v-if="isEstimationLoading"><i class="fa fa-spin fa-spinner"></i></template>
+                                    <template v-else>{{currentNumberOfUsers}}</template>
+                                </review-section-row>
                                 <review-section-row v-if="pushNotificationUnderEdit[TypeEnum.ONE_TIME].targeting === TargetingEnum.SEGMENTED" :label="i18n('push-notification.geolocations')" :value="previewLocations.join(', ')"></review-section-row>
                                 <review-section-row 
                                     v-if="type === TypeEnum.ONE_TIME" 
@@ -1212,7 +1218,10 @@
                                         {{previewCohorts(pushNotificationUnderEdit.cohorts).join(', ')}}
                                     </template>
                                 </review-section-row>
-                                <review-section-row v-if="shouldDisplayNumberOfUsers" :label="i18n('push-notification.current-number-of-users')" :value="currentNumberOfUsers"></review-section-row>
+                                <review-section-row v-if="shouldDisplayNumberOfUsers" :label="i18n('push-notification.current-number-of-users')">
+                                    <template v-if="isEstimationLoading"><i class="fa fa-spin fa-spinner"></i></template>
+                                    <template v-else>{{currentNumberOfUsers}}</template>
+                                </review-section-row>
                                 <review-section-row v-if="pushNotificationUnderEdit[TypeEnum.RECURRING].targeting === TargetingEnum.SEGMENTED" :label="i18n('push-notification.geolocations')" :value="previewLocations.join(', ')"></review-section-row>
                                 <review-section-row 
                                     v-if="type === TypeEnum.RECURRING" 
@@ -1229,7 +1238,10 @@
                                         {{previewCohorts(pushNotificationUnderEdit.cohorts).join(', ')}}
                                     </template>
                                 </review-section-row>
-                                <review-section-row v-if="shouldDisplayNumberOfUsers" :label="i18n('push-notification.current-number-of-users')" :value="currentNumberOfUsers"></review-section-row>
+                                <review-section-row v-if="shouldDisplayNumberOfUsers" :label="i18n('push-notification.current-number-of-users')">
+                                    <template v-if="isEstimationLoading"><i class="fa fa-spin fa-spinner"></i></template>
+                                    <template v-else>{{currentNumberOfUsers}}</template>
+                                </review-section-row>
                                 <review-section-row v-if="pushNotificationUnderEdit[TypeEnum.MULTIPLE].targeting === TargetingEnum.SEGMENTED" :label="i18n('push-notification.geolocations')" :value="previewLocations.join(', ')"></review-section-row>
                                 <review-section-row 
                                     v-if="type === TypeEnum.MULTIPLE"