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: sqleditorleftbar to typescript #17926

Merged

Conversation

JosueLugaro
Copy link
Contributor

@JosueLugaro JosueLugaro commented Jan 4, 2022

SUMMARY

Converted the SqlEditorLeftBar component to TypeScript, also want to make note that I removed dbId from being passed into TableSelector.

BEFORE/AFTER SCREENSHOTS OR ANIMATED GIF

Should still function as it did before.

TESTING INSTRUCTIONS

ADDITIONAL INFORMATION

  • Has associated issue:
  • Required feature flags:
  • Changes UI
  • Includes DB Migration (follow approval process in SIP-59)
    • Migration is atomic, supports rollback & is backwards-compatible
    • Confirm DB migration upgrade and downgrade tested
    • Runtime estimates and downtime expectations provided
  • Introduces new feature or API
  • Removes existing feature or API

@JosueLugaro JosueLugaro changed the title Josue/sqleditorleftbar to typescript refactor: sqleditorleftbar to typescript Jan 4, 2022
@eschutho eschutho added the Superset-Community-Partners Preset community partner program participants label Jan 5, 2022
@JosueLugaro JosueLugaro force-pushed the josue/sqleditorleftbar-to-typescript branch from 3e070b1 to 94cc6aa Compare January 5, 2022 23:38
id: number;
};

interface propTypes {
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

we should change this name to be more specific to the component that we are using. Maybe SqlEditorLeftBarProps, which is a mouthful, but I think more specific than what we have currently.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thank you for the feed back, I changed the interface to SqlEditorLeftBarProps.


interface propTypes {
queryEditor: QueryEditor;
height: number;
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

both height and tables have a default value, which make me think that they are optional.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Made both of these properties optional👍.

@JosueLugaro JosueLugaro force-pushed the josue/sqleditorleftbar-to-typescript branch from 94cc6aa to 2c327a4 Compare January 27, 2022 18:53
@pull-request-size pull-request-size bot added size/M and removed size/L labels Jan 27, 2022
@JosueLugaro JosueLugaro marked this pull request as ready for review January 27, 2022 20:04
@AAfghahi
Copy link
Member

/testenv up

@github-actions
Copy link
Contributor

@AAfghahi Ephemeral environment spinning up at http://54.202.74.189:8080. Credentials are admin/admin. Please allow several minutes for bootstrapping and startup.

}
}
`;

export default function SqlEditorLeftBar({
actions,
database,
height,
height = 500,
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

nit: put height as the last param

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Made height the last param👍

@codecov
Copy link

codecov bot commented Jan 27, 2022

Codecov Report

Merging #17926 (cc9fada) into master (568b8e1) will increase coverage by 0.00%.
The diff coverage is 53.84%.

Impacted file tree graph

@@           Coverage Diff           @@
##           master   #17926   +/-   ##
=======================================
  Coverage   66.05%   66.05%           
=======================================
  Files        1591     1591           
  Lines       62418    62411    -7     
  Branches     6286     6289    +3     
=======================================
- Hits        41228    41225    -3     
+ Misses      19568    19564    -4     
  Partials     1622     1622           
Flag Coverage Δ
javascript 50.86% <53.84%> (+<0.01%) ⬆️

Flags with carried forward coverage won't be shown. Click here to find out more.

Impacted Files Coverage Δ
...ntend/src/SqlLab/components/TableElement/index.tsx 72.30% <ø> (ø)
...d/src/SqlLab/components/SqlEditorLeftBar/index.tsx 57.14% <53.84%> (ø)

Continue to review full report at Codecov.

Legend - Click here to learn more
Δ = absolute <relative> (impact), ø = not affected, ? = missing data
Powered by Codecov. Last update 568b8e1...cc9fada. Read the comment docs.

height: 500,
offline: false,
tables: [],
type dbType = {
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

is there a reason that this is a type over an interface?

&: hover {
color: ${({ theme }) => theme.colors.primary.dark2} !important;
color: ${theme.colors.primary.dark2} !important;
}
}
`;

export default function SqlEditorLeftBar({
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

shouldn't offline be in here with a default variable?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Offline was removed in my functional conversion PR because the value was never read or used anywhere in the component.

tables?: ExtendedTable[];
actions: actionsTypes & TableElementProps['actions'];
database: DatabaseObject;
offline: boolean;
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

since this has a default value, should it be required?

const onDbChange = db => {
tables = [],
}: SqlEditorLeftBarProps) {
const onDbChange = (db: dbType) => {
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

is there a reason we are putting in an entire DB in here if we just use the id? WOuld it be better if we passed in just the db.id and then you don't need the DbType type?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Good catch, will fix that asap.

Copy link
Member

@lyndsiWilliams lyndsiWilliams left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Just one question, otherwise it looks great! 😁

offline: PropTypes.bool,
};
interface ExtendedTable extends Table {
expanded: any;
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Is this able to be described by a type? I remember seeing this with you the other day but don't remember exactly what it was, I think this might have been a string or a boolean?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I'll have to look at a previous commit to see what it was previously. Once I do I'll change it to that type.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Changed the expanded type from any to boolean, which is what it was originally.👍

@AAfghahi
Copy link
Member

@yousoph and @rosemarie-chiu could you test this?

@AAfghahi
Copy link
Member

/testenv up

@github-actions
Copy link
Contributor

@AAfghahi Ephemeral environment spinning up at http://54.213.205.134:8080. Credentials are admin/admin. Please allow several minutes for bootstrapping and startup.

@hughhhh hughhhh merged commit a06e043 into apache:master Jan 28, 2022
@github-actions
Copy link
Contributor

Ephemeral environment shutdown and build artifacts deleted.

shcoderAlex pushed a commit to casual-precision/superset that referenced this pull request Feb 7, 2022
* Creating draft PR to address bug

* Still working on solving re rendering bug

* Cleaning up in preparation for push

* Starting conversion to TypeScript

* Working on conversion

* Continued working on typescript conversion, referenced other files for different types, still a rough version of final product

* Added type assertion to actions in props, and added types to some component functions

* Progress on typescript conversion

* Fixed typing issue on collapseStyles

* Fixed styling on div, child of StyledScrollbarContainer

* Attempting to address issues with the actions passed into the TableElement

* Resolved typescript warning on actions of the TableElement component

* Made changes suggested by Arash

* Tested the component without dbId, cleaned up lingering comments

* Made more changes suggested by Arash, removed offline from the SqlEditorLeftBarProps interface

* Made change suggested by Hugh

* Changed the expanded type from any to boolean
ofekisr pushed a commit to nielsen-oss/superset that referenced this pull request Feb 8, 2022
* Creating draft PR to address bug

* Still working on solving re rendering bug

* Cleaning up in preparation for push

* Starting conversion to TypeScript

* Working on conversion

* Continued working on typescript conversion, referenced other files for different types, still a rough version of final product

* Added type assertion to actions in props, and added types to some component functions

* Progress on typescript conversion

* Fixed typing issue on collapseStyles

* Fixed styling on div, child of StyledScrollbarContainer

* Attempting to address issues with the actions passed into the TableElement

* Resolved typescript warning on actions of the TableElement component

* Made changes suggested by Arash

* Tested the component without dbId, cleaned up lingering comments

* Made more changes suggested by Arash, removed offline from the SqlEditorLeftBarProps interface

* Made change suggested by Hugh

* Changed the expanded type from any to boolean
bwang221 pushed a commit to casual-precision/superset that referenced this pull request Feb 10, 2022
* Creating draft PR to address bug

* Still working on solving re rendering bug

* Cleaning up in preparation for push

* Starting conversion to TypeScript

* Working on conversion

* Continued working on typescript conversion, referenced other files for different types, still a rough version of final product

* Added type assertion to actions in props, and added types to some component functions

* Progress on typescript conversion

* Fixed typing issue on collapseStyles

* Fixed styling on div, child of StyledScrollbarContainer

* Attempting to address issues with the actions passed into the TableElement

* Resolved typescript warning on actions of the TableElement component

* Made changes suggested by Arash

* Tested the component without dbId, cleaned up lingering comments

* Made more changes suggested by Arash, removed offline from the SqlEditorLeftBarProps interface

* Made change suggested by Hugh

* Changed the expanded type from any to boolean
@mistercrunch mistercrunch added 🏷️ bot A label used by `supersetbot` to keep track of which PR where auto-tagged with release labels 🚢 1.5.0 labels Mar 13, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
🏷️ bot A label used by `supersetbot` to keep track of which PR where auto-tagged with release labels size/M Superset-Community-Partners Preset community partner program participants 🚢 1.5.0
Projects
None yet
Development

Successfully merging this pull request may close these issues.

6 participants