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

fix(ui): Tiny modal DAG tweaks. Fixes #4039 #4043

Merged
merged 4 commits into from
Sep 16, 2020
Merged

Conversation

alexec
Copy link
Contributor

@alexec alexec commented Sep 15, 2020

Checklist:

  • Either (a) I've created an enhancement proposal and discussed it with the community, (b) this is a bug fix, or (c) this is a chore.
  • The title of the PR is (a) conventional, (b) states what changed, and (c) suffixes the related issues number. E.g. "fix(controller): Updates such and such. Fixes #1234".
  • I've signed the CLA.
  • I have written unit and/or e2e tests for my change. PRs without these are unlikely to be merged.
  • My builds are green. Try syncing with master if they are not.
  • My organization is added to USERS.md.

Fixes #4039
Related to #3595 (#3967)

Screenshot 2020-09-15 at 15 28 52
Screenshot 2020-09-15 at 15 30 43
Screenshot 2020-09-15 at 16 39 55
Screenshot 2020-09-15 at 15 28 18

@alexec alexec added the ui label Sep 15, 2020
@alexec alexec added this to the v2.11 milestone Sep 15, 2020

private get vgap() {
return this.nodeSize;
private get gap() {
Copy link
Contributor Author

Choose a reason for hiding this comment

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

using a single gap value makes layout more predictable

@@ -568,6 +563,12 @@ export class WorkflowDag extends React.Component<WorkflowDagProps, WorkflowDagRe
}

private layoutGraph(nodes: string[], edges: Edge[]) {
const hash = {scale: this.scale, nodeCount: nodes.length, nodesToDisplay: this.state.nodesToDisplay};
Copy link
Contributor Author

Choose a reason for hiding this comment

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

move this check here so both graphs benefit

@alexec alexec marked this pull request as ready for review September 15, 2020 21:59
Comment on lines 397 to 400
edgesep: this.gap,
nodesep: this.gap,
rankdir: this.state.horizontal ? 'LR' : 'TB',
ranksep: 50 / this.scale
ranksep: this.gap
Copy link
Member

Choose a reason for hiding this comment

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

Does this change how the graph looks? Could you add a screenshot?

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 makes it more compact - moving from 50px sep to 32px sep (default zoom)

@simster7
Copy link
Member

Sorry I know this is still in draft mode... jumped the gun on the review

@alexec alexec merged commit fc77bee into argoproj:master Sep 16, 2020
@alexec alexec deleted the dag branch September 16, 2020 02:26
alexec added a commit that referenced this pull request Sep 16, 2020
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.

Tooltips should also be supplied for ellipsized text
2 participants