Refactor SourceIndicator to use context API
parent
239e4b9656
commit
fc361aa57d
|
@ -1,50 +1,46 @@
|
|||
import React, {SFC} from 'react'
|
||||
import PropTypes from 'prop-types'
|
||||
import _ from 'lodash'
|
||||
import uuid from 'uuid'
|
||||
|
||||
import ReactTooltip from 'react-tooltip'
|
||||
|
||||
import {SourceContext} from 'src/CheckSources'
|
||||
import {Source} from 'src/types'
|
||||
|
||||
interface Props {
|
||||
sourceOverride?: Source
|
||||
}
|
||||
|
||||
const SourceIndicator: SFC<Props> = ({sourceOverride}, {source}) => {
|
||||
if (!source) {
|
||||
return null
|
||||
}
|
||||
|
||||
const getTooltipText = (source: Source, sourceOverride: Source): string => {
|
||||
const {name, url} = source
|
||||
const sourceName: string = _.get(sourceOverride, 'name', name)
|
||||
const sourceUrl: string = _.get(sourceOverride, 'url', url)
|
||||
|
||||
const sourceNameTooltip: string = `<h1>Connected to Source:</h1><p><code>${sourceName} @ ${sourceUrl}</code></p>`
|
||||
return `<h1>Connected to Source:</h1><p><code>${sourceName} @ ${sourceUrl}</code></p>`
|
||||
}
|
||||
|
||||
const SourceIndicator: SFC<Props> = ({sourceOverride}) => {
|
||||
const uuidTooltip: string = uuid.v4()
|
||||
|
||||
return (
|
||||
<div
|
||||
className="source-indicator"
|
||||
data-for={uuidTooltip}
|
||||
data-tip={sourceNameTooltip}
|
||||
>
|
||||
<span className="icon disks" />
|
||||
<ReactTooltip
|
||||
id={uuidTooltip}
|
||||
effect="solid"
|
||||
html={true}
|
||||
place="left"
|
||||
class="influx-tooltip"
|
||||
/>
|
||||
</div>
|
||||
<SourceContext.Consumer>
|
||||
{(source: Source) => (
|
||||
<div
|
||||
className="source-indicator"
|
||||
data-for={uuidTooltip}
|
||||
data-tip={getTooltipText(source, sourceOverride)}
|
||||
>
|
||||
<span className="icon disks" />
|
||||
<ReactTooltip
|
||||
id={uuidTooltip}
|
||||
effect="solid"
|
||||
html={true}
|
||||
place="left"
|
||||
class="influx-tooltip"
|
||||
/>
|
||||
</div>
|
||||
)}
|
||||
</SourceContext.Consumer>
|
||||
)
|
||||
}
|
||||
|
||||
const {shape} = PropTypes
|
||||
|
||||
SourceIndicator.contextTypes = {
|
||||
source: shape({}),
|
||||
}
|
||||
|
||||
export default SourceIndicator
|
||||
|
|
Loading…
Reference in New Issue