Avoid asking for calendar permission on app start

react/features/calendar-sync/components/MeetingList.native.js

      */
     dispatch: Function,
 
+    /**
+     * Tells the component if it's being displayed at the moment, or not.
+     * Note: as an example, on Android it can happen that the component
+     * is rendered but not displayed, because components like ViewPagerAndroid
+     * render their children even if they are not visible at the moment.
+     */
+    displayed: boolean,
+
     /**
      * The calendar event list.
      */
  * Component to display a list of events from the (mobile) user's calendar.
  */
 class MeetingList extends Component<Props> {
+    _initialLoaded: boolean
 
     /**
      * Default values for the component's props.
         this._toDateString = this._toDateString.bind(this);
     }
 
+    /**
+     * Implements React Component's componentWillReceiveProps function.
+     *
+     * @inheritdoc
+     */
+    componentWillReceiveProps(newProps) {
+        // This is a conditional logic to refresh the calendar entries (thus
+        // to request access to calendar) on component first receives a
+        // displayed=true prop - to avoid requesting calendar access on
+        // app start.
+        if (!this._initialLoaded
+                && newProps.displayed
+                && !this.props.displayed) {
+            const { dispatch } = this.props;
+
+            this._initialLoaded = true;
+            dispatch(refreshCalendarEntryList());
+        }
+    }
+
     /**
      * Implements the React Components's render method.
      *

react/features/calendar-sync/middleware.js

     switch (action.type) {
     case APP_WILL_MOUNT:
         _ensureDefaultServer(store);
-        _fetchCalendarEntries(store);
+        _fetchCalendarEntries(store, false);
         break;
     case REFRESH_CALENDAR_ENTRY_LIST:
-        _fetchCalendarEntries(store);
+        _fetchCalendarEntries(store, true);
         break;
     case SET_ROOM:
         _parseAndAddDomain(store);
  * Ensures calendar access if possible and resolves the promise if it's granted.
  *
  * @private
+ * @param {boolean} promptForPermission - Flag to tell the app if it should
+ * prompt for a calendar permission if it wasn't granted yet.
  * @returns {Promise}
  */
-function _ensureCalendarAccess() {
+function _ensureCalendarAccess(promptForPermission) {
     return new Promise((resolve, reject) => {
         RNCalendarEvents.authorizationStatus()
             .then(status => {
                 if (status === 'authorized') {
                     resolve();
-                } else if (status === 'undetermined') {
+                } else if (promptForPermission) {
                     RNCalendarEvents.authorizeEventStore()
                         .then(result => {
                             if (result === 'authorized') {
  *
  * @private
  * @param {Object} store - The redux store.
+ * @param {boolean} promptForPermission - Flag to tell the app if it should
+ * prompt for a calendar permission if it wasn't granted yet.
  * @returns {void}
  */
-function _fetchCalendarEntries(store) {
-    _ensureCalendarAccess()
+function _fetchCalendarEntries(store, promptForPermission) {
+    _ensureCalendarAccess(promptForPermission)
     .then(() => {
         const startDate = new Date();
         const endDate = new Date();

react/features/welcome/components/PagedList.android.js

      */
     render() {
         const { disabled } = this.props;
+        const { pageIndex } = this.state;
 
         return (
             <View
                         <RecentList disabled = { disabled } />
                     </View>
                     <View key = { 1 }>
-                        <MeetingList disabled = { disabled } />
+                        <MeetingList
+                            disabled = { disabled }
+                            displayed = { pageIndex === 1 } />
                     </View>
                 </ViewPagerAndroid>
                 <View style = { styles.pageIndicatorContainer }>

react/features/welcome/components/PagedList.ios.js

                         onPress = { this._onTabSelected(1) }
                         selected = { pageIndex === 1 }
                         title = { t('welcomepage.calendar') } >
-                        <MeetingList disabled = { disabled } />
+                        <MeetingList
+                            disabled = { disabled }
+                            displayed = { pageIndex === 1 } />
                     </TabBarIOS.Item>
                 </TabBarIOS>
             </View>