How to use the kea.connect function in kea

// 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, [

<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

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

import Dimensions from 'react-dimensions'
import { Graph } from 'insights-charts'

import ControlsLeft from './controls-left'
import CompareWith from './compare-with'
import ControlsRight from './controls-right'

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

export const colors = ['#1f77b4', '#ff7f0e', '#2ca02c', '#d62728', '#9467bd', '#8c564b', '#e377c2', '#7f7f7f', '#bcbd22', '#17becf']

@Dimensions({ elementResize: true })
@connect({
  props: [
    explorerLogic, [
      'graph',
      'graphControls',
      'graphTimeGroup'
    ]
  ]
})
export default class GraphView extends Component {
  render () {
    const { graph, graphControls, graphTimeGroup, containerHeight } = this.props

    return (
      <div>
        <div style="{{">
          </div></div>

if (favourites[path]) {
      removeFavouriteRequest(path)
    } else {
      addFavouriteRequest(path)
    }
  }

  render () {
    const { path, favourites } = this.props

    return (
      <span>{favourites[path] ? '⭐' : '☆'}</span>
    )
  }
}
const ConnectedFavouriteStar = connect(connection)(FavouriteStar)
export default ConnectedFavouriteStar

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

import 'react-datetime/css/react-datetime.css'
import range from 'lib/utils/range'

import getMeta from 'lib/explorer/get-meta'

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

@connect({
  actions: [
    explorerLogic, [
      'setSort',
      'removeColumnWithIndex',
      'addEmptyFilter',
      'removeFiltersByKey',
      'setTransform',
      'setFacetsColumn',
      'setFacetsCount'
    ]
  ],
  props: [
    explorerLogic, [
      'sort',
      'filter',
      'columnsMeta',

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

import messg from 'messg'

import deletePopup from 'lib/popups/delete'

import connectionsLogic from '~/scenes/connections/logic'

@connect({
  actions: [
    connectionsLogic, [
      'editConnection',
      'testConnection',
      'removeConnection',
      'viewStructure'
    ]
  ]
})
export default class Connection extends Component {
  constructor (props) {
    super(props)

    this.state = {
      url: props.connection.url,
      structurePath: props.connection.structurePath,

import { connect } from 'kea'
import PropTypes from 'prop-types'
import moment from 'moment'

import DateTime from 'react-datetime'
import 'react-datetime/css/react-datetime.css'

import Tooltip from 'rc-tooltip'
import getMeta from 'lib/explorer/get-meta'

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

const sanitizeNumber = (str) => str.replace(/[^0-9.]/g, '')
const sanitizeListNumber = (str) => str.replace(/[^0-9., ]/g, '')

@connect({
  actions: [
    explorerLogic, [
      'addFilter',
      'setFilter',
      'removeFilter'
    ]
  ],
  props: [
    explorerLogic, [
      'sort',
      'columnsMeta',
      'structure'
    ]
  ]
})
export default class OneFilter extends Component {