Skip to content

Conversation

@mcyph
Copy link
Collaborator

@mcyph mcyph commented Dec 5, 2022

Summary

Converted the following remaining "stashed" examples to StoryBook:

  • Wires
  • GraphLayout
  • ShowRegion
  • MenuStyle
  • HtmlLabel
  • ShowRegion

Mostly have finished converting, but issues still remain:

  • Scrollbars (is starting to display, but appears to have a bug where <g> elements are inserted outside of the <svg> element)
  • Codec (does not appear to load elements; needs to be investigated)

This is in addition to the PR at #149 which converted the "Pinch Zoom" example. Editor examples still remain unconverted, although some progress has been made converting the "Ports" example to StoryBook.

Also has some fixes for the default parameters for MaxPopupMenu to restore the original mxGraph behavior.

Description for the changelog

Converted remaining "stashed" non-Editor and touch-related examples to StoryBook.

Other info

[UPDATE] The following has been reverted, see #150 (comment), #151 and 43ab435.
This adds an additional parameter to the main Graph class to allow overriding the class constructors in the "instantiators" parameter. I think there may be a better term for this, and there is a good question whether this should be merged into the "plugins", or references to these class constructors set in the class variables and overridden in subclasses.

As in types.ts, the following are able to be overridden:

export type GraphInstantiators = {
  GraphDataModel?: typeof GraphDataModel,
  GraphSelectionModel?: typeof GraphSelectionModel,
  Stylesheet?: typeof Stylesheet,
  GraphView?: typeof GraphView,
  CellRenderer?: typeof CellRenderer,
  VertexHandler?: typeof VertexHandler,
  EdgeHandler?: typeof EdgeHandler,
  EdgeSegmentHandler?: typeof EdgeSegmentHandler,
  ElbowEdgeHandler?: typeof ElbowEdgeHandler,
}

Still unresolved is how to allow "local" changes to style (color, size etc) variables in Constants.ts that are referred. I think it may make sense to allow providing these as an argument to Graph, or have some way of assigning these locally.

@tbouffard
Copy link
Member

@mcyph I don't understand the need to introduce GraphInstantiators, at least today.

There are already ways to override the Graph defaults:

  • GraphModel: pass it in the constructor
  • others: subclass Graph and override the createXXX methods

This is the historical mxGraph way. We can change it but this needs more discussions IMHO.
For instance (non exhaustive list)

  • with the current proposal, we now have two ways to override the default implementation: Subclass and composition. Why not keeping only one way for simplicity?
  • If we remove the createXX methods, this will introduce more API breaks comparing to mxGraph

There are pros and cons for all solutions.
So I suggest to not implement it in this Pull Request and create a dedicated discussion to collectively choose what we want.

Does it make sense?

@mcyph
Copy link
Collaborator Author

mcyph commented Dec 8, 2022

@tbouffard Have started a new discussion at #151 and moved my comments there, let me know your thoughts

@mcyph
Copy link
Collaborator Author

mcyph commented Dec 8, 2022

As I mention there, if wanting to keep with the conventions previously established by mxGraph I'm inclined to go with the create* factory functions and override them in subclasses, and will make this change in this branch in the interim.

Bear in mind the "draft" status of this merge request - I'm heading overseas for a few weeks+knew I likely won't have time to work on it while away, but have tried to fix as many examples as I could in last few weeks. I would've liked to have fixed the editor examples too, but I thought that would take longer.

If anyone would like to make changes to this or the other "Touches" branch in the meantime feel free.

@tbouffard
Copy link
Member

tbouffard commented Dec 8, 2022

Thanks @mcyph for the quick feedback and the status. Don't worry, maxGraph already owes you a lot, so we can all wait a bit for the finalization of this contribution. 👍🏿

I saw the Draft status, that's exactly why I wanted to let you know eventual issues with the newly introduced GraphInstantiators prior you move forward. 😄 I will feed the new discussion with my ideas.

…ators to the Graph constructor; fixes to the "Wires" story
@tbouffard tbouffard added the bug Something isn't working label Dec 3, 2023
@tbouffard
Copy link
Member

About "Codec (does not appear to load elements; needs to be investigated)":
The XML in the "stashed Codec" example corresponds to the old mxGraph format, which is currently impossible to load with maxGraph until we implement #293. It is therefore not possible to load elements with the current XML content.
The XML content could be updated to use the maxGraph format and thus load the elements.

# Conflicts:
#	packages/core/src/view/Graph.ts
Use single line comments instead of JSDoc styled-comments that could mess IDE and documentation generation
@tbouffard
Copy link
Member

I am in the process of reviving this PR.
I'm testing the updated stories locally and if they work, I'll merge this PR.

Fix imports
Adjust the code when needed
Apply prettier
Fix file header

GraphLayout
HtmlLabel
MenuStyle
ShowRegion
Scrollbars
Wires
@tbouffard
Copy link
Member

I have made the following stories work with Storybook v7. They are still written in JavaScript (I didn't have time to port them to TypeScript):

  • GraphLayout
  • HtmlLabel
  • MenuStyle
  • ShowRegion
  • Scrollbars
  • Wires

The examples are still not fully working. As the mxGraph examples were previously migrated to nextjs/react, some original code may not have been ported correctly.

@tbouffard tbouffard added enhancement New feature or request and removed bug Something isn't working labels Dec 21, 2023
@tbouffard tbouffard changed the title Fix remaining non-"Editor" examples to StoryBook [draft] feat: restore remaining non-"Editor" examples to StoryBook Dec 21, 2023
@tbouffard tbouffard marked this pull request as ready for review December 21, 2023 06:57
It was used a long time ago when examples were written in an application developed with Next.js
@tbouffard tbouffard changed the title feat: restore remaining non-"Editor" examples to StoryBook feat: restore remaining non-"Editor" examples to Storybook Dec 22, 2023
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

enhancement New feature or request

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants