How to use the rxjs/operators.distinctUntilChanged function in rxjs

import ExternalLink from '../dim-ui/ExternalLink';
import { timer, from, empty, Subscription } from 'rxjs';
import {
  switchMap,
  startWith,
  distinctUntilChanged,
  shareReplay,
  catchError
} from 'rxjs/operators';

export const alerts$ = timer(0, 10 * 60 * 1000).pipe(
  // Fetch global alerts, but swallow errors
  switchMap(() => from(getGlobalAlerts()).pipe(catchError((_err) => empty()))),
  startWith([] as GlobalAlert[]),
  // Deep equals
  distinctUntilChanged(deepEqual),
  shareReplay()
);

interface State {
  alerts: GlobalAlert[];
}

/**
 * Displays maintenance alerts from Bungie.net.
 */
// TODO: How to mark that they've been "seen"?
export default class BungieAlerts extends React.Component<{}, State> {
  private subscription: Subscription;

  constructor(props) {
    super(props);

const currentSearchFilter = this.wpTableFilters.find('search');
          return currentSearchFilter ? (currentSearchFilter.values[0] as string) : '';
        }),
      )
      .subscribe((upstreamTerm:string) => {
        console.log("upstream " + upstreamTerm + " " + (this.searchTerm as any).timestampOfLastValue);
        if (!this.searchTerm.value || this.searchTerm.isValueOlderThan(500)) {
          console.log("Upstream value setting to " + upstreamTerm);
          this.searchTerm.putValue(upstreamTerm);
        }
      });

    this.searchTermChanged
      .pipe(
        this.untilDestroyed(),
        distinctUntilChanged(),
        tap((val) => this.searchTerm.putValue(val)),
        debounceTime(500),
      )
      .subscribe(term => {
        if (term.length > 0) {
          this.wpTableFilters.replace('search', filter => {
            filter.operator = filter.findOperator('**')!;
            filter.values = [term];
          });
        } else {
          const filter = this.wpTableFilters.find('search');

          this.wpTableFilters.remove(filter!);

          this.deactivateFilter.emit(filter);
        }

private applyAdminCheck(check$: Observable, endpointGuid?: string) {
    const adminCheck$ = this.checker.getAdminChecks(endpointGuid);
    const readOnlyCheck$ = this.checker.getReadOnlyChecks(endpointGuid);
    return combineLatest(
      adminCheck$,
      readOnlyCheck$
    ).pipe(
      distinctUntilChanged(),
      switchMap(([isAdmin, isReadOnly]) => {
        if (isAdmin) {
          return observableOf(true);
        }
        if (isReadOnly) {
          return observableOf(false);
        }
        return check$;
      })
    );
  }

$onInit() {
        const clusterID$ = this.$uiRouter.globals.params$.pipe(
            take(1),
            pluck('clusterID'),
            filter((v) => v),
            take(1)
        );

        this.shortCaches$ = this.ConfigureState.state$.pipe(this.ConfigSelectors.selectCurrentShortCaches);

        this.originalCluster$ = clusterID$.pipe(
            distinctUntilChanged(),
            switchMap((id) => {
                return this.ConfigureState.state$.pipe(this.ConfigSelectors.selectClusterToEdit(id));
            }),
            distinctUntilChanged(),
            publishReplay(1),
            refCount()
        );

        this.isNew$ = this.$uiRouter.globals.params$.pipe(pluck('clusterID'), map((id) => id === 'new'));

        this.isBlocked$ = clusterID$;
    }

public versionOptions(): PipeableSelectOptions {
        return pipe(
            map((values: { applicationId: string }) => values.applicationId),
            distinctUntilChanged(),
            filter(x => Boolean(x)),
            switchMap(applicationName => this.applicationService.getByName(applicationName)),
            switchMap(application => application ? this.packageService.listAll(application.id) : of(List([]))),
            map((packages) => packages.map(x => x.name).toArray()),
            publishReplay(1),
            refCount(),
        );
    }

const connect$: MsgServerEffect = (event$, ctx) => {
  const logger = provideLogger(ctx.ask);
  const transportLayer = useContext(TransportLayerToken)(ctx.ask);

  return event$.pipe(
    matchEvent(ServerEvent.status),
    map(event => event.payload),
    distinctUntilChanged((p, c) => p.type === c.type),
    filter(({ type }) => type === serverStatusMap.connect[transportLayer.type]),
    tap(({ host, channel }) => logger({
      tag: 'CONNECTED',
      message: `Connected server to host: ${host}`,
      level: LoggerLevel.INFO,
      channel,
    })),
  );
};

selectControl(formName: keyof FormsState, path?: string): Observable<_AbstractControl> {
    if (!path) {
      return this.selectForm(formName);
    }

    return this.store
      .select(state => state[formName as any])
      .pipe(
        filterNil,
        map(form => this.resolveControl(form, path)),
        distinctUntilChanged((a, b) => isEqual(a, b))
      );
  }

private bindMarkers(allProperties$: Observable): Observable {
    return allProperties$.pipe(
      switchMap(allProperties => {
        const coordinateProperties = populateCoordinateProperties(allProperties);
        const uninitializedProperties = filterUninitializedProperties(allProperties, coordinateProperties);

        return this.populateAddressProperties(uninitializedProperties).pipe(
          map(addressProperties => coordinateProperties.concat(addressProperties))
        );
      }),
      distinctUntilChanged((previous, next) => areMapMarkerListsEqual(previous, next)),
      switchMap(properties => this.refreshMarkers$.pipe(map(() => [...properties])))
    );
  }

const request$ = this.halService.getEndpoint(this.linkPath).pipe(
      isNotEmptyOperator(),
      distinctUntilChanged(),
      map((endpointURL: string) => new BrowseEndpointRequest(this.requestService.generateRequestId(), endpointURL)),
      configureRequest(this.requestService)
    );

    const href$ = request$.pipe(map((request: RestRequest) => request.href));
    const requestEntry$ = href$.pipe(getRequestFromRequestHref(this.requestService));
    const payload$ = requestEntry$.pipe(
      filterSuccessfulResponses(),
      map((response: GenericSuccessResponse) => response.payload),
      ensureArrayHasValue(),
      map((definitions: BrowseDefinition[]) => definitions
        .map((definition: BrowseDefinition) => Object.assign(new BrowseDefinition(), definition))),
      distinctUntilChanged()
    );

    return this.rdb.toRemoteDataObservable(requestEntry$, payload$);
  }