Observable chain

src/API.ts

@@ -327,6 +327,14 @@ export interface ObservableState<TSelectorAPI> {
     current(): TSelectorAPI
 }
 
+export interface ObservablesMap {
+    [key: string]: ObservableState<any>
+}
+
+export type ObservedSelectorsMap<M> = {
+    [K in keyof M]: M[K] extends ObservableState<infer S> ? S : undefined
+}
+
 export type AnyFunction = (...args: any[]) => any
 export type FunctionWithSameArgs<F extends AnyFunction> = (...args: Parameters<F>) => any
 
@@ -417,6 +425,18 @@ export interface Shell extends Pick<AppHost, Exclude<keyof AppHost, 'getStore' |
         selectorFactory: (state: TState) => TSelector
     ): ObservableState<TSelector>
 
+    /**
+     * ????
+     *
+     * @template TState
+     * @param {ReducersMapObjectContributor<TState>} contributor
+     * @return {TAPI} Observer object for subscribing to state changes. The observer can also be passed to {connectWithShell}.
+     */
+    contributeChainObservableState<TChainSelector, OBM extends ObservablesMap>(
+        observablesDependencies: OBM,
+        chainFunction: (shell: Shell, observedDependencies: ObservedSelectorsMap<OBM>) => TChainSelector
+    ): ObservableState<TChainSelector>
+
     /**
      * Contribute the main view (root) of the application
      * Intended to be used by a single {Shell} in an application

src/appHost.tsx

@@ -29,14 +29,17 @@ import {
     APILayer,
     CustomExtensionSlotHandler,
     CustomExtensionSlot,
-    ObservableState
+    ObservableState,
+    ObservablesMap,
+    ObservedSelectorsMap
 } from './API'
 import _ from 'lodash'
 import { AppHostAPI, AppHostServicesProvider, createAppHostServicesEntryPoint } from './appHostServices'
 import { AnyExtensionSlot, createExtensionSlot, createCustomExtensionSlot } from './extensionSlot'
 import { InstalledShellsActions, InstalledShellsSelectors, ShellToggleSet } from './installedShellsState'
 import { dependentAPIs, declaredAPIs } from './appHostUtils'
 import {
+    createChainObservable,
     createObservable,
     createThrottledStore,
     PrivateThrottledStore,
@@ -953,6 +956,15 @@ miss: ${memoizedWithMissHit.miss}
                 return observable
             },
 
+            contributeChainObservableState<TChainSelector, OBM extends ObservablesMap>(
+                observablesDependencies: OBM,
+                chainFunction: (shell: Shell, observedDependencies: ObservedSelectorsMap<OBM>) => TChainSelector
+            ): ObservableState<TChainSelector> {
+                const observableUniqueName = `${entryPoint.name}/observable_${nextObservableId++}`
+                const observable = createChainObservable(shell, observableUniqueName, observablesDependencies, chainFunction)
+                return observable
+            },
+
             getStore<TState>(): ScopedStore<TState> {
                 return {
                     dispatch: host.getStore().dispatch,

src/connectWithShell.tsx

@@ -2,7 +2,7 @@ import _ from 'lodash'
 import React from 'react'
 import { connect as reduxConnect } from 'react-redux'
 import { Action, Dispatch } from 'redux'
-import { AnyFunction, ObservableState, StateObserverUnsubscribe, PrivateShell, Shell } from './API'
+import { AnyFunction, StateObserverUnsubscribe, PrivateShell, Shell, ObservablesMap, ObservedSelectorsMap } from './API'
 import { ErrorBoundary } from './errorBoundary'
 import { ShellContext } from './shellContext'
 import { StoreContext } from './storeContext'
@@ -166,14 +166,6 @@ export function connectWithShell<S = {}, OP = {}, SP = {}, DP = {}>(
     }
 }
 
-export interface ObservablesMap {
-    [key: string]: ObservableState<any>
-}
-
-export type ObservedSelectorsMap<M> = {
-    [K in keyof M]: M[K] extends ObservableState<infer S> ? S : undefined
-}
-
 export type OmitObservedSelectors<T, M> = Omit<T, keyof M>
 
 export function mapObservablesToSelectors<M extends ObservablesMap>(map: M): ObservedSelectorsMap<M> {

src/throttledStore.tsx

@@ -2,7 +2,17 @@ import { Reducer, createStore, Store, ReducersMapObject, combineReducers, AnyAct
 import { devToolsEnhancer } from 'redux-devtools-extension'
 import { AppHostServicesProvider } from './appHostServices'
 import _ from 'lodash'
-import { AppHost, ExtensionSlot, ReducersMapObjectContributor, ObservableState, StateObserver, Shell, SlotKey } from './API'
+import {
+    AppHost,
+    ExtensionSlot,
+    ReducersMapObjectContributor,
+    ObservableState,
+    StateObserver,
+    Shell,
+    SlotKey,
+    ObservablesMap,
+    ObservedSelectorsMap
+} from './API'
 import { contributeInstalledShellsState } from './installedShellsState'
 import { interceptAnyObject } from './interceptAnyObject'
 import { invokeSlotCallbacks } from './invokeSlotCallbacks'
@@ -268,3 +278,47 @@ export const createObservable = <TState, TSelector>(
         current: getOrCreateCachedSelector
     }
 }
+
+export const createChainObservable = <TChainSelector, OM extends ObservablesMap>(
+    shell: Shell,
+    uniqueName: string,
+    observablesDependencies: OM,
+    chainFunction: (shell: Shell, observedDependencies: ObservedSelectorsMap<OM>) => TChainSelector
+): PrivateObservableState<any, TChainSelector> => {
+    const getDependenciesValues = (): ObservedSelectorsMap<OM> => {
+        return _.mapValues(observablesDependencies, observable => {
+            const selector = observable.current()
+            return selector
+        })
+    }
+    let currentValue: TChainSelector = chainFunction(shell, getDependenciesValues())
+
+    const subscribersSlotKey: SlotKey<StateObserver<TChainSelector>> = {
+        name: uniqueName
+    }
+    const observersSlot = shell.declareSlot(subscribersSlotKey)
+
+    const notify = () => {
+        invokeSlotCallbacks(observersSlot, currentValue)
+    }
+
+    for (const key in observablesDependencies) {
+        observablesDependencies[key].subscribe(shell, () => {
+            currentValue = chainFunction(shell, getDependenciesValues())
+            notify()
+        })
+    }
+
+    return {
+        subscribe(fromShell, callback) {
+            observersSlot.contribute(fromShell, callback)
+            return () => {
+                observersSlot.discardBy(item => item.contribution === callback)
+            }
+        },
+        notify,
+        current: () => {
+            return currentValue
+        }
+    }
+}