How to use @codewithdan/observable-store - 10 common examples

import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
import { ObservableStore } from '@codewithdan/observable-store';
import { ReduxDevToolsExtension } from '@codewithdan/observable-store-extensions';

import { AppModule } from './app/app.module';
import { environment } from './environments/environment';

if (environment.production) {
  enableProdMode();
}

// Set Observable Store globalSettings here since 
// it'll be called before the rest of the app loads
ObservableStore.globalSettings = { isProduction: environment.production };
if (!environment.production) {
  ObservableStore.addExtension(new ReduxDevToolsExtension());
}

platformBrowserDynamic().bootstrapModule(AppModule)
  .catch(err => console.log(err));

import { enableProdMode } from '@angular/core';
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';

import { AppModule } from './app/app.module';
import { environment } from './environments/environment';
import { ObservableStore } from '@codewithdan/observable-store';
import { ReduxDevToolsExtension } from '@codewithdan/observable-store-extensions';

if (environment.production) {
  enableProdMode();
}

// Set ObservableStore globalSettings here since 
// it'll be called before the rest of the app loads
ObservableStore.globalSettings = { isProduction: environment.production };
ObservableStore.addExtension(new ReduxDevToolsExtension());

platformBrowserDynamic().bootstrapModule(AppModule)
  .catch(err => console.error(err));

import { AppModule } from './app/app.module';
import { environment } from './environments/environment';
import { AppDevModule } from './app/app-dev.module';
import { ObservableStore } from '@codewithdan/observable-store';
import { ReduxDevToolsExtension } from '@codewithdan/observable-store-extensions';

if (environment.production) {
  enableProdMode();
}

// Set ObservableStore globalSettings here since 
// it'll be called before the rest of the app loads
ObservableStore.globalSettings = { isProduction: environment.production };
if (!environment.production) {
  ObservableStore.addExtension(new ReduxDevToolsExtension());
}

// platformBrowserDynamic().bootstrapModule(AppModule)
platformBrowserDynamic()
  .bootstrapModule(AppDevModule)
  .catch(err => console.log(err));

import { enableProdMode } from '@angular/core';
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';

import { AppModule } from './app/app.module';
import { environment } from './environments/environment';
import { ObservableStore, ReduxDevToolsExtension } from '@codewithdan/observable-store';

if (environment.production) {
  enableProdMode();
}

// Set ObservableStore globalSettings here since 
// it'll be called before the rest of the app loads
ObservableStore.globalSettings = { isProduction: environment.production };
ObservableStore.addExtension(new ReduxDevToolsExtension());

platformBrowserDynamic().bootstrapModule(AppModule)
  .catch(err => console.log(err));

import { enableProdMode } from '@angular/core';
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';

import { AppModule } from './app/app.module';
import { environment } from './environments/environment';
import { AppDevModule } from './app/app-dev.module';
import { ObservableStore } from '@codewithdan/observable-store';
import { ReduxDevToolsExtension } from '@codewithdan/observable-store-extensions';

if (environment.production) {
  enableProdMode();
}

// Set ObservableStore globalSettings here since 
// it'll be called before the rest of the app loads
ObservableStore.globalSettings = { isProduction: environment.production };
if (!environment.production) {
  ObservableStore.addExtension(new ReduxDevToolsExtension());
}

// platformBrowserDynamic().bootstrapModule(AppModule)
platformBrowserDynamic()
  .bootstrapModule(AppDevModule)
  .catch(err => console.log(err));

import { enableProdMode } from '@angular/core';
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';

import { AppModule } from './app/app.module';
import { environment } from './environments/environment';
import { ObservableStore, ReduxDevToolsExtension } from '@codewithdan/observable-store';

if (environment.production) {
  enableProdMode();
}

// Set ObservableStore globalSettings here since 
// it'll be called before the rest of the app loads
ObservableStore.globalSettings = { isProduction: environment.production };
ObservableStore.addExtension(new ReduxDevToolsExtension());

platformBrowserDynamic().bootstrapModule(AppModule)
  .catch(err => console.log(err));

import { enableProdMode } from '@angular/core';
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';

import { AppModule } from './app/app.module';
import { environment } from './environments/environment';
import { ObservableStore } from '@codewithdan/observable-store';
import { ReduxDevToolsExtension } from '@codewithdan/observable-store-extensions';

if (environment.production) {
  enableProdMode();
}

// Set ObservableStore globalSettings here since 
// it'll be called before the rest of the app loads
ObservableStore.globalSettings = { isProduction: environment.production };
ObservableStore.addExtension(new ReduxDevToolsExtension());

platformBrowserDynamic().bootstrapModule(AppModule)
  .catch(err => console.error(err));

import { enableProdMode } from '@angular/core';
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
import { ObservableStore } from '@codewithdan/observable-store';
import { ReduxDevToolsExtension } from '@codewithdan/observable-store-extensions';

import { AppModule } from './app/app.module';
import { environment } from './environments/environment';

if (environment.production) {
  enableProdMode();
}

// Set Observable Store globalSettings here since 
// it'll be called before the rest of the app loads
ObservableStore.globalSettings = { isProduction: environment.production };
if (!environment.production) {
  ObservableStore.addExtension(new ReduxDevToolsExtension());
}

platformBrowserDynamic().bootstrapModule(AppModule)
  .catch(err => console.log(err));

private dispatchDevToolsState(state: any, action: string) {
        // Set devtools state for each service but don't dispatch state
        // since it will also dispatch global state by default when setState() is called
        for (let service of ObservableStore.allStoreServices) {
            service.setState(state, action, false);
            // dispatch service state but not global state
            service.dispatchState(state, false);
        }

        // dispatch global state changes
        this.dispatchState(state);
    }

import React from 'react';
import ReactDOM from 'react-dom';
import './index.css';
import Routes, { history } from './Routes';
import * as serviceWorker from './serviceWorker';
import { ObservableStore } from '@codewithdan/observable-store';
import { ReduxDevToolsExtension } from '@codewithdan/observable-store-extensions';

const production = process.env.NODE_ENV === 'production';

ObservableStore.globalSettings = { isProduction: production };
if (!production) {
  ObservableStore.addExtension(new ReduxDevToolsExtension({ reactRouterHistory: history }));
}

ReactDOM.render(, document.getElementById('root'));

serviceWorker.unregister();