How to use the xstream/extra/dropRepeats function in xstream

To help you get started, we’ve selected a few xstream examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github wellcometrust / wellcomecollection.org / client / js / components / make-sticky.js View on Github external
const elements = nodeList(els);

  const applyPositioning = (stickyNavHeight) => {
    elements.forEach((el) => {
      const isEnoughRoom = el.offsetHeight > (window.innerHeight - stickyNavHeight);
      el.classList[isEnoughRoom ? 'remove' : 'add']('sticky-applied');
    });
  };

  const updateStickyTops = (stickyNavHeight) => {
    elements.forEach((el) => {
      el.style.top = `${stickyNavHeight + initialPxFromTop}px`;
    });
  };

  const stickyNavHeight$ = store$.map(state => state.stickyNavHeight).compose(dropRepeats());
  stickyNavHeight$.subscribe({
    next: (stickyNavHeight) => {
      updateStickyTops(stickyNavHeight);
      applyPositioning(stickyNavHeight);
    }
  });

  const applyPositioningListener = {
    next: ([_, stickyNavHeight]) => applyPositioning(stickyNavHeight)
  };

  stickyNavHeight$.subscribe({ next: applyPositioning });
  onWindowResizeDebounce$.compose(sampleCombine(stickyNavHeight$)).subscribe(applyPositioningListener);
  onWindowOrientationChange$.compose(sampleCombine(stickyNavHeight$)).subscribe(applyPositioningListener);
  documentReadyState$.compose(sampleCombine(stickyNavHeight$)).filter(state => state === 'complete').subscribe(applyPositioningListener);
};
github staltz / manyverse / src / frontend / screens / central / connections-tab / intent.ts View on Github external
navSource: NavSource,
  state$: Stream,
  fabPress$: Stream,
) {
  const back$ = navSource.backPress();

  const menuChoice$ = reactSource
    .select('slide-in-menu')
    .events('select') as Stream;

  return {
    //#region Header actions

    pingConnectivityModes$: state$
      .map(state => state.isVisible)
      .compose(dropRepeats())
      .map(isTabVisible =>
        isTabVisible
          ? concat(xs.of(0), xs.periodic(2000).take(2), xs.periodic(6000))
          : xs.never(),
      )
      .flatten()
      .startWith(null),

    showBluetoothHelp$: reactSource.select('bluetooth-mode').events('press'),

    showLANHelp$: reactSource.select('lan-mode').events('press'),

    showDHTHelp$: reactSource.select('dht-mode').events('press'),

    showPubHelp$: reactSource.select('pub-mode').events('press'),
github Cmdv / cycle-webpack-boilerplate / src / dialogue / components / component-router / component-router.js View on Github external
function ComponentRouter (sources) {
  requireSources('ComponentRouter', sources, 'routes$')

  const component$ = sources.routes$
    .map(routes => sources.router.define(routes)).flatten()
    .compose(dropRepeats(equalPaths))
    .map(callComponent(sources))
    .remember()

  return {
    pluck: key => mergeFlatten(key, [component$]),
    DOM: mergeFlatten('DOM', [component$]),
    route$: mergeFlatten('route$', [component$]),
    state$: mergeFlatten('state$', [component$]),
  }
}
github staltz / matrixmultiplication.xyz / src / Calculator / view.ts View on Github external
function makeTransform$(state$: MemoryStream): MemoryStream {
  const stateOnStepChange$ = state$
    .compose(dropRepeats((s1: State, s2: State) => s1.step === s2.step));

  return xs.merge(
    makeWaterfallTransform$(stateOnStepChange$),
    makeStepTransform$(stateOnStepChange$),
  ).startWith('translateX(0%) translateY(0px) rotateZ(0deg)');
}
github cyclejs / cyclejs / examples / advanced / routing-view / src / main.js View on Github external
function main(sources) {
  const history$ = sources.DOM.select('nav').events('click')
    .map(e => e.target.dataset.page)
    .compose(dropRepeats())

  const vdom$ = view(sources.history);

  return {
    DOM: vdom$,
    history: history$,
  };
}
github staltz / manyverse / src / frontend / screens / compose / view.ts View on Github external
export default function view(
  state$: Stream,
  topBar$: Stream>,
) {
  const avatarUrl$ = state$
    .map(state => state.avatarUrl)
    .compose(dropRepeats())
    .startWith(undefined);

  const miniState$ = (state$ as Stream)
    .compose(
      dropRepeats(
        (s1, s2) =>
          s1.previewing === s2.previewing &&
          s1.postText === s2.postText &&
          s1.postTextSelection === s2.postTextSelection &&
          s1.contentWarning === s2.contentWarning &&
          s1.mentionQuery === s2.mentionQuery &&
          s1.mentionSuggestions === s2.mentionSuggestions &&
          s1.mentionChoiceTimestamp === s2.mentionChoiceTimestamp,
      ),
    )
    .startWith({
      postText: '',
      postTextSelection: {start: 0, end: 0},
      previewing: false,
      contentWarning: '',
      mentionQuery: '',
github cyclejs / cyclejs / state / src / StateSource.ts View on Github external
constructor(stream: Stream, name: string) {
    this._stream = stream
      .filter(s => typeof s !== 'undefined')
      .compose(dropRepeats())
      .remember();
    this._name = name;
    this.stream = adapt(this._stream);
    (this._stream as MemoryStream<s> &amp;
      DevToolEnabledSource)._isCycleSource = name;
  }
</s>