How to use the xstream.fromObservable function in xstream

function Collection (component, sources = {}, sourceAdd$ = xs.empty(), removeSelector = noop) {
    const removeProxy$ = xs.create();
    const add$ = xs.fromObservable(sourceAdd$);
    const addReducer$ = add$.map(sourcesList => collection => {
      if (Array.isArray(sourcesList)) {
        // multiple items
        return sourcesList.reduce((collection, sources) => collection.add(sources), collection);
      } else {
        // single item
        return collection.add(sourcesList);
      }
    });
    const removeReducer$ = removeProxy$.map(item => collection => collection.remove(item));
    const reducer$ = xs.merge(removeReducer$, addReducer$);

    const emptyCollection = collection({ component, sources, removeSelector });
    const collection$ = reducer$
      .fold((collection, reducer) => reducer(collection), emptyCollection)
      .map(collection => collection.asArray());

function sink$ (item) {
      const key = item._id;

      if (sinks[key] === undefined) {
        const selectedSink = xs.fromObservable(mergeSelector(item));
        const sink = selectedSink.map(x =>
          isVtree(x) && x.key == null ? {...x, key} : x
        );
        // prevent sink from early completion and reinitialization
        sinks[key] = xs.merge(sink, xs.never());
      }

      return sinks[key];
    }

function sink$ (item) {
      const key = item._id;

      if (sinks[key] === undefined) {
        const selectedSink = xs.fromObservable(mergeSelector(item));
        const sink = selectedSink.map(x =>
          isVtree(x) && x.key == null ? {...x, key} : x
        );
        // prevent sink from early completion and reinitialization
        sinks[key] = xs.merge(sink, xs.never());
      }

      return sinks[key];
    }

    const collection$ = xs.fromObservable(sourceCollection$);
    const outputCollection$ = collection$
      .map(items => items.map(item => sink$(item)))
      .map(sinkStreams => xs.merge(...sinkStreams))
      .flatten();
    return internal
      ? outputCollection$
      : adapt(outputCollection$);
  };

opts.routerName
        );
        let srcs = sources;
        if (opts.omitHistory) {
            delete srcs[opts.historyName];
        }
        const sinks = main({
            ...srcs,
            [opts.routerName]: routerSource
        });
        return {
            ...sinks,
            [opts.historyName]: adapt(
                xs.merge(
                    sinks[opts.historyName] && !opts.omitHistory
                        ? xs.fromObservable(sinks[opts.historyName])
                        : xs.never(),
                    sinks[opts.routerName]
                        ? xs.fromObservable(sinks[opts.routerName])
                        : xs.never()
                )
            )
        };
    };
}

function getMouseStream(
    DOM: DOMSource,
    eventTypes: string[],
    handle: string
): Stream {
    return xs.merge(
        ...eventTypes
            .slice(0, -1)
            .map(ev => xs.fromObservable(DOM.select(handle).events(ev))),
        xs
            .fromObservable(
                DOM.select(handle).events(eventTypes[eventTypes.length - 1])
            )
            .map(augmentEvent)
    ) as Stream;
}

const assert = {
      state: 'pending',
      error: null,
      unexpectedErrors: [],
      finish: () => {
        checkEqual(completeStore, assert, interval, comparator);
      },
    };

    addAssert(assert);

    const actualLog$ = Time.record(actual);
    const expectedLog$ = Time.record(expected);

    xs.combine(
      xs.fromObservable(actualLog$),
      xs.fromObservable(expectedLog$)
    ).addListener({
      next([aLog, bLog]) {
        completeStore.actual = aLog;
        completeStore.expected = bLog;
      },

      complete() {
        checkEqual(completeStore, assert, interval, comparator);
      },
    });
  };
}

if (opts.omitHistory) {
            delete srcs[opts.historyName];
        }
        const sinks = main({
            ...srcs,
            [opts.routerName]: routerSource
        });
        return {
            ...sinks,
            [opts.historyName]: adapt(
                xs.merge(
                    sinks[opts.historyName] && !opts.omitHistory
                        ? xs.fromObservable(sinks[opts.historyName])
                        : xs.never(),
                    sinks[opts.routerName]
                        ? xs.fromObservable(sinks[opts.routerName])
                        : xs.never()
                )
            )
        };
    };
}

state: 'pending',
      error: null,
      unexpectedErrors: [],
      finish: () => {
        checkEqual(completeStore, assert, interval, comparator);
      },
    };

    addAssert(assert);

    const actualLog$ = Time.record(actual);
    const expectedLog$ = Time.record(expected);

    xs.combine(
      xs.fromObservable(actualLog$),
      xs.fromObservable(expectedLog$)
    ).addListener({
      next([aLog, bLog]) {
        completeStore.actual = aLog;
        completeStore.expected = bLog;
      },

      complete() {
        checkEqual(completeStore, assert, interval, comparator);
      },
    });
  };
}