RefreshPicker: SetInterval comments to rxjs code added (#17404)

packages/grafana-ui/src/components/SetInterval/SetInterval.tsx

@@ -23,17 +23,33 @@ export class SetInterval extends PureComponent<Props> {
   }
 
   componentDidMount() {
+    // Creating a subscription to propsSubject. This subject pushes values every time
+    // SetInterval's props change
     this.subscription = this.propsSubject
       .pipe(
+        // switchMap creates a new observables based on the input stream,
+        // which becomes part of the propsSubject stream
         switchMap(props => {
+          // If the query is live, empty value is emited. `of` creates single value,
+          // which is merged to propsSubject stream
           if (isLive(props.interval)) {
             return of({});
           }
+
+          // When query is loading, a new stream is merged. But it's a stream that emits no values(NEVER),
+          // hence next call of this function will happen when query changes, and new props are passed into this component
+          // When query is NOT loading, a new value is emited, this time it's an interval value,
+          // which makes tap function below execute on that interval basis.
           return props.loading ? NEVER : interval(stringToMs(props.interval));
         }),
+        // tap will execute function passed via func prop
+        // * on value from `of` stream merged if query is live
+        // * on specified interval (triggered by values emited by interval)
         tap(() => this.props.func())
       )
       .subscribe();
+
+    // When component has mounted, propsSubject emits it's first value
     this.propsSubject.next(this.props);
   }
 
@@ -41,7 +57,7 @@ export class SetInterval extends PureComponent<Props> {
     if ((isLive(prevProps.interval) && isLive(this.props.interval)) || _.isEqual(prevProps, this.props)) {
       return;
     }
-
+    // if props changed, a new value is emited from propsSubject
     this.propsSubject.next(this.props);
   }