This is an automated email from the ASF dual-hosted git repository.
villebro pushed a commit to branch 0.37
in repository https://gitbox.apache.org/repos/asf/incubator-superset.git
commit 9f0d456b6a72210aab29fce2740db454ca5e44a7
Author: Erik Ritter <erik.rit...@airbnb.com>
AuthorDate: Tue Jul 14 16:39:56 2020 -0700
chore: add typing to more sqllab components (#10278)
---
...lumnElement_spec.jsx => ColumnElement_spec.tsx} | 0
.../sqllab/{fixtures.js => fixtures.ts} | 9 +--
.../{ColumnElement.jsx => ColumnElement.tsx} | 23 +++++--
.../SqlLab/components/{ShowSQL.jsx => ShowSQL.tsx} | 74 ++++++++++------------
.../src/SqlLab/{constants.js => constants.ts} | 0
.../src/SqlLab/{index.jsx => index.tsx} | 0
superset-frontend/webpack.config.js | 2 +-
7 files changed, 54 insertions(+), 54 deletions(-)
diff --git a/superset-frontend/spec/javascripts/sqllab/ColumnElement_spec.jsx
b/superset-frontend/spec/javascripts/sqllab/ColumnElement_spec.tsx
similarity index 100%
rename from superset-frontend/spec/javascripts/sqllab/ColumnElement_spec.jsx
rename to superset-frontend/spec/javascripts/sqllab/ColumnElement_spec.tsx
diff --git a/superset-frontend/spec/javascripts/sqllab/fixtures.js
b/superset-frontend/spec/javascripts/sqllab/fixtures.ts
similarity index 97%
rename from superset-frontend/spec/javascripts/sqllab/fixtures.js
rename to superset-frontend/spec/javascripts/sqllab/fixtures.ts
index e7503ee..0cdcb09 100644
--- a/superset-frontend/spec/javascripts/sqllab/fixtures.js
+++ b/superset-frontend/spec/javascripts/sqllab/fixtures.ts
@@ -18,6 +18,7 @@
*/
import sinon from 'sinon';
import * as actions from 'src/SqlLab/actions/sqlLab';
+import { ColumnKeyTypeType } from 'src/SqlLab/components/ColumnElement';
export const mockedActions = sinon.stub({ ...actions });
@@ -68,7 +69,7 @@ export const table = {
keys: [
{
column_names: ['id'],
- type: 'pk',
+ type: 'pk' as ColumnKeyTypeType,
name: null,
},
],
@@ -84,14 +85,14 @@ export const table = {
name: 'slices_ibfk_1',
referred_columns: ['id'],
referred_table: 'datasources',
- type: 'fk',
+ type: 'fk' as ColumnKeyTypeType,
referred_schema: 'carapal',
options: {},
},
{
unique: false,
column_names: ['druid_datasource_id'],
- type: 'index',
+ type: 'index' as ColumnKeyTypeType,
name: 'druid_datasource_id',
},
],
@@ -283,7 +284,7 @@ export const queries = [
export const queryWithBadColumns = {
...queries[0],
results: {
- data: queries[0].results.data,
+ data: queries[0].results?.data,
selected_columns: [
{
is_date: true,
diff --git a/superset-frontend/src/SqlLab/components/ColumnElement.jsx
b/superset-frontend/src/SqlLab/components/ColumnElement.tsx
similarity index 80%
rename from superset-frontend/src/SqlLab/components/ColumnElement.jsx
rename to superset-frontend/src/SqlLab/components/ColumnElement.tsx
index 1ee8579..f72bb3d 100644
--- a/superset-frontend/src/SqlLab/components/ColumnElement.jsx
+++ b/superset-frontend/src/SqlLab/components/ColumnElement.tsx
@@ -36,13 +36,22 @@ const tooltipTitleMap = {
index: 'Index',
};
-export default function ColumnElement(props) {
- const col = props.column;
- let name = col.name;
+export type ColumnKeyTypeType = keyof typeof tooltipTitleMap;
+
+interface ColumnElementProps {
+ column: {
+ name: string;
+ keys?: { type: ColumnKeyTypeType }[];
+ type: string;
+ };
+}
+
+export default function ColumnElement({ column }: ColumnElementProps) {
+ let name: React.ReactNode = column.name;
let icons;
- if (col.keys && col.keys.length > 0) {
- name = <strong>{col.name}</strong>;
- icons = col.keys.map((key, i) => (
+ if (column.keys && column.keys.length > 0) {
+ name = <strong>{column.name}</strong>;
+ icons = column.keys.map((key, i) => (
<span key={i} className="ColumnElement">
<OverlayTrigger
placement="right"
@@ -68,7 +77,7 @@ export default function ColumnElement(props) {
{icons}
</div>
<div className="pull-right text-muted">
- <small> {col.type}</small>
+ <small> {column.type}</small>
</div>
</div>
);
diff --git a/superset-frontend/src/SqlLab/components/ShowSQL.jsx
b/superset-frontend/src/SqlLab/components/ShowSQL.tsx
similarity index 56%
rename from superset-frontend/src/SqlLab/components/ShowSQL.jsx
rename to superset-frontend/src/SqlLab/components/ShowSQL.tsx
index 9b03069..002d164 100644
--- a/superset-frontend/src/SqlLab/components/ShowSQL.jsx
+++ b/superset-frontend/src/SqlLab/components/ShowSQL.tsx
@@ -17,58 +17,48 @@
* under the License.
*/
import React from 'react';
-import PropTypes from 'prop-types';
import SyntaxHighlighter, {
registerLanguage,
+ // @ts-ignore
} from 'react-syntax-highlighter/dist/light';
+// @ts-ignore
import sql from 'react-syntax-highlighter/dist/languages/hljs/sql';
+// @ts-ignore
import github from 'react-syntax-highlighter/dist/styles/hljs/github';
-import { t } from '@superset-ui/translation';
-
import Link from '../../components/Link';
import ModalTrigger from '../../components/ModalTrigger';
registerLanguage('sql', sql);
-const propTypes = {
- tooltipText: PropTypes.string,
- title: PropTypes.string,
- sql: PropTypes.string,
-};
-
-const defaultProps = {
- tooltipText: t('Show SQL'),
- title: t('SQL statement'),
- sql: '',
-};
-
-export default class ShowSQL extends React.PureComponent {
- renderModalBody() {
- return (
- <div>
- <SyntaxHighlighter language="sql" style={github}>
- {this.props.sql}
- </SyntaxHighlighter>
- </div>
- );
- }
- render() {
- return (
- <ModalTrigger
- modalTitle={this.props.title}
- triggerNode={
- <Link
- className="fa fa-eye pull-left m-l-2"
- tooltip={this.props.tooltipText}
- href="#"
- />
- }
- modalBody={this.renderModalBody()}
- />
- );
- }
+interface ShowSQLProps {
+ sql: string;
+ title: string;
+ tooltipText: string;
}
-ShowSQL.propTypes = propTypes;
-ShowSQL.defaultProps = defaultProps;
+export default function ShowSQL({
+ tooltipText,
+ title,
+ sql: sqlString,
+}: ShowSQLProps) {
+ return (
+ <ModalTrigger
+ modalTitle={title}
+ triggerNode={
+ <Link
+ className="fa fa-eye pull-left m-l-2"
+ tooltip={tooltipText}
+ href="#"
+ />
+ }
+ modalBody={
+ <div>
+ <SyntaxHighlighter language="sql" style={github}>
+ {sqlString}
+ </SyntaxHighlighter>
+ </div>
+ }
+ />
+ );
+}
diff --git a/superset-frontend/src/SqlLab/constants.js
b/superset-frontend/src/SqlLab/constants.ts
similarity index 100%
rename from superset-frontend/src/SqlLab/constants.js
rename to superset-frontend/src/SqlLab/constants.ts
diff --git a/superset-frontend/src/SqlLab/index.jsx
b/superset-frontend/src/SqlLab/index.tsx
similarity index 100%
rename from superset-frontend/src/SqlLab/index.jsx
rename to superset-frontend/src/SqlLab/index.tsx
diff --git a/superset-frontend/webpack.config.js
b/superset-frontend/webpack.config.js
index d436a3a..2d3545b 100644
--- a/superset-frontend/webpack.config.js
+++ b/superset-frontend/webpack.config.js
@@ -180,7 +180,7 @@ const config = {
addSlice: addPreamble('/src/addSlice/index.tsx'),
explore: addPreamble('/src/explore/index.jsx'),
dashboard: addPreamble('/src/dashboard/index.jsx'),
- sqllab: addPreamble('/src/SqlLab/index.jsx'),
+ sqllab: addPreamble('/src/SqlLab/index.tsx'),
welcome: addPreamble('/src/welcome/index.jsx'),
profile: addPreamble('/src/profile/index.tsx'),
showSavedQuery: [path.join(APP_DIR, '/src/showSavedQuery/index.jsx')],
