eschutho commented on a change in pull request #14830:
URL: https://github.com/apache/superset/pull/14830#discussion_r645111959
##########
File path: superset-frontend/src/SqlLab/components/TableElement.jsx
##########
@@ -126,12 +108,11 @@ class TableElement extends React.PureComponent {
);
}
return header;
- }
+ };
- renderControls() {
+ const renderControls = () => {
let keyLink;
- const { table } = this.props;
- if (table.indexes && table.indexes.length > 0) {
+ if (table?.indexes.length > 0) {
Review comment:
if (table?.indexes?.length)
0 will be falsy, and it won't be negative. Also looks like indexes could be
null or undefined.
##########
File path: superset-frontend/src/SqlLab/components/TableElement.jsx
##########
@@ -156,26 +137,28 @@ class TableElement extends React.PureComponent {
{keyLink}
<IconTooltip
className={
- `fa fa-sort-${!this.state.sortColumns ? 'alpha' : 'numeric'}-asc `
+
+ `fa fa-sort-${!sortColumns ? 'alpha' : 'numeric'}-asc ` +
Review comment:
small nit, and this is from earlier code, but for readability:
``fa fa-sort-${sortColumns ? 'numeric' : 'alpha' }-asc ` +`
##########
File path: superset-frontend/src/SqlLab/components/TableElement.jsx
##########
@@ -156,26 +137,28 @@ class TableElement extends React.PureComponent {
{keyLink}
<IconTooltip
className={
- `fa fa-sort-${!this.state.sortColumns ? 'alpha' : 'numeric'}-asc `
+
+ `fa fa-sort-${!sortColumns ? 'alpha' : 'numeric'}-asc ` +
Review comment:
small nit, and this is from earlier code, but for readability:
`fa fa-sort-${sortColumns ? 'numeric' : 'alpha' }-asc ` +
##########
File path: superset-frontend/src/SqlLab/components/TableElement.jsx
##########
@@ -253,33 +232,54 @@ class TableElement extends React.PureComponent {
const metadata = (
<div
- onMouseEnter={() => this.setHover(true)}
- onMouseLeave={() => this.setHover(false)}
+ onMouseEnter={() => setHover(true)}
+ onMouseLeave={() => setHover(false)}
css={{ paddingTop: 6 }}
>
- {this.renderWell()}
+ {renderWell()}
<div>
- {cols &&
- cols.map(col => <ColumnElement column={col} key={col.name} />)}
+ {cols?.map(col => (
+ <ColumnElement column={col} key={col.name} />
+ ))}
</div>
</div>
);
return metadata;
- }
+ };
- render() {
- return (
- <Collapse.Panel
- {...this.props}
- header={this.renderHeader()}
- className="TableElement"
- forceRender="true"
- >
- {this.renderBody()}
- </Collapse.Panel>
- );
- }
-}
+ const collapseExpandIcon = () => (
+ <IconTooltip
+ style={{
+ position: 'fixed',
+ right: '16px',
+ left: 'auto',
+ fontSize: '12px',
+ transform: 'rotate(90deg)',
+ display: 'flex',
+ alignItems: 'center',
+ }}
+ aria-label="Collapse"
+ tooltip={t(`${!isActive ? 'Expand' : 'Collapse'} table preview`)}
Review comment:
can you do the same thing here?
tooltip={t(`${isActive ? 'Collapse' : 'Expand'} table preview`)}
##########
File path: superset-frontend/src/SqlLab/components/TableElement.jsx
##########
@@ -126,12 +108,11 @@ class TableElement extends React.PureComponent {
);
}
return header;
- }
+ };
- renderControls() {
+ const renderControls = () => {
let keyLink;
- const { table } = this.props;
- if (table.indexes && table.indexes.length > 0) {
+ if (table?.indexes.length > 0) {
Review comment:
a lot of people still prefer foo.length > 0, so it's not wrong, just a
personal preference. :)
--
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
For queries about this service, please contact Infrastructure at:
[email protected]
---------------------------------------------------------------------
To unsubscribe, e-mail: [email protected]
For additional commands, e-mail: [email protected]
