Skip to content

Move Javalab Editor header and dialogs into their own components#47116

Merged
sanchitmalhotra126 merged 3 commits intosanchit/javalab-editor-refactor/commitdialogfrom
sanchit/javalab-editor-refactor/split-dialog-header
Jul 28, 2022
Merged

Move Javalab Editor header and dialogs into their own components#47116
sanchitmalhotra126 merged 3 commits intosanchit/javalab-editor-refactor/commitdialogfrom
sanchit/javalab-editor-refactor/split-dialog-header

Conversation

@sanchitmalhotra126
Copy link
Copy Markdown
Contributor

Now we can start to break up Javalab Editor by moving groups of related pieces into their own components. This moves the header (buttons & text) and dialogs into their own components. As with the other editor refactor PRs, this is branched off of the previous PR (#47082).

Links

JIRA: https://codedotorg.atlassian.net/browse/JAVA-603

Testing story

Tested locally.

Deployment strategy

Follow-up work

Some notes/next steps

  • I don't love how many props need to be manually passed in to JavalabEditorDialogManager. rename/newFileError seem like good candidates to move into redux. However I think the functions (onCreateFile, onDeleteFile, etc) will need to stay in JavalabEditor, or at least in some higher level component. I thought about how we could move these to their own component and I think the issue here is that these functions end up modifying the global state of the editor, namely the files and tabs. They also produce some side effects (such as calling projectChanged) so I don't think it makes sense to put that logic in redux either. My thought for now is to keep those in JavalabEditor and treat it as the high-level container component, while moving anything else out to its own component.
  • In the same vein, I think we could probably also pull out the tabs and editor windows into a separate component that manages displaying the right tab and editor window, as well as the dropdown menu. This would leave JavalabEditor with just the logic to update file metadata on create/edit/delete.

Privacy

Security

Caching

PR Checklist:

  • Tests provide adequate coverage
  • Privacy and Security impacts have been assessed
  • Code is well-commented
  • New features are translatable or updates will not break translations
  • Relevant documentation has been added or updated
  • User impact is well-understood and desirable
  • Pull Request is labeled appropriately
  • Follow-up work items (including potential tech debt) are tracked and linked

@sanchitmalhotra126 sanchitmalhotra126 requested a review from a team July 6, 2022 22:45
Copy link
Copy Markdown
Contributor

@molly-moen molly-moen left a comment

Choose a reason for hiding this comment

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

LGTM! I agree with your assessment on moving the file errors to redux but keeping the functions passed around.

/>
{backpackEnabled && (
<PaneSection style={styles.backpackSection}>
<Backpack
Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

Not sure if this is worth noting somewhere, but there are a couple of dialogs that can be shown within the Backpack component

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

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

Ah I see - I think it would make sense to leave those where they are since they're contained and controlled within the Backpack component?

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

Yeah totally, not suggesting we should move them (at least for now), but was wondering if we should note there are more possible dialogs than what appear in JavalabEditorDialogManager.

onDeleteFile={this.onDeleteFile}
filenameToDelete={fileMetadata[fileToDelete]}
onRenameFile={this.onRenameFile}
filenameToRename={fileMetadata[editTabKey]}
Copy link
Copy Markdown
Contributor

@bencodeorg bencodeorg Jul 18, 2022

Choose a reason for hiding this comment

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

Not sure if this would make it more confusing, but I think this could come from Redux in JavalabEditorDialogManager

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

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

Ah good call, will update to use Redux here.

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

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

Actually looking at this again, looks like fileToDelete is part of JavalabEditor's state so we'd still need to pass it in somehow. I could move the filenameToRename to redux since editTabKey comes from redux, but I think I may keep it as is for now for consistency, if that sounds ok? I think once we merge all these we'll be able to still move more stuff into redux/separate components so this would end up simplifying anyway.

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

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

Yep I was looking specifically at filenameToRename, and yeah agree consistency sounds good for now 👍

…factor/file-errors-redux

Move file error message into redux
@sanchitmalhotra126 sanchitmalhotra126 merged commit 625d79d into sanchit/javalab-editor-refactor/commitdialog Jul 28, 2022
@sanchitmalhotra126 sanchitmalhotra126 deleted the sanchit/javalab-editor-refactor/split-dialog-header branch July 28, 2022 17:19
@sanchitmalhotra126 sanchitmalhotra126 restored the sanchit/javalab-editor-refactor/split-dialog-header branch July 29, 2022 18:23
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants