Skip to content
Snippets Groups Projects
Commit 6f8c5e82 authored by Simon Belak's avatar Simon Belak
Browse files

Merge branch 'fingerprints-poc' of github.com:metabase/metabase into fingerprints-poc

parents 3d21bc1e 99b5cb7f
No related branches found
No related tags found
No related merge requests found
Hide whitespace changes
Inline Side-by-side
frontend/src/metabase/xray/Histogram.jsx
+ 2
− 2
View file @ 6f8c5e82
import React from 'react'
import Visualization from 'metabase/visualizations/components/Visualization'
const Histogram = ({ fingerprint }) =>
const Histogram = ({ histogram }) =>
<Visualization
className="full-height"
series={[
......@@ -10,7 +10,7 @@ const Histogram = ({ fingerprint }) =>
display: "bar",
visualization_settings: {}
},
data: fingerprint.histogram
data: histogram
}
]}
showTitle={false}
......
frontend/src/metabase/xray/containers/FieldXray.jsx
+ 28
− 3
View file @ 6f8c5e82
......@@ -2,7 +2,8 @@
import React, { Component } from 'react'
import { connect } from 'react-redux'
import title from "metabase/hoc/Title";
import title from 'metabase/hoc/Title'
import { Link } from 'react-router'
import { fetchFieldFingerPrint, changeCost } from 'metabase/reference/reference'
......@@ -16,6 +17,9 @@ import CostSelect from 'metabase/xray/components/CostSelect'
import Histogram from 'metabase/xray/Histogram'
import SimpleStat from 'metabase/xray/SimpleStat'
import { isDate } from 'metabase/lib/schema_metadata'
const PERIODICITY = ['day', 'week', 'month', 'hour', 'quarter']
type Props = {
fetchFieldFingerPrint: () => void,
......@@ -27,7 +31,10 @@ const FieldOverview = ({ fingerprint, stats }) =>
{ stats.map(stat =>
fingerprint[stat] && (
<li className="my2">
<SimpleStat stat={fingerprint[stat]} label={stat} />
<SimpleStat
stat={fingerprint[stat]}
label={stat}
/>
</li>
)
)}
......@@ -89,6 +96,9 @@ class FieldXRay extends Component {
<div className="full">
<div className="my4 flex align-center">
<Link to={`/xray/table/${fingerprint.table.id}/approximate`}>
{fingerprint.table.display_name}
</Link>
<h1>
{fingerprint.field.display_name} stats
</h1>
......@@ -103,7 +113,7 @@ class FieldXRay extends Component {
<div className="mt4">
<h3 className="py2 border-bottom">Distribution</h3>
<div className="my4" style={{ height: 300, width: '100%' }}>
<Histogram fingerprint={fingerprint} />
<Histogram histogram={fingerprint.histogram} />
</div>
</div>
......@@ -120,6 +130,21 @@ class FieldXRay extends Component {
</div>
</div>
{ isDate(fingerprint.field) && [
<Heading heading="Periodicity" />,
<div className="Grid Grid--gutters">
{ PERIODICITY.map(period =>
fingerprint[`histogram-${period}`] && (
<div className="Grid-cell" style={{ height: 120 }}>
<Histogram
histogram={fingerprint[`histogram-${period}`]}
/>
</div>
)
)}
</div>
]}
<a className="link" onClick={() => this.setState({ showRaw: !this.state.showRaw })}>
{ this.state.showRaw ? 'Hide' : 'Show' } raw response (debug)
</a>
......
frontend/src/metabase/xray/containers/TableXRay.jsx
+ 35
− 31
View file @ 6f8c5e82
......@@ -9,6 +9,8 @@ import {
changeCost
} from 'metabase/reference/reference'
import Histogram from 'metabase/xray/Histogram'
import COSTS from 'metabase/xray/costs'
import CostSelect from 'metabase/xray/components/CostSelect'
......@@ -41,7 +43,7 @@ const mapDispatchToProps = {
}
@connect(mapStateToProps, mapDispatchToProps)
@title(() => "Table")
@title(({ fingerprint }) => fingerprint && fingerprint.table.display_name || "Table")
class TableXRay extends Component {
props: Props
......@@ -73,39 +75,41 @@ class TableXRay extends Component {
}
render () {
const { constituents, params } = this.props
const { constituents, fingerprint, params } = this.props
return (
<div className="wrapper" style={{ marginLeft: '6em', marginRight: '6em'}}>
<div className="my4 flex align-center py4">
<h1>Xray</h1>
<div className="ml-auto">
Fidelity:
<CostSelect
currentCost={params.cost}
onChange={this.changeCost}
/>
<LoadingAndErrorWrapper loading={!constituents}>
{ () =>
<div className="wrapper" style={{ paddingLeft: '6em', paddingRight: '6em'}}>
<div className="my4 flex align-center py4">
<h1>{ fingerprint.table.display_name }</h1>
<div className="ml-auto">
Fidelity:
<CostSelect
currentCost={params.cost}
onChange={this.changeCost}
/>
</div>
</div>
<ol className="Grid Grid--1of3">
{ constituents.map(c => {
return (
<li className="Grid-cell">
<div className="full">
<Link to={`xray/field/${c.field.id}/approximate`}>
{c.field.display_name}
<div style={{ height: 120 }}>
<Histogram histogram={c.histogram} />
</div>
</Link>
</div>
</li>
)
})}
</ol>
</div>
</div>
<LoadingAndErrorWrapper loading={!constituents}>
{ () =>
<ol>
{ constituents.map(c => {
console.log(c)
return (
<li>
<div className="full">
<Link to={`xray/field/${c.field.id}/approximate`}>
{c.field.display_name}
</Link>
</div>
</li>
)
})}
</ol>
}
</LoadingAndErrorWrapper>
</div>
}
</LoadingAndErrorWrapper>
)
}
}
......
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment