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

Json io #332

Open
wants to merge 13 commits into
base: main
Choose a base branch
from
Open

Json io #332

wants to merge 13 commits into from

Conversation

KevinDCarlson
Copy link
Collaborator

@KevinDCarlson KevinDCarlson commented Jan 17, 2025

This PR implements the ability to download a JSON dump of a model or a diagram and to upload it back via either the file browser or copy-paste.

A little skeleton code is present for analyses but there are design questions there and I would guess we should just merge this without worrying about analyses yet.

TODO:

  • CSS for the JSON import component.

Copy link

github-actions bot commented Jan 17, 2025

Copy link
Collaborator Author

Choose a reason for hiding this comment

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

I've put this in components and export in util because export doesn't actually build a component but it needs to be used by model_menu, diagram_menu, and analysis_menu. Not sure if that's the right file structure.

@@ -48,7 +51,13 @@ export function DiagramMenuItems(props: {
navigate(`/diagram/${newRef}`);
};

return (
//Can this be less repetitive?
Copy link
Collaborator Author

Choose a reason for hiding this comment

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

i.e. I'm wondering whether we should have an overarching Menu type that extends to DiagramMenu etc. Seems like a fair amount of duplicated boilerplate otherwise.

return (
//Can this be less repetitive?
const onDownloadJSON = (diagram: DiagramDocument) => {
downloadJson({ data: JSON.stringify(diagram), filename: `${diagram.name}.json` });
Copy link
Collaborator Author

Choose a reason for hiding this comment

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

The straight stringify of a diagram contains the Automerge hash of the diagram's model. What this means is that this simplest possible implementation has the behavior that if you download a diagram D in model M and then re-upload it, you get a diagram D' in the same model M. I think this is plausible behavior but worth thinking over.

}

export const JsonImport: Component<Props> = (props) => {
const [error, setError] = createSignal<string | null>(null);
Copy link
Collaborator Author

Choose a reason for hiding this comment

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

This reactive error isn't currently being used. I'm not sure whether this is the paradigm we want here or, if so, quite how best to make use of it.

@KevinDCarlson
Copy link
Collaborator Author

I've added some css for the import menu. I was hoping to make the text box auto-widen after pasting in json but couldn't quite figure out the right way to do this, so it just gets taller at the moment. I suppose it doesn't matter much, people aren't likely to be looking closely at their raw JSON. Possibly the ideal solution would be to have an in-client JSON parser display the pasted JSON nicely formatted? But it seems pretty unimportant.

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.

1 participant