Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[Explore] Adding custom expressions to adhoc metrics #4736

Conversation

gabe-lyons
Copy link

@gabe-lyons gabe-lyons commented Apr 2, 2018

This is a followup to #4663. Sometimes you want more flexibility than the simple adhoc metric allows for. This PR adds a second tab that allows someone to define a metric as arbitrary sql. It also may be an easier UI for SQL lovers.

I also made sure the transitions between the two tabs are as seamless as possible, so from a user perspective it should feel like two views into the same metric definition.

demo of more advanced expressions:
advncdexpr

demo of seamless transitions:
transistns2

Unfortunately had to disable this feature on druid datasources because it seems like superset doesn't support querying druid via sql yet? Or does it? @betodealmeida @mistercrunch any idea how hard it would be to integrate this with druid?

test plan:

  • calculated some advanced metrics I could check (like SUM(value) + 100, SUM(value)/COUNT(DISTINCT target)) and verified that their outputs were correct as shown in video Add pandas-highcharts as requirements #1
  • checked transitions as shown in video Fix documentation #2
  • loaded druid datasource and verified the second tab did not appear
  • ran the specs

future work:

  • would love to integrate this with druid

reviewers:
@michellethomas @williaster @graceguo-supercat @mistercrunch

@gabe-lyons gabe-lyons force-pushed the gabe_adding_custom_expressions_adhoc_metrics branch 3 times, most recently from 7643d21 to c0bf117 Compare April 2, 2018 17:40
@codecov-io
Copy link

codecov-io commented Apr 2, 2018

Codecov Report

Merging #4736 into master will increase coverage by 0.03%.
The diff coverage is 78.99%.

Impacted file tree graph

@@            Coverage Diff             @@
##           master    #4736      +/-   ##
==========================================
+ Coverage   72.33%   72.36%   +0.03%     
==========================================
  Files         208      208              
  Lines       15568    15662      +94     
  Branches     1204     1227      +23     
==========================================
+ Hits        11261    11334      +73     
- Misses       4304     4325      +21     
  Partials        3        3
Impacted Files Coverage Δ
...ripts/explore/components/MetricDefinitionValue.jsx 94.11% <ø> (+5.22%) ⬆️
superset/utils.py 88.1% <100%> (+0.02%) ⬆️
superset/assets/javascripts/explore/constants.js 100% <100%> (ø) ⬆️
...s/javascripts/explore/propTypes/adhocMetricType.js 100% <100%> (ø) ⬆️
...pts/explore/components/controls/MetricsControl.jsx 78.62% <100%> (-0.3%) ⬇️
...javascripts/SqlLab/components/AceEditorWrapper.jsx 76.05% <100%> (ø) ⬆️
...vascripts/explore/components/AdhocMetricOption.jsx 91.3% <66.66%> (-3.7%) ⬇️
...ipts/explore/components/AdhocMetricEditPopover.jsx 79.16% <78.43%> (-4.17%) ⬇️
superset/connectors/sqla/models.py 76.32% <9.09%> (-1.11%) ⬇️
superset/assets/javascripts/explore/AdhocMetric.js 94.91% <93.18%> (-5.09%) ⬇️

Continue to review full report at Codecov.

Legend - Click here to learn more
Δ = absolute <relative> (impact), ø = not affected, ? = missing data
Powered by Codecov. Last update daf9a3b...6a8dde6. Read the comment docs.

@gabe-lyons gabe-lyons force-pushed the gabe_adding_custom_expressions_adhoc_metrics branch from c0bf117 to fe895c5 Compare April 3, 2018 20:46
@gabe-lyons
Copy link
Author

Updated based on comments from team at Airbnb-

a) now the smart defaults in the simple tab will only be inferred when the simple tab can entirely describe the advanced sql expression. if not, the simple tabs defaults will be blank.

b) the window can be resized if you want more working space in the advanced sql editor view

heres a gif describing both features:
defaultsandresize

@williaster
Copy link
Contributor

williaster commented Apr 3, 2018

@GabeLoins can we get a design pass on this before merging? I'm mostly concerned about the size of the tabs and the strange offset once you resize the popover container

@gabe-lyons gabe-lyons force-pushed the gabe_adding_custom_expressions_adhoc_metrics branch from fe895c5 to 772e676 Compare April 3, 2018 23:12
@gabe-lyons
Copy link
Author

@williaster good points. Adjusted tab widths and made it so the resize doesn't affect the arrow positioning. both features are demoed here:

resize2

@mistercrunch
Copy link
Member

It's no biggy to me but tabs are usually used to organize heavy amounts of content, we probably could get away without using them at all. What about using the PopoverSection component?

wgwj8jhauh

@gabe-lyons
Copy link
Author

@mistercrunch yeah I definitely considered that as well when working on it. The big motivator for going with tabs is that the metric definitions could easily hit 4-5 lines if someone was defining a case/if statment. I wanted to give the Ace editor a good amount of space by default so that would be possible.

Copy link
Contributor

@williaster williaster left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

a couple super tiny comments, looks great overall and a 🔥 feature!


isValid() {
if (this.expressionType === EXPRESSION_TYPES.SIMPLE) {
return !!(this.column && this.aggregate);
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Boolean() also works fyi

Copy link
Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Airbnb js style guide prefer !! to Boolean(...)- not sure if we have a different style guide for this project, but I like their advice on the whole.

https://github.com/airbnb/javascript#coercion--booleans

aggregate: aggregate && aggregate.aggregate,
}),
});
this.setState({ adhocMetric: this.state.adhocMetric.duplicateWith({
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

nit -- I would newline adhocMetric, wish we had better lint rules enabled! 🙉

}

componentWillUnmount() {
document.removeEventListener('mouseup', this.onMouseUp);
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

unlikely sitch, but could also call document.removeEventListener('mousemove', this.onMouseMove); to be safe

Copy link
Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

oooh good call

const stateIsValid = this.state.adhocMetric.column && this.state.adhocMetric.aggregate;
const hasUnsavedChanges = this.state.adhocMetric.equals(this.props.adhocMetric);
const stateIsValid = adhocMetric.isValid();
const hasUnsavedChanges = adhocMetric.equals(propsAdhocMetric);
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

is this backwards? or I'm reading it wrong? I guess I'd expect equals to return true if they're the same which would mean no unsaved changes?

Copy link
Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

ah you're totally right- everything works because I'm also using it wrong in the render body 🤕

}

onPopoverResize() {
this.forceUpdate();
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

nit indent

@@ -44,6 +50,7 @@ export default class AdhocMetricOption extends React.PureComponent {
disabled
overlay={overlay}
rootClose
shouldUpdatePosition
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

🎉 thanks again for adding this!

@@ -82,4 +95,95 @@ describe('AdhocMetric', () => {

expect(adhocMetric2.label).to.equal('label1');
});

it('can determines if it is valid', () => {
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

nit remove determines 's'

this.expressionType = adhocMetric.expressionType || EXPRESSION_TYPES.SIMPLE;
if (this.expressionType === EXPRESSION_TYPES.SIMPLE) {
const inferredColumn = inferSqlExpressionColumn(adhocMetric);
this.column = adhocMetric.column || (inferredColumn && { column_name: inferredColumn });
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Just to make sure I understand, inferSqlExpressionColumn is necessary if adhocMetric was a sql expression typed previously when EXPRESSION_TYPES was SQL correct? There's a lot going on in this section, maybe we could add a few comments to clarify?

@gabe-lyons gabe-lyons force-pushed the gabe_adding_custom_expressions_adhoc_metrics branch from 772e676 to db7b41f Compare April 13, 2018 00:31
@gabe-lyons
Copy link
Author

@michellethomas @williaster addressed your comments, should be ready to merge!

@gabe-lyons gabe-lyons force-pushed the gabe_adding_custom_expressions_adhoc_metrics branch from db7b41f to 6a8dde6 Compare April 13, 2018 16:34
@williaster
Copy link
Contributor

thanks @GabeLoins! lgtm!

@williaster williaster merged commit 8669874 into apache:master Apr 13, 2018
@mistercrunch
Copy link
Member

cheers

michellethomas pushed a commit to michellethomas/panoramix that referenced this pull request May 24, 2018
* adding custom expressions to adhoc metrics

* adjusted transitions and made the box expandable
timifasubaa pushed a commit to timifasubaa/incubator-superset that referenced this pull request May 31, 2018
* adding custom expressions to adhoc metrics

* adjusted transitions and made the box expandable
wenchma pushed a commit to wenchma/incubator-superset that referenced this pull request Nov 16, 2018
* adding custom expressions to adhoc metrics

* adjusted transitions and made the box expandable
@mistercrunch mistercrunch added 🏷️ bot A label used by `supersetbot` to keep track of which PR where auto-tagged with release labels 🚢 0.25.0 labels Feb 27, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
🏷️ bot A label used by `supersetbot` to keep track of which PR where auto-tagged with release labels 🚢 0.25.0
Projects
None yet
Development

Successfully merging this pull request may close these issues.

5 participants