You are viewing a plain text version of this content. The canonical link for it is here.
Posted to notifications@superset.apache.org by GitBox <gi...@apache.org> on 2021/02/12 20:28:39 UTC

[GitHub] [superset] AAfghahi opened a new pull request #13098: refactor: HighligthedSQL into functional component with Typescript 

AAfghahi opened a new pull request #13098:
URL: https://github.com/apache/superset/pull/13098


   ### SUMMARY
   Changed HighlightSql.jsx from a class component to a functional component and converted into tsx.
   
   
   ### BEFORE/AFTER SCREENSHOTS OR ANIMATED GIF
   <!--- Skip this if not applicable -->
   ![image](https://user-images.githubusercontent.com/48933336/107819270-de523580-6d46-11eb-8d0b-956847774992.png)
   
   ### TEST PLAN
   Passes all tests in spec. 
   ### ADDITIONAL INFORMATION
   <!--- Check any relevant boxes with "x" -->
   <!--- HINT: Include "Fixes #nnn" if you are fixing an existing issue -->
   - [ ] Has associated issue:
   - [ ] Changes UI
   - [ ] Requires DB Migration.
   - [ ] Confirm DB Migration upgrade and downgrade tested.
   - [ ] Introduces new feature or API
   - [ ] Removes existing feature or API
   


----------------------------------------------------------------
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:
users@infra.apache.org



---------------------------------------------------------------------
To unsubscribe, e-mail: notifications-unsubscribe@superset.apache.org
For additional commands, e-mail: notifications-help@superset.apache.org

[GitHub] [superset] betodealmeida commented on a change in pull request #13098: refactor: HighligthedSQL into functional component with Typescript

Posted by GitBox <gi...@apache.org>.
betodealmeida commented on a change in pull request #13098:
URL: https://github.com/apache/superset/pull/13098#discussion_r575528925



##########
File path: superset-frontend/src/SqlLab/components/HighlightedSql.tsx
##########
@@ -27,93 +26,91 @@ import ModalTrigger from '../../components/ModalTrigger';
 
 SyntaxHighlighter.registerLanguage('sql', sql);
 
-const defaultProps = {
-  maxWidth: 50,
-  maxLines: 5,
-  shrink: false,
-};
+interface propTypes {
+  sql: string;
+  rawSql?: string;
+  maxWidth?: number;
+  maxLines?: number;
+  shrink?: any;
+}
 
-const propTypes = {
-  sql: PropTypes.string.isRequired,
-  rawSql: PropTypes.string,
-  maxWidth: PropTypes.number,
-  maxLines: PropTypes.number,
-  shrink: PropTypes.bool,
-};
+interface HighlightedSqlModalTypes {
+  rawSql?: string;
+  sql: string;
+}
 
-class HighlightedSql extends React.Component {
-  constructor(props) {
-    super(props);
-    this.state = {
-      modalBody: null,
-    };
-  }
+interface TriggerNodeProps {
+  shrink: boolean;
+  sql: string;
+  maxLines: number;
+  maxWidth: number;
+}
 
-  shrinkSql() {
-    const ssql = this.props.sql || '';
+function TriggerNode({ shrink, sql, maxLines, maxWidth }: TriggerNodeProps) {
+  const shrinkSql = () => {
+    const ssql = sql || '';
     let lines = ssql.split('\n');
-    if (lines.length >= this.props.maxLines) {
-      lines = lines.slice(0, this.props.maxLines);
+    if (lines.length >= maxLines) {
+      lines = lines.slice(0, maxLines);
       lines.push('{...}');
     }
     return lines
       .map(line => {
-        if (line.length > this.props.maxWidth) {
-          return `${line.slice(0, this.props.maxWidth)}{...}`;
+        if (line.length > maxWidth) {
+          return `${line.slice(0, maxWidth)}{...}`;
         }
         return line;
       })
       .join('\n');
-  }
+  };
 
-  triggerNode() {
-    const shownSql = this.props.shrink
-      ? this.shrinkSql(this.props.sql)
-      : this.props.sql;
-    return (
+  return (
+    <SyntaxHighlighter language="sql" style={github}>
+      {shrink ? shrinkSql() : sql}

Review comment:
       Right, make it a top-level function with signature `const shrinkSql = (sql) => { ... };`.




----------------------------------------------------------------
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:
users@infra.apache.org



---------------------------------------------------------------------
To unsubscribe, e-mail: notifications-unsubscribe@superset.apache.org
For additional commands, e-mail: notifications-help@superset.apache.org

[GitHub] [superset] codecov-io edited a comment on pull request #13098: refactor: HighligthedSQL into functional component with Typescript

Posted by GitBox <gi...@apache.org>.
codecov-io edited a comment on pull request #13098:
URL: https://github.com/apache/superset/pull/13098#issuecomment-778475124


   # [Codecov](https://codecov.io/gh/apache/superset/pull/13098?src=pr&el=h1) Report
   > Merging [#13098](https://codecov.io/gh/apache/superset/pull/13098?src=pr&el=desc) (473716d) into [master](https://codecov.io/gh/apache/superset/commit/2ce79823dfad61bce6196fcacd56a844f44818c0?el=desc) (2ce7982) will **increase** coverage by `19.90%`.
   > The diff coverage is `68.75%`.
   
   [![Impacted file tree graph](https://codecov.io/gh/apache/superset/pull/13098/graphs/tree.svg?width=650&height=150&src=pr&token=KsB0fHcx6l)](https://codecov.io/gh/apache/superset/pull/13098?src=pr&el=tree)
   
   ```diff
   @@             Coverage Diff             @@
   ##           master   #13098       +/-   ##
   ===========================================
   + Coverage   53.06%   72.96%   +19.90%     
   ===========================================
     Files         489      547       +58     
     Lines       17314    20225     +2911     
     Branches     4482     5297      +815     
   ===========================================
   + Hits         9187    14757     +5570     
   + Misses       8127     5343     -2784     
   - Partials        0      125      +125     
   ```
   
   | Flag | Coverage Δ | |
   |---|---|---|
   | cypress | `53.37% <40.74%> (+0.31%)` | :arrow_up: |
   | javascript | `61.85% <62.50%> (?)` | |
   
   Flags with carried forward coverage won't be shown. [Click here](https://docs.codecov.io/docs/carryforward-flags#carryforward-flags-in-the-pull-request-comment) to find out more.
   
   | [Impacted Files](https://codecov.io/gh/apache/superset/pull/13098?src=pr&el=tree) | Coverage Δ | |
   |---|---|---|
   | [...end/src/SqlLab/components/RunQueryActionButton.tsx](https://codecov.io/gh/apache/superset/pull/13098/diff?src=pr&el=tree#diff-c3VwZXJzZXQtZnJvbnRlbmQvc3JjL1NxbExhYi9jb21wb25lbnRzL1J1blF1ZXJ5QWN0aW9uQnV0dG9uLnRzeA==) | `64.28% <ø> (+11.50%)` | :arrow_up: |
   | [superset-frontend/src/chart/ChartContainer.jsx](https://codecov.io/gh/apache/superset/pull/13098/diff?src=pr&el=tree#diff-c3VwZXJzZXQtZnJvbnRlbmQvc3JjL2NoYXJ0L0NoYXJ0Q29udGFpbmVyLmpzeA==) | `100.00% <ø> (ø)` | |
   | [superset-frontend/src/chart/ChartRenderer.jsx](https://codecov.io/gh/apache/superset/pull/13098/diff?src=pr&el=tree#diff-c3VwZXJzZXQtZnJvbnRlbmQvc3JjL2NoYXJ0L0NoYXJ0UmVuZGVyZXIuanN4) | `77.02% <0.00%> (+0.31%)` | :arrow_up: |
   | [...perset-frontend/src/common/components/Dropdown.tsx](https://codecov.io/gh/apache/superset/pull/13098/diff?src=pr&el=tree#diff-c3VwZXJzZXQtZnJvbnRlbmQvc3JjL2NvbW1vbi9jb21wb25lbnRzL0Ryb3Bkb3duLnRzeA==) | `54.76% <ø> (+4.76%)` | :arrow_up: |
   | [...ontend/src/components/ListViewCard/ImageLoader.tsx](https://codecov.io/gh/apache/superset/pull/13098/diff?src=pr&el=tree#diff-c3VwZXJzZXQtZnJvbnRlbmQvc3JjL2NvbXBvbmVudHMvTGlzdFZpZXdDYXJkL0ltYWdlTG9hZGVyLnRzeA==) | `86.36% <0.00%> (+11.36%)` | :arrow_up: |
   | [...set-frontend/src/components/URLShortLinkButton.jsx](https://codecov.io/gh/apache/superset/pull/13098/diff?src=pr&el=tree#diff-c3VwZXJzZXQtZnJvbnRlbmQvc3JjL2NvbXBvbmVudHMvVVJMU2hvcnRMaW5rQnV0dG9uLmpzeA==) | `100.00% <ø> (ø)` | |
   | [...src/dashboard/components/HeaderActionsDropdown.jsx](https://codecov.io/gh/apache/superset/pull/13098/diff?src=pr&el=tree#diff-c3VwZXJzZXQtZnJvbnRlbmQvc3JjL2Rhc2hib2FyZC9jb21wb25lbnRzL0hlYWRlckFjdGlvbnNEcm9wZG93bi5qc3g=) | `71.23% <ø> (+3.66%)` | :arrow_up: |
   | [...end/src/dashboard/components/StickyVerticalBar.tsx](https://codecov.io/gh/apache/superset/pull/13098/diff?src=pr&el=tree#diff-c3VwZXJzZXQtZnJvbnRlbmQvc3JjL2Rhc2hib2FyZC9jb21wb25lbnRzL1N0aWNreVZlcnRpY2FsQmFyLnRzeA==) | `100.00% <ø> (ø)` | |
   | [...perset-frontend/src/dashboard/containers/Chart.jsx](https://codecov.io/gh/apache/superset/pull/13098/diff?src=pr&el=tree#diff-c3VwZXJzZXQtZnJvbnRlbmQvc3JjL2Rhc2hib2FyZC9jb250YWluZXJzL0NoYXJ0LmpzeA==) | `100.00% <ø> (ø)` | |
   | [...shboard/util/charts/getFormDataWithExtraFilters.ts](https://codecov.io/gh/apache/superset/pull/13098/diff?src=pr&el=tree#diff-c3VwZXJzZXQtZnJvbnRlbmQvc3JjL2Rhc2hib2FyZC91dGlsL2NoYXJ0cy9nZXRGb3JtRGF0YVdpdGhFeHRyYUZpbHRlcnMudHM=) | `93.10% <ø> (+1.10%)` | :arrow_up: |
   | ... and [444 more](https://codecov.io/gh/apache/superset/pull/13098/diff?src=pr&el=tree-more) | |
   
   ------
   
   [Continue to review full report at Codecov](https://codecov.io/gh/apache/superset/pull/13098?src=pr&el=continue).
   > **Legend** - [Click here to learn more](https://docs.codecov.io/docs/codecov-delta)
   > `Δ = absolute <relative> (impact)`, `ø = not affected`, `? = missing data`
   > Powered by [Codecov](https://codecov.io/gh/apache/superset/pull/13098?src=pr&el=footer). Last update [956f276...473716d](https://codecov.io/gh/apache/superset/pull/13098?src=pr&el=lastupdated). Read the [comment docs](https://docs.codecov.io/docs/pull-request-comments).
   


----------------------------------------------------------------
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:
users@infra.apache.org



---------------------------------------------------------------------
To unsubscribe, e-mail: notifications-unsubscribe@superset.apache.org
For additional commands, e-mail: notifications-help@superset.apache.org

[GitHub] [superset] eschutho commented on a change in pull request #13098: refactor: HighligthedSQL into functional component with Typescript

Posted by GitBox <gi...@apache.org>.
eschutho commented on a change in pull request #13098:
URL: https://github.com/apache/superset/pull/13098#discussion_r575524539



##########
File path: superset-frontend/src/SqlLab/components/HighlightedSql.tsx
##########
@@ -27,93 +26,91 @@ import ModalTrigger from '../../components/ModalTrigger';
 
 SyntaxHighlighter.registerLanguage('sql', sql);
 
-const defaultProps = {
-  maxWidth: 50,
-  maxLines: 5,
-  shrink: false,
-};
+interface propTypes {

Review comment:
       this can become HighlightedSqlProps




----------------------------------------------------------------
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:
users@infra.apache.org



---------------------------------------------------------------------
To unsubscribe, e-mail: notifications-unsubscribe@superset.apache.org
For additional commands, e-mail: notifications-help@superset.apache.org

[GitHub] [superset] AAfghahi commented on a change in pull request #13098: refactor: HighligthedSQL into functional component with Typescript

Posted by GitBox <gi...@apache.org>.
AAfghahi commented on a change in pull request #13098:
URL: https://github.com/apache/superset/pull/13098#discussion_r575524391



##########
File path: superset-frontend/src/SqlLab/components/HighlightedSql.tsx
##########
@@ -27,93 +26,91 @@ import ModalTrigger from '../../components/ModalTrigger';
 
 SyntaxHighlighter.registerLanguage('sql', sql);
 
-const defaultProps = {
-  maxWidth: 50,
-  maxLines: 5,
-  shrink: false,
-};
+interface propTypes {
+  sql: string;
+  rawSql?: string;
+  maxWidth?: number;
+  maxLines?: number;
+  shrink?: any;
+}
 
-const propTypes = {
-  sql: PropTypes.string.isRequired,
-  rawSql: PropTypes.string,
-  maxWidth: PropTypes.number,
-  maxLines: PropTypes.number,
-  shrink: PropTypes.bool,
-};
+interface HighlightedSqlModalTypes {
+  rawSql?: string;
+  sql: string;
+}
 
-class HighlightedSql extends React.Component {
-  constructor(props) {
-    super(props);
-    this.state = {
-      modalBody: null,
-    };
-  }
+interface TriggerNodeProps {
+  shrink: boolean;
+  sql: string;
+  maxLines: number;
+  maxWidth: number;
+}
 
-  shrinkSql() {
-    const ssql = this.props.sql || '';
+function TriggerNode({ shrink, sql, maxLines, maxWidth }: TriggerNodeProps) {
+  const shrinkSql = () => {
+    const ssql = sql || '';
     let lines = ssql.split('\n');
-    if (lines.length >= this.props.maxLines) {
-      lines = lines.slice(0, this.props.maxLines);
+    if (lines.length >= maxLines) {
+      lines = lines.slice(0, maxLines);
       lines.push('{...}');
     }
     return lines
       .map(line => {
-        if (line.length > this.props.maxWidth) {
-          return `${line.slice(0, this.props.maxWidth)}{...}`;
+        if (line.length > maxWidth) {
+          return `${line.slice(0, maxWidth)}{...}`;
         }
         return line;
       })
       .join('\n');
-  }
+  };
 
-  triggerNode() {
-    const shownSql = this.props.shrink
-      ? this.shrinkSql(this.props.sql)
-      : this.props.sql;
-    return (
+  return (
+    <SyntaxHighlighter language="sql" style={github}>
+      {shrink ? shrinkSql() : sql}

Review comment:
       so just move it outside of the function altogether? 




----------------------------------------------------------------
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:
users@infra.apache.org



---------------------------------------------------------------------
To unsubscribe, e-mail: notifications-unsubscribe@superset.apache.org
For additional commands, e-mail: notifications-help@superset.apache.org

[GitHub] [superset] codecov-io edited a comment on pull request #13098: refactor: HighligthedSQL into functional component with Typescript

Posted by GitBox <gi...@apache.org>.
codecov-io edited a comment on pull request #13098:
URL: https://github.com/apache/superset/pull/13098#issuecomment-778475124






----------------------------------------------------------------
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:
users@infra.apache.org



---------------------------------------------------------------------
To unsubscribe, e-mail: notifications-unsubscribe@superset.apache.org
For additional commands, e-mail: notifications-help@superset.apache.org

[GitHub] [superset] betodealmeida commented on a change in pull request #13098: refactor: HighligthedSQL into functional component with Typescript

Posted by GitBox <gi...@apache.org>.
betodealmeida commented on a change in pull request #13098:
URL: https://github.com/apache/superset/pull/13098#discussion_r575523750



##########
File path: superset-frontend/src/SqlLab/components/HighlightedSql.tsx
##########
@@ -27,93 +26,91 @@ import ModalTrigger from '../../components/ModalTrigger';
 
 SyntaxHighlighter.registerLanguage('sql', sql);
 
-const defaultProps = {
-  maxWidth: 50,
-  maxLines: 5,
-  shrink: false,
-};
+interface propTypes {
+  sql: string;
+  rawSql?: string;
+  maxWidth?: number;
+  maxLines?: number;
+  shrink?: any;
+}
 
-const propTypes = {
-  sql: PropTypes.string.isRequired,
-  rawSql: PropTypes.string,
-  maxWidth: PropTypes.number,
-  maxLines: PropTypes.number,
-  shrink: PropTypes.bool,
-};
+interface HighlightedSqlModalTypes {
+  rawSql?: string;
+  sql: string;
+}
 
-class HighlightedSql extends React.Component {
-  constructor(props) {
-    super(props);
-    this.state = {
-      modalBody: null,
-    };
-  }
+interface TriggerNodeProps {
+  shrink: boolean;
+  sql: string;
+  maxLines: number;
+  maxWidth: number;
+}
 
-  shrinkSql() {
-    const ssql = this.props.sql || '';
+function TriggerNode({ shrink, sql, maxLines, maxWidth }: TriggerNodeProps) {
+  const shrinkSql = () => {
+    const ssql = sql || '';
     let lines = ssql.split('\n');
-    if (lines.length >= this.props.maxLines) {
-      lines = lines.slice(0, this.props.maxLines);
+    if (lines.length >= maxLines) {
+      lines = lines.slice(0, maxLines);
       lines.push('{...}');
     }
     return lines
       .map(line => {
-        if (line.length > this.props.maxWidth) {
-          return `${line.slice(0, this.props.maxWidth)}{...}`;
+        if (line.length > maxWidth) {
+          return `${line.slice(0, maxWidth)}{...}`;
         }
         return line;
       })
       .join('\n');
-  }
+  };
 
-  triggerNode() {
-    const shownSql = this.props.shrink
-      ? this.shrinkSql(this.props.sql)

Review comment:
       And the old code is broken (though it works), we pass `this.props.sql` but the method takes no arguments.




----------------------------------------------------------------
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:
users@infra.apache.org



---------------------------------------------------------------------
To unsubscribe, e-mail: notifications-unsubscribe@superset.apache.org
For additional commands, e-mail: notifications-help@superset.apache.org

[GitHub] [superset] codecov-io commented on pull request #13098: refactor: HighligthedSQL into functional component with Typescript

Posted by GitBox <gi...@apache.org>.
codecov-io commented on pull request #13098:
URL: https://github.com/apache/superset/pull/13098#issuecomment-778475124


   # [Codecov](https://codecov.io/gh/apache/superset/pull/13098?src=pr&el=h1) Report
   > Merging [#13098](https://codecov.io/gh/apache/superset/pull/13098?src=pr&el=desc) (473716d) into [master](https://codecov.io/gh/apache/superset/commit/2ce79823dfad61bce6196fcacd56a844f44818c0?el=desc) (2ce7982) will **increase** coverage by `8.79%`.
   > The diff coverage is `62.50%`.
   
   [![Impacted file tree graph](https://codecov.io/gh/apache/superset/pull/13098/graphs/tree.svg?width=650&height=150&src=pr&token=KsB0fHcx6l)](https://codecov.io/gh/apache/superset/pull/13098?src=pr&el=tree)
   
   ```diff
   @@            Coverage Diff             @@
   ##           master   #13098      +/-   ##
   ==========================================
   + Coverage   53.06%   61.85%   +8.79%     
   ==========================================
     Files         489      547      +58     
     Lines       17314    20203    +2889     
     Branches     4482     5297     +815     
   ==========================================
   + Hits         9187    12496    +3309     
   + Misses       8127     7494     -633     
   - Partials        0      213     +213     
   ```
   
   | Flag | Coverage Δ | |
   |---|---|---|
   | cypress | `?` | |
   | javascript | `61.85% <62.50%> (?)` | |
   
   Flags with carried forward coverage won't be shown. [Click here](https://docs.codecov.io/docs/carryforward-flags#carryforward-flags-in-the-pull-request-comment) to find out more.
   
   | [Impacted Files](https://codecov.io/gh/apache/superset/pull/13098?src=pr&el=tree) | Coverage Δ | |
   |---|---|---|
   | [...end/src/SqlLab/components/RunQueryActionButton.tsx](https://codecov.io/gh/apache/superset/pull/13098/diff?src=pr&el=tree#diff-c3VwZXJzZXQtZnJvbnRlbmQvc3JjL1NxbExhYi9jb21wb25lbnRzL1J1blF1ZXJ5QWN0aW9uQnV0dG9uLnRzeA==) | `64.28% <ø> (+11.50%)` | :arrow_up: |
   | [superset-frontend/src/chart/ChartContainer.jsx](https://codecov.io/gh/apache/superset/pull/13098/diff?src=pr&el=tree#diff-c3VwZXJzZXQtZnJvbnRlbmQvc3JjL2NoYXJ0L0NoYXJ0Q29udGFpbmVyLmpzeA==) | `100.00% <ø> (ø)` | |
   | [superset-frontend/src/chart/ChartRenderer.jsx](https://codecov.io/gh/apache/superset/pull/13098/diff?src=pr&el=tree#diff-c3VwZXJzZXQtZnJvbnRlbmQvc3JjL2NoYXJ0L0NoYXJ0UmVuZGVyZXIuanN4) | `39.18% <0.00%> (-37.53%)` | :arrow_down: |
   | [...perset-frontend/src/common/components/Dropdown.tsx](https://codecov.io/gh/apache/superset/pull/13098/diff?src=pr&el=tree#diff-c3VwZXJzZXQtZnJvbnRlbmQvc3JjL2NvbW1vbi9jb21wb25lbnRzL0Ryb3Bkb3duLnRzeA==) | `54.76% <ø> (+4.76%)` | :arrow_up: |
   | [...ontend/src/components/ListViewCard/ImageLoader.tsx](https://codecov.io/gh/apache/superset/pull/13098/diff?src=pr&el=tree#diff-c3VwZXJzZXQtZnJvbnRlbmQvc3JjL2NvbXBvbmVudHMvTGlzdFZpZXdDYXJkL0ltYWdlTG9hZGVyLnRzeA==) | `86.36% <0.00%> (+11.36%)` | :arrow_up: |
   | [...set-frontend/src/components/URLShortLinkButton.jsx](https://codecov.io/gh/apache/superset/pull/13098/diff?src=pr&el=tree#diff-c3VwZXJzZXQtZnJvbnRlbmQvc3JjL2NvbXBvbmVudHMvVVJMU2hvcnRMaW5rQnV0dG9uLmpzeA==) | `100.00% <ø> (ø)` | |
   | [...src/dashboard/components/HeaderActionsDropdown.jsx](https://codecov.io/gh/apache/superset/pull/13098/diff?src=pr&el=tree#diff-c3VwZXJzZXQtZnJvbnRlbmQvc3JjL2Rhc2hib2FyZC9jb21wb25lbnRzL0hlYWRlckFjdGlvbnNEcm9wZG93bi5qc3g=) | `54.79% <ø> (-12.78%)` | :arrow_down: |
   | [...end/src/dashboard/components/StickyVerticalBar.tsx](https://codecov.io/gh/apache/superset/pull/13098/diff?src=pr&el=tree#diff-c3VwZXJzZXQtZnJvbnRlbmQvc3JjL2Rhc2hib2FyZC9jb21wb25lbnRzL1N0aWNreVZlcnRpY2FsQmFyLnRzeA==) | `50.00% <ø> (-50.00%)` | :arrow_down: |
   | [...perset-frontend/src/dashboard/containers/Chart.jsx](https://codecov.io/gh/apache/superset/pull/13098/diff?src=pr&el=tree#diff-c3VwZXJzZXQtZnJvbnRlbmQvc3JjL2Rhc2hib2FyZC9jb250YWluZXJzL0NoYXJ0LmpzeA==) | `100.00% <ø> (ø)` | |
   | [...shboard/util/charts/getFormDataWithExtraFilters.ts](https://codecov.io/gh/apache/superset/pull/13098/diff?src=pr&el=tree#diff-c3VwZXJzZXQtZnJvbnRlbmQvc3JjL2Rhc2hib2FyZC91dGlsL2NoYXJ0cy9nZXRGb3JtRGF0YVdpdGhFeHRyYUZpbHRlcnMudHM=) | `93.10% <ø> (+1.10%)` | :arrow_up: |
   | ... and [496 more](https://codecov.io/gh/apache/superset/pull/13098/diff?src=pr&el=tree-more) | |
   
   ------
   
   [Continue to review full report at Codecov](https://codecov.io/gh/apache/superset/pull/13098?src=pr&el=continue).
   > **Legend** - [Click here to learn more](https://docs.codecov.io/docs/codecov-delta)
   > `Δ = absolute <relative> (impact)`, `ø = not affected`, `? = missing data`
   > Powered by [Codecov](https://codecov.io/gh/apache/superset/pull/13098?src=pr&el=footer). Last update [956f276...473716d](https://codecov.io/gh/apache/superset/pull/13098?src=pr&el=lastupdated). Read the [comment docs](https://docs.codecov.io/docs/pull-request-comments).
   


----------------------------------------------------------------
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:
users@infra.apache.org



---------------------------------------------------------------------
To unsubscribe, e-mail: notifications-unsubscribe@superset.apache.org
For additional commands, e-mail: notifications-help@superset.apache.org

[GitHub] [superset] betodealmeida commented on a change in pull request #13098: refactor: HighligthedSQL into functional component with Typescript

Posted by GitBox <gi...@apache.org>.
betodealmeida commented on a change in pull request #13098:
URL: https://github.com/apache/superset/pull/13098#discussion_r575525434



##########
File path: superset-frontend/src/SqlLab/components/HighlightedSql.tsx
##########
@@ -27,93 +26,91 @@ import ModalTrigger from '../../components/ModalTrigger';
 
 SyntaxHighlighter.registerLanguage('sql', sql);
 
-const defaultProps = {
-  maxWidth: 50,
-  maxLines: 5,
-  shrink: false,
-};
+interface propTypes {
+  sql: string;
+  rawSql?: string;
+  maxWidth?: number;
+  maxLines?: number;
+  shrink?: any;
+}
 
-const propTypes = {
-  sql: PropTypes.string.isRequired,
-  rawSql: PropTypes.string,
-  maxWidth: PropTypes.number,
-  maxLines: PropTypes.number,
-  shrink: PropTypes.bool,
-};
+interface HighlightedSqlModalTypes {
+  rawSql?: string;
+  sql: string;
+}
 
-class HighlightedSql extends React.Component {
-  constructor(props) {
-    super(props);
-    this.state = {
-      modalBody: null,
-    };
-  }
+interface TriggerNodeProps {
+  shrink: boolean;
+  sql: string;
+  maxLines: number;
+  maxWidth: number;
+}
 
-  shrinkSql() {
-    const ssql = this.props.sql || '';
+function TriggerNode({ shrink, sql, maxLines, maxWidth }: TriggerNodeProps) {

Review comment:
       Should we preserve `defaultProps` and have them here:
   
   ```js
    function TriggerNode({ sql, shrink = false, maxLines = 5, maxWidth = 50 }: TriggerNodeProps) { 
   ```

##########
File path: superset-frontend/src/SqlLab/components/HighlightedSql.tsx
##########
@@ -27,93 +26,91 @@ import ModalTrigger from '../../components/ModalTrigger';
 
 SyntaxHighlighter.registerLanguage('sql', sql);
 
-const defaultProps = {
-  maxWidth: 50,
-  maxLines: 5,
-  shrink: false,
-};
+interface propTypes {
+  sql: string;
+  rawSql?: string;
+  maxWidth?: number;
+  maxLines?: number;
+  shrink?: any;
+}
 
-const propTypes = {
-  sql: PropTypes.string.isRequired,
-  rawSql: PropTypes.string,
-  maxWidth: PropTypes.number,
-  maxLines: PropTypes.number,
-  shrink: PropTypes.bool,
-};
+interface HighlightedSqlModalTypes {
+  rawSql?: string;
+  sql: string;
+}
 
-class HighlightedSql extends React.Component {
-  constructor(props) {
-    super(props);
-    this.state = {
-      modalBody: null,
-    };
-  }
+interface TriggerNodeProps {
+  shrink: boolean;
+  sql: string;
+  maxLines: number;
+  maxWidth: number;
+}
 
-  shrinkSql() {
-    const ssql = this.props.sql || '';
+function TriggerNode({ shrink, sql, maxLines, maxWidth }: TriggerNodeProps) {

Review comment:
       Should we preserve `defaultProps` and have them here:
   
   ```js
    function TriggerNode({ sql, shrink = false, maxLines = 5, maxWidth = 50 }: TriggerNodeProps) { 
   ```
   
   ?




----------------------------------------------------------------
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:
users@infra.apache.org



---------------------------------------------------------------------
To unsubscribe, e-mail: notifications-unsubscribe@superset.apache.org
For additional commands, e-mail: notifications-help@superset.apache.org

[GitHub] [superset] hughhhh merged pull request #13098: refactor: HighligthedSQL into functional component with Typescript

Posted by GitBox <gi...@apache.org>.
hughhhh merged pull request #13098:
URL: https://github.com/apache/superset/pull/13098


   


----------------------------------------------------------------
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:
users@infra.apache.org



---------------------------------------------------------------------
To unsubscribe, e-mail: notifications-unsubscribe@superset.apache.org
For additional commands, e-mail: notifications-help@superset.apache.org

[GitHub] [superset] betodealmeida commented on a change in pull request #13098: refactor: HighligthedSQL into functional component with Typescript

Posted by GitBox <gi...@apache.org>.
betodealmeida commented on a change in pull request #13098:
URL: https://github.com/apache/superset/pull/13098#discussion_r575522878



##########
File path: superset-frontend/src/SqlLab/components/HighlightedSql.tsx
##########
@@ -27,93 +26,91 @@ import ModalTrigger from '../../components/ModalTrigger';
 
 SyntaxHighlighter.registerLanguage('sql', sql);
 
-const defaultProps = {
-  maxWidth: 50,
-  maxLines: 5,
-  shrink: false,
-};
+interface propTypes {
+  sql: string;
+  rawSql?: string;
+  maxWidth?: number;
+  maxLines?: number;
+  shrink?: any;
+}
 
-const propTypes = {
-  sql: PropTypes.string.isRequired,
-  rawSql: PropTypes.string,
-  maxWidth: PropTypes.number,
-  maxLines: PropTypes.number,
-  shrink: PropTypes.bool,
-};
+interface HighlightedSqlModalTypes {
+  rawSql?: string;
+  sql: string;
+}
 
-class HighlightedSql extends React.Component {
-  constructor(props) {
-    super(props);
-    this.state = {
-      modalBody: null,
-    };
-  }
+interface TriggerNodeProps {
+  shrink: boolean;
+  sql: string;
+  maxLines: number;
+  maxWidth: number;
+}
 
-  shrinkSql() {
-    const ssql = this.props.sql || '';
+function TriggerNode({ shrink, sql, maxLines, maxWidth }: TriggerNodeProps) {
+  const shrinkSql = () => {
+    const ssql = sql || '';
     let lines = ssql.split('\n');
-    if (lines.length >= this.props.maxLines) {
-      lines = lines.slice(0, this.props.maxLines);
+    if (lines.length >= maxLines) {
+      lines = lines.slice(0, maxLines);
       lines.push('{...}');
     }
     return lines
       .map(line => {
-        if (line.length > this.props.maxWidth) {
-          return `${line.slice(0, this.props.maxWidth)}{...}`;
+        if (line.length > maxWidth) {
+          return `${line.slice(0, maxWidth)}{...}`;
         }
         return line;
       })
       .join('\n');
-  }
+  };
 
-  triggerNode() {
-    const shownSql = this.props.shrink
-      ? this.shrinkSql(this.props.sql)
-      : this.props.sql;
-    return (
+  return (
+    <SyntaxHighlighter language="sql" style={github}>
+      {shrink ? shrinkSql() : sql}

Review comment:
       Just a nit, but this threw me off for a second because `shrinkSql` has implicit access to `sql`. I think it would be a bit clearer if `shrinkSql` was a function outside the module, so that you'd have here:
   
   ```js
   {shrink ? shrinkSql(sql) : sql}
   ```
   
   Which is easier to read — I can see that line and understand "ok, we either return the original sql or the shrunk sql, depending on the value of `shrink`". With the current approach it's clear that `shrinkSql()` must have access to _some form_ of the SQL, but I have to go and read the source to figure out if it's the same `sql`, or something else.




----------------------------------------------------------------
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:
users@infra.apache.org



---------------------------------------------------------------------
To unsubscribe, e-mail: notifications-unsubscribe@superset.apache.org
For additional commands, e-mail: notifications-help@superset.apache.org