How to use kea - 10 common examples

// utils
import urlToState from 'lib/explorer/url-to-state'
import promptPopup from 'lib/popups/prompt'

// components
import ExplorerGraph from '~/scenes/explorer/graph'
import Spinner from 'lib/tags/spinner'

// logic
import dashboardLogic from '~/scenes/dashboard/logic'
import headerLogic from '~/scenes/header/logic'

import client from '~/client'
const resultsService = client.service('api/results')

@connect({
  actions: [
    headerLogic, [
      'openLocation'
    ],
    dashboardLogic, [
      'deleteItem',
      'renameItem'
    ]
  ],
  props: [
    dashboardLogic, [
      'items'
    ]
  ]
})
@Dimensions({ elementResize: true })

// utils

// components
import User from './user'
import Views from './views'
import Share from './share'
import CopyQuery from './copy-query'

// logic
import authLogic from '~/scenes/auth'
import headerLogic from '~/scenes/header/logic'
import sceneSaga from '~/scenes/header/saga'
import viewsSaga from '~/scenes/header/views/saga'

@connect({
  actions: [
    headerLogic, [
      'openLocation'
    ]
  ],
  props: [
    state => state.routing.locationBeforeTransitions, [
      'pathname',
      'search'
    ],
    authLogic, [
      'user',
      'runningInElectron'
    ]
  ],
  sagas: [

// libraries
import React, { Component } from 'react'
import PropTypes from 'prop-types'
import { connect } from 'kea'

// utils
import Dimensions from 'react-dimensions'

// components
import OneFilter from './one-filter'

// logic
import explorerLogic from '~/scenes/explorer/logic'

@connect({
  props: [
    explorerLogic, [
      'filter'
    ]
  ]
})
@Dimensions({ elementResize: true })
export default class Filter extends Component {
  static propTypes = {
    setFilterHeight: PropTypes.func
  }

  componentDidUpdate () {
    const { setFilterHeight } = this.props

    const element = this.refs.filter

import './styles.scss'

// libraries
import React, { Component } from 'react'
import { connect } from 'kea'

// utils
import { AnchorButton, Dialog, Classes, Intent, Button, Popover, Position, Menu, MenuItem, MenuDivider } from "@blueprintjs/core"
// components

// logic
import viewsLogic from '~/scenes/header/views/logic'

@connect({
  actions: [
    viewsLogic, [
      'setNewName',
      'openNew',
      'saveView',
      'cancelNew',
      'openView'
    ]
  ],
  props: [
    viewsLogic, [
      'newName',
      'newOpen',
      'sortedViews'
    ],
    state => state.routing.locationBeforeTransitions, [

}

  if (isClientSide) {
    const sagaMiddleware = createSagaMiddleware()
    const finalCreateStore = compose(
      applyMiddleware(sagaMiddleware),
      applyMiddleware(routerMiddleware(browserHistory)),
      window.devToolsExtension ? window.devToolsExtension() : f => f
    )(createStore)

    const store = createKeaStore(finalCreateStore, appReducers)
    sagaMiddleware.run(createRootSaga(appSaga))
    const history = syncHistoryWithStore(browserHistory, store)

    // TODO: check why do we need to do this?
    match({routes: getRoutes(Layout, store, routes), location: railsContext.location}, () => {})

    store.dispatch(initFromProps(props))

    // custom scenes
    store.addKeaScene(headerScene, true)

    return (
      
        
      
    )
  } else {
    // we aren't using this at the moment
  }
}

const store = createKeaStore(finalCreateStore, appReducers)
    sagaMiddleware.run(createRootSaga(appSaga))
    const history = syncHistoryWithStore(browserHistory, store)

    // TODO: check why do we need to do this?
    match({routes: getRoutes(Layout, store, routes), location: railsContext.location}, () => {})

    store.dispatch(initFromProps(props))

    // custom scenes
    store.addKeaScene(headerScene, true)

    return (
      
        
      
    )
  } else {
    // we aren't using this at the moment
  }
}

// libraries
import React, { Component } from 'react'
import { connect } from 'kea/logic'

// utils

// components

// logic
import $$camelScene$$ from '~/scenes/$$dash-scene$$/logic'
import $$camelComponent$$Logic from '~/scenes/$$dash-scene$$/$$path-component$$/logic'
import $$camelComponent$$Saga from '~/scenes/$$dash-scene$$/$$path-component$$/saga'

// const { SHOW_ALL, SHOW_ACTIVE, SHOW_COMPLETED } = $$camelScene$$.constants

@connect({
  actions: [
    $$camelScene$$, [
      // 'showAll',
      // 'setVisibilityFilter'
    ],
    $$camelComponent$$Logic, [
      //
    ]
  ],
  props: [
    $$camelScene$$, [
      // 'visibilityFilter'
    ],
    $$camelComponent$$Logic, [
      //
    ]

}

  const appReducers = {
    routing: routerReducer,
    rails: () => railsContext
  }

  if (isClientSide) {
    const sagaMiddleware = createSagaMiddleware()
    const finalCreateStore = compose(
      applyMiddleware(sagaMiddleware),
      applyMiddleware(routerMiddleware(browserHistory)),
      window.devToolsExtension ? window.devToolsExtension() : f => f
    )(createStore)

    const store = createKeaStore(finalCreateStore, appReducers)
    sagaMiddleware.run(createRootSaga(appSaga))
    const history = syncHistoryWithStore(browserHistory, store)

    // TODO: check why do we need to do this?
    match({routes: getRoutes(Layout, store, routes), location: railsContext.location}, () => {})

    store.dispatch(initFromProps(props))

    // custom scenes
    store.addKeaScene(headerScene, true)

    return (
      
        
      
    )

const appReducers = {
    routing: routerReducer,
    rails: () => railsContext
  }

  if (isClientSide) {
    const sagaMiddleware = createSagaMiddleware()
    const finalCreateStore = compose(
      applyMiddleware(sagaMiddleware),
      applyMiddleware(routerMiddleware(browserHistory)),
      window.devToolsExtension ? window.devToolsExtension() : f => f
    )(createStore)

    const store = createKeaStore(finalCreateStore, appReducers)
    sagaMiddleware.run(createRootSaga(appSaga))
    const history = syncHistoryWithStore(browserHistory, store)

    // TODO: check why do we need to do this?
    match({routes: getRoutes(Layout, store, routes), location: railsContext.location}, () => {})

    store.dispatch(initFromProps(props))

    // custom scenes
    store.addKeaScene(headerScene, true)

    return (
      
        
      
    )
  } else {

<div>
            {childNodes.filter(child =&gt; !localSearch || stringIn(localSearch.split(' ')[0], `${path}.${child.connection}`)).map(child =&gt; (
              
            ))}
          </div>
        ) : null}
      
    )
  }
}
const ConnectedNode = connect(connection)(Node)
export default ConnectedNode