Skip to content

feat(COMPASS-9432): apply initial layout #7047

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.

Sign up for GitHub

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

Jump to bottom
Open
wants to merge 10 commits into
base: main
Choose a base branch
from
Open

feat(COMPASS-9432): apply initial layout #7047

wants to merge 10 commits into from

Conversation

paula-stacho
Copy link
Contributor

@paula-stacho paula-stacho commented Jun 20, 2025 •
edited
Loading

Description

  1. The new diagram is created at [-1, -1]
  2. The editor uses applyLayout from the diagramming lib to position the nodes
  3. The initial layout is saved to the store and storage, overriding the initial edit
Screenshot 2025-06-20 at 18 31 48

Checklist

  • New tests and/or benchmarks are included
  • Documentation is changed or added
  • If this change updates the UI, screenshots/videos are added and a design review is requested
  • I have signed the MongoDB Contributor License Agreement (https://www.mongodb.com/legal/contributor-agreement)

Motivation and Context

  • Bugfix
  • New feature
  • Dependency update
  • Misc

Open Questions

Dependents

Types of changes

  • Backport Needed
  • Patch (non-breaking change which fixes an issue)
  • Minor (non-breaking change which adds functionality)
  • Major (fix or feature that would cause existing functionality to change)

@github-actions github-actions bot added the feat label Jun 20, 2025
@paula-stacho paula-stacho added the feature flagged PRs labeled with this label will not be included in the release notes of the next release label Jun 20, 2025
@paula-stacho
Copy link
Contributor Author

The layouts work much better now with the dimensions fixed 🎉. But still not exactly as imagined. For example the screenshot is LEFT_RIGHT - I thought this would spread to more columns. STAR creates one column only. Are we doing something wrong or is this expected result? @lchans

@paula-stacho paula-stacho marked this pull request as ready for review June 20, 2025 16:48
@paula-stacho paula-stacho requested a review from a team as a code owner June 20, 2025 16:48
gribnoysup
gribnoysup reviewed Jun 23, 2025
View reviewed changes
packages/compass-data-modeling/test/setup-store.tsx
expect(store.getState().diagram?.edits.current).to.have.lengthOf(1);
});
const renderResult = renderWithConnections(
<Provider store={store}>{component}</Provider>,
Copy link
Collaborator

@gribnoysup gribnoysup Jun 23, 2025 •
edited
Loading

Choose a reason for hiding this comment

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

We have helpers for this in compass-testing-library, I strongly suggest you take a look at those. We added these specifically so that we don't need to spend time for similar setup all the time and so that making changes to the plugin internals is easier in the long run (otherwise every time we tinker with plugin system ALL tests might need to be updated accordingly). If those doesn't cover some case you are trying to cover here, please shout this out so that we can provide tools covering those and keep the benefits of a shared testing harness

@mabaasit FYI as you added some helpers here initially.

gribnoysup
gribnoysup reviewed Jun 23, 2025
View reviewed changes
packages/compass-data-modeling/src/components/diagram-editor.tsx
void applyInitialLayout(storedNodes);
return;
}
setNodes(storedNodes);
Copy link
Collaborator

Choose a reason for hiding this comment

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

The state itself is not an effect here, this is state derived from model, only applying initial layout is an effect

gribnoysup
gribnoysup reviewed Jun 23, 2025
View reviewed changes
gribnoysup
gribnoysup reviewed Jun 23, 2025
View reviewed changes
packages/compass-data-modeling/src/components/diagram-editor.tsx Outdated
console.error('Error applying layout:', err);
}
},
[setNodes]
Copy link
Collaborator

Choose a reason for hiding this comment

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

Missing dependencies

gribnoysup
gribnoysup reviewed Jun 23, 2025
View reviewed changes
packages/compass-data-modeling/src/components/diagram-editor.tsx Outdated
void applyInitialLayout(storedNodes);
return;
}
setNodes(storedNodes);
}, [model?.collections]);
Copy link
Collaborator

Choose a reason for hiding this comment

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

Missing dependencies

gribnoysup
gribnoysup reviewed Jun 23, 2025
View reviewed changes
packages/compass-data-modeling/src/components/diagram-editor.tsx
'LEFT_RIGHT'
);
setNodes(positionedNodes);
onApplyInitialLayout(
Copy link
Collaborator

Choose a reason for hiding this comment

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

We are supposed to also fit diagram into view after initial layout gets applied, right? I'm not seeing this happening at the moment

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers

@gribnoysup gribnoysup gribnoysup left review comments

At least 1 approving review is required to merge this pull request.

Assignees
No one assigned
Labels
feat feature flagged PRs labeled with this label will not be included in the release notes of the next release
Projects
None yet
Milestone
No milestone
Development

Successfully merging this pull request may close these issues.
2 participants
@paula-stacho @gribnoysup