cluedin-widget/core/components/bootstrap.jsx

This is the project for creating and managing widgets in CluedIn.

var __cluedIn = window.__cluedIn || {};

import React from 'react'
import ReactDOM from 'react-dom'
import ReactIntl from  'react-intl';
import localesInfo from '../../locales/en.js';

import { createStore, applyMiddleware, combineReducers } from 'redux'
import { Provider } from 'react-redux'
import reducers from '../reducers/index'
import thunkMiddleware from 'redux-thunk'
import createLogger from 'redux-logger'
import CluedInApp from './cluedinapp.jsx'
const loggerMiddleware = createLogger();

import cookie from '../helpers/cookie';
import config from '../config';
import CluedInHeader from './structure/CluedInHeader.jsx';
import SearchPage from './search/searchPage.jsx';
import { linkRealTimeWithStore } from '../realtime';

let timeOut;
let IntlProvider = ReactIntl.IntlProvider;

const createStoreWithMiddleware = applyMiddleware(
    thunkMiddleware,
    loggerMiddleware
)( createStore );

const initialState = {
    core: {
        token: __cluedIn.token || '',
        layout: {},
        org: __cluedIn.org,
        connectedData: []
    }
};

const reducer = combineReducers( Object.assign( {}, reducers ) );

const store = createStoreWithMiddleware( reducer, initialState );

linkRealTimeWithStore( store );

var inject = ( DOMElement ) => {

    DOMElement.__injected = true;
    let timeStamp         = Date.now();

    DOMElement.addEventListener( "cluedIn_destroy", function() {
        if( !DOMElement.hasAttribute( 'noDestroy' ) ) {
            ReactDOM.unmountComponentAtNode( DOMElement );
        }
    }, false );

    var typeAttribute = DOMElement.getAttribute( config.DOM.typeAttribute );
    var id            = DOMElement.getAttribute( config.DOM.idAttribute );

    ReactDOM.render(
        <Provider store={store}>
            <IntlProvider locale={localesInfo.locale} messages={localesInfo.messages}>
                <CluedInApp type={typeAttribute} index={timeStamp} entityId={id}></CluedInApp>
            </IntlProvider>
        </Provider>,
        DOMElement
    );
};

var checkIfCluedInPresent = () => {
    var cluedInElements = document.querySelectorAll( 'cluedin' );

    if( cluedInElements ) {
        cluedInElements = Array.prototype.slice.apply( cluedInElements, [ 0 ] );

        cluedInElements.forEach( ( cluedIn, index )=> {
            if( cluedIn && !cluedIn.__injected ) {
                inject( cluedIn, index );
            }
        } );
    }
};

timeOut = setInterval( checkIfCluedInPresent, 200 );