Skip to content
This repository has been archived by the owner on Dec 23, 2021. It is now read-only.

Led integration between webview and python api #192

Merged
merged 126 commits into from
Feb 10, 2020

Conversation

xnkevinnguyen
Copy link
Contributor

@xnkevinnguyen xnkevinnguyen commented Feb 5, 2020

Description:

Python code is compiled and can send messages to typescript api then to the webview.

  • Led Listener for state changes on microbit
  • Sending messages from the python side to the vscode api
  • Send the valid messages from vscode api to the webview

Type of change

Please delete options that are not relevant.

  • Bug fix (non-breaking change which fixes an issue)
  • New feature (non-breaking change which adds functionality)
  • Breaking change (fix or feature that would cause existing functionality to not work as expected)
  • This change requires a documentation update

Limitations:

Please describe limitations of this PR

Testing:

Please describe the tests that you ran to verify your changes. Provide instructions so we can reproduce. Please also list any relevant details for your test configuration

  • Test A
  • Test B

Checklist:

  • My code follows the style guidelines of this project
  • My code has been formatted with npm run format and passes the checks in npm run check
  • I have performed a self-review of my own code
  • I have commented my code, particularly in hard-to-understand areas
  • I have made corresponding changes to the documentation
  • My changes generate no new warnings
  • Any dependent changes have been merged and published in downstream modules

super(props);
}
componentDidMount() {
const svgElement = this.svgRef.current;
Copy link
Collaborator

Choose a reason for hiding this comment

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

null check missing this.svgRef && this.svgRef.current

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've typed svgRef as always defined since I create it in the same class before the component mounts

}
}
componentDidUpdate() {
if (this.svgRef.current) {
Copy link
Collaborator

Choose a reason for hiding this comment

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

null check missing this.svgRef

Copy link
Contributor Author

Choose a reason for hiding this comment

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

same here, svgRef should always be defined

) => {
for (let j = 0; j < leds.length; j++) {
for (let i = 0; i < leds[0].length; i++) {
const ledElement = ledRefs[j][i].current;
Copy link
Collaborator

Choose a reason for hiding this comment

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

I would do a null check for ledRefs here just to be sure

}
}
};
const setupLed = (ledElement: SVGRectElement, brightness: number) => {
Copy link
Collaborator

Choose a reason for hiding this comment

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

nit: typo SVGReactElement, can you update all the instances

Copy link
Contributor Author

Choose a reason for hiding this comment

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

SVGRectElement are referencing to tsx svg rect elements. For example,

@@ -0,0 +1,9 @@
interface vscode {
postMessage(message: any): void;
Copy link
Collaborator

Choose a reason for hiding this comment

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

Is it worth typifying this?

Copy link
Contributor Author

Choose a reason for hiding this comment

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

this interface links to the vscode api which has any type. The only place where we call this specific interface is in sendMessage (with generic typing in the following comment you made)

Copy link

@nasadigital nasadigital left a comment

Choose a reason for hiding this comment

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

LGTM! Great job everyone 🥇

global previous_state

message = create_message(state, device_name)

if state != previous_state:

Choose a reason for hiding this comment

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

Thanks for addressing the comment!
But now this part might not work as expected, right?
I would take the state updating logic and put it in this method (or in a function and call that function here).

Copy link
Contributor

Choose a reason for hiding this comment

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

Thanks! I just abstracted out the state updating and made the process two function calls :).

Choose a reason for hiding this comment

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

Awesome!
One more thing, now send_to_simulator and debug_show mutate the input parameters. It would be easier for a developer if they can use these functions without worrying about any unintended consequences.

Copy link
Contributor

Choose a reason for hiding this comment

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

ok, tried to fix it in the last commit :)

Copy link

@nasadigital nasadigital Feb 10, 2020

Choose a reason for hiding this comment

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

Almost perfect!
Now this check will always return true if state != previous_state:. Perhaps use state_copy instead of state?

Copy link
Contributor

Choose a reason for hiding this comment

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

oops! fixed

Choose a reason for hiding this comment

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

*nit*
I would change the name to updated_state from state_copy. Up to you!

Copy link
Contributor

Choose a reason for hiding this comment

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

fixed!

Choose a reason for hiding this comment

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

LGTM!
Thanks for your patience :D
giphy

@sagarmanchanda
Copy link
Collaborator

Looks good. Amazing work. 💯

@xnkevinnguyen xnkevinnguyen merged commit 8f4a1eb into dev Feb 10, 2020
@xnkevinnguyen xnkevinnguyen deleted the users/t-anmah/frontend-backend-integration branch February 10, 2020 19:51
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

5 participants