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

refactor(ExploreCtasResultsButton): convert to functional component #17939

Merged
Original file line number Diff line number Diff line change
Expand Up @@ -35,29 +35,23 @@ const propTypes = {
templateParams: PropTypes.string,
};

class ExploreCtasResultsButton extends React.PureComponent {
constructor(props) {
super(props);
this.visualize = this.visualize.bind(this);
this.onClick = this.onClick.bind(this);
}

onClick() {
this.visualize();
}

buildVizOptions() {
return {
datasourceName: this.props.table,
schema: this.props.schema,
dbId: this.props.dbId,
templateParams: this.props.templateParams,
};
}
const ExploreCtasResultsButton = (
table,
schema,
dbId,
templateParams,
errorMessage,
{ createCtasDatasource, addInfoToast, addDangerToast } = actions,
) => {
ChristopherCFleming marked this conversation as resolved.
Show resolved Hide resolved
const buildVizOptions = {
datasourceName: table,
schema,
dbId,
templateParams,
};

visualize() {
this.props.actions
.createCtasDatasource(this.buildVizOptions())
const visualize = () => {
createCtasDatasource(buildVizOptions())
ChristopherCFleming marked this conversation as resolved.
Show resolved Hide resolved
.then(data => {
const formData = {
datasource: `${data.table_id}__table`,
Expand All @@ -68,39 +62,35 @@ class ExploreCtasResultsButton extends React.PureComponent {
all_columns: [],
row_limit: 1000,
};
this.props.actions.addInfoToast(
t('Creating a data source and creating a new tab'),
);
addInfoToast(t('Creating a data source and creating a new tab'));

// open new window for data visualization
exploreChart(formData);
})
.catch(() => {
this.props.actions.addDangerToast(
this.props.errorMessage || t('An error occurred'),
);
addDangerToast(errorMessage || t('An error occurred'));
});
}
};

render() {
return (
<>
<Button
buttonSize="small"
onClick={this.onClick}
tooltip={t('Explore the result set in the data exploration view')}
>
<InfoTooltipWithTrigger
icon="line-chart"
placement="top"
label="explore"
/>{' '}
{t('Explore')}
</Button>
</>
);
}
}
const onClick = () => {
visualize();
};

return (
<Button
buttonSize="small"
onClick={onClick}
ChristopherCFleming marked this conversation as resolved.
Show resolved Hide resolved
tooltip={t('Explore the result set in the data exploration view')}
>
<InfoTooltipWithTrigger
icon="line-chart"
placement="top"
label="explore"
/>{' '}
{t('Explore')}
</Button>
);
};
ExploreCtasResultsButton.propTypes = propTypes;

function mapStateToProps({ sqlLab, common }) {
ChristopherCFleming marked this conversation as resolved.
Show resolved Hide resolved
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -733,7 +733,6 @@ export default class ResultSet extends React.PureComponent<
table={tempTable}
schema={tempSchema}
dbId={exploreDBId}
database={this.props.database}
ChristopherCFleming marked this conversation as resolved.
Show resolved Hide resolved
actions={this.props.actions}
/>
</ButtonGroup>
Expand Down