[GitHub] [superset] hughhhh commented on a change in pull request #17926: refactor: sqleditorleftbar to typescript

[GitBox <gi...@apache.org>]

hughhhh commented on a change in pull request #17926:
URL: https://github.com/apache/superset/pull/17926#discussion_r793986707



##########
File path: superset-frontend/src/SqlLab/components/SqlEditorLeftBar/index.tsx
##########
@@ -17,86 +17,105 @@
  * under the License.
  */
 import React from 'react';
-import PropTypes from 'prop-types';
 import Button from 'src/components/Button';
-import { t, styled, css } from '@superset-ui/core';
+import { t, styled, css, SupersetTheme } from '@superset-ui/core';
 import Collapse from 'src/components/Collapse';
 import Icons from 'src/components/Icons';
 import TableSelector from 'src/components/TableSelector';
 import { IconTooltip } from 'src/components/IconTooltip';
-import TableElement from '../TableElement';
+import { QueryEditor } from 'src/SqlLab/types';
+import { DatabaseObject } from 'src/components/DatabaseSelector';
+import TableElement, { Table, TableElementProps } from '../TableElement';
 
-const propTypes = {
-  queryEditor: PropTypes.object.isRequired,
-  height: PropTypes.number,
-  tables: PropTypes.array,
-  actions: PropTypes.object,
-  database: PropTypes.object,
-  offline: PropTypes.bool,
-};
+interface ExtendedTable extends Table {
+  expanded: any;
+}
+
+interface actionsTypes {
+  queryEditorSetDb: (queryEditor: QueryEditor, dbId: number) => void;
+  queryEditorSetFunctionNames: (queryEditor: QueryEditor, dbId: number) => void;
+  collapseTable: (table: Table) => void;
+  expandTable: (table: Table) => void;
+  addTable: (queryEditor: any, value: any, schema: any) => void;
+  setDatabases: (arg0: any) => {};
+  addDangerToast: (msg: string) => void;
+  queryEditorSetSchema: (schema?: string) => void;
+  queryEditorSetSchemaOptions: () => void;
+  queryEditorSetTableOptions: (options: Array<any>) => void;
+  resetState: () => void;
+}
 
-const defaultProps = {
-  actions: {},
-  height: 500,
-  offline: false,
-  tables: [],
+type dbType = {
+  id: number;
 };
 
+interface SqlEditorLeftBarProps {
+  queryEditor: QueryEditor;
+  height?: number;
+  tables?: ExtendedTable[];
+  actions: actionsTypes & TableElementProps['actions'];
+  database: DatabaseObject;
+  offline: boolean;
+}
+
 const StyledScrollbarContainer = styled.div`
   flex: 1 1 auto;
   overflow: auto;
 `;
 
-const collapseStyles = css`
+const collapseStyles = (theme: SupersetTheme) => css`
   .ant-collapse-item {
-    margin-bottom: ${({ theme }) => theme.gridUnit * 3}px;
+    margin-bottom: ${theme.gridUnit * 3}px;
   }
   .ant-collapse-header {
     padding: 0px !important;
     display: flex;
     align-items: center;
   }
   .ant-collapse-content-box {
-    padding: 0px ${({ theme }) => theme.gridUnit * 4}px 0px 0px !important;
+    padding: 0px ${theme.gridUnit * 4}px 0px 0px !important;
   }
   .ant-collapse-arrow {
-    top: ${({ theme }) => theme.gridUnit * 2}px !important;
-    color: ${({ theme }) => theme.colors.primary.dark1} !important;
+    top: ${theme.gridUnit * 2}px !important;
+    color: ${theme.colors.primary.dark1} !important;
     &: hover {
-      color: ${({ theme }) => theme.colors.primary.dark2} !important;
+      color: ${theme.colors.primary.dark2} !important;
     }
   }
 `;
 
 export default function SqlEditorLeftBar({
   actions,
   database,
-  height,
+  height = 500,

Review comment:
       nit: put height as the last param




-- 
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.

To unsubscribe, e-mail: notifications-unsubscribe@superset.apache.org

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