Repository navigation
Layout menu, arranged imports, Postgres text defaults and canvas navigation - #1188
Merged
Merged
Conversation
Postgres text has no length limit, so drawDB does not ask for a size on a text column. The default value check still compared the default's length against field.size, which is empty for text. That comparison was false for every default, so drawDB listed each text column with a default under Issues as a default that does not match its type. The check now accepts any default on a text column. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
The auto arrange button now opens a menu of five layouts, and the editor applies each one as a single undo step. Dagre lays tables out left to right, as auto arrange did before, or top to bottom. ELK's layered engine gives every related field a port on its table's edge, so it orders tables by the rows their lines leave from. ELK's stress engine pulls related tables into clusters, and our removeOverlaps function then pushes any overlapping tables apart. The fifth option lays out each subject area on its own and packs the areas in the order of the Areas tab. The Edit menu lists the same five layouts under Auto arrange. We added elkjs as a dependency. The browser loads it only when someone picks one of its two layouts, so the editor's first load stays the same size. Claude Opus 5.5 translated the five layout names into 32 languages on 2026-10-31, and the other 18 language files fall back to English for them. We committed without the pre-commit hook. The locale files already differ from Prettier's formatting, so the hook would rewrap about 1,400 lines that have nothing to do with these strings. We ran ESLint and Prettier on the code files by hand. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
SQL and AI imports used to place tables in two rows and center the screen on the origin, so most of a large imported diagram was off the bottom right of the window. Only the database import ran auto arrange. Now SQL, AI and database imports all go through auto arrange, and the editor fits the view to the tables. When the person adds an import to an existing diagram rather than replacing it, we place the new tables below the tables already there and fit the view to both. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Two buttons next to auto arrange move every unlocked table, area and note away from the center of the screen, or toward it, by a factor of 1.2 per click. The editor keeps each table's size, so the gaps between tables change while the tables stay as they are. Each click is one undo step. After an auto arrange, the person can open up a crowded diagram or tighten a sparse one without running a full layout again. Claude Opus 5.5 translated the two button names into 32 languages on 2026-10-31, and the other 18 language files fall back to English for them. We committed without the pre-commit hook for the same reason as the layout menu commit, and ran ESLint and Prettier on the code files by hand. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
The canvas now has a scrollbar along its bottom and right edges. The canvas itself has no edges, so we measure each scrollbar against the box around every table, area, note and view, plus a margin of 200 diagram units, joined with the part of the diagram on screen. The thumb's length shows how much of the diagram the screen holds, and its position shows where the screen is. The person can drag the thumb to pan, or click the track beside it to move nine tenths of a screen toward the click. We hide a bar when the screen already shows the whole diagram along that bar's direction. The person can still pan with the mouse wheel or by dragging the canvas. We wrapped the canvas in one more element and drew the scrollbars outside #canvas, so image and PDF exports leave them out. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
The toolbar now has a zoom slider between the zoom out button and the zoom level menu. The slider runs from 5% to 400% on a log scale, so the same distance of travel always multiplies the zoom by the same factor. In fact, 25% to 50% takes as much travel as 100% to 200%. While the person drags, the slider shows the zoom level as a percentage. The zoom buttons, the menu and the mouse wheel work as before, and the slider follows any zoom they make. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
|
@lroder is attempting to deploy a commit to the dottle's projects Team on Vercel. A member of the Team first needs to authorize it. |
Member
|
you mind if i merge this to a dev branch and poke around a bit? |
Contributor
Author
|
Go for it! If I can answer any questions, let me know. I will say that I tested with a medium-sized diagram, about 20 tables and maybe three dozen foreign keys. That's bigger than fits on one screen, but it isn't massive. |
1ilit
added a commit
that referenced
this pull request
Nov 6, 2026
* Layout menu, arranged imports, Postgres text defaults and canvas navigation (#1188) * Accept any default value on a Postgres text column Postgres text has no length limit, so drawDB does not ask for a size on a text column. The default value check still compared the default's length against field.size, which is empty for text. That comparison was false for every default, so drawDB listed each text column with a default under Issues as a default that does not match its type. The check now accepts any default on a text column. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com> * Add a menu of layouts to the auto arrange button The auto arrange button now opens a menu of five layouts, and the editor applies each one as a single undo step. Dagre lays tables out left to right, as auto arrange did before, or top to bottom. ELK's layered engine gives every related field a port on its table's edge, so it orders tables by the rows their lines leave from. ELK's stress engine pulls related tables into clusters, and our removeOverlaps function then pushes any overlapping tables apart. The fifth option lays out each subject area on its own and packs the areas in the order of the Areas tab. The Edit menu lists the same five layouts under Auto arrange. We added elkjs as a dependency. The browser loads it only when someone picks one of its two layouts, so the editor's first load stays the same size. Claude Opus 5.5 translated the five layout names into 32 languages on 2026-10-31, and the other 18 language files fall back to English for them. We committed without the pre-commit hook. The locale files already differ from Prettier's formatting, so the hook would rewrap about 1,400 lines that have nothing to do with these strings. We ran ESLint and Prettier on the code files by hand. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com> * Arrange every import and fit the view to it SQL and AI imports used to place tables in two rows and center the screen on the origin, so most of a large imported diagram was off the bottom right of the window. Only the database import ran auto arrange. Now SQL, AI and database imports all go through auto arrange, and the editor fits the view to the tables. When the person adds an import to an existing diagram rather than replacing it, we place the new tables below the tables already there and fit the view to both. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com> * Add Spread out and Pull together buttons Two buttons next to auto arrange move every unlocked table, area and note away from the center of the screen, or toward it, by a factor of 1.2 per click. The editor keeps each table's size, so the gaps between tables change while the tables stay as they are. Each click is one undo step. After an auto arrange, the person can open up a crowded diagram or tighten a sparse one without running a full layout again. Claude Opus 5.5 translated the two button names into 32 languages on 2026-10-31, and the other 18 language files fall back to English for them. We committed without the pre-commit hook for the same reason as the layout menu commit, and ran ESLint and Prettier on the code files by hand. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com> * Add horizontal and vertical scrollbars to the canvas The canvas now has a scrollbar along its bottom and right edges. The canvas itself has no edges, so we measure each scrollbar against the box around every table, area, note and view, plus a margin of 200 diagram units, joined with the part of the diagram on screen. The thumb's length shows how much of the diagram the screen holds, and its position shows where the screen is. The person can drag the thumb to pan, or click the track beside it to move nine tenths of a screen toward the click. We hide a bar when the screen already shows the whole diagram along that bar's direction. The person can still pan with the mouse wheel or by dragging the canvas. We wrapped the canvas in one more element and drew the scrollbars outside #canvas, so image and PDF exports leave them out. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com> * Add a zoom slider to the toolbar The toolbar now has a zoom slider between the zoom out button and the zoom level menu. The slider runs from 5% to 400% on a log scale, so the same distance of travel always multiplies the zoom by the same factor. In fact, 25% to 50% takes as much travel as 100% to 200%. While the person drags, the slider shows the zoom level as a percentage. The zoom buttons, the menu and the mouse wheel work as before, and the slider follows any zoom they make. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com> --------- Co-authored-by: Claude Opus 5.5 <noreply@anthropic.com> * remove slider, pull in out * clean up translations * Drop non-English layout translations --------- Co-authored-by: Lee Roder <lroder@sbcglobal.net> Co-authored-by: Claude Opus 5.5 <noreply@anthropic.com>
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
This PR follows #1187 and holds the three changes you asked for there. I also kept three navigation additions from #1187 and put them in the last three commits, so you can drop any of them by reverting one commit or by stopping the stack early. I left out the short relationship labels and the legend.
textdefaults. The problem checker compared atextcolumn's default against a size thattextdoes not have, so it listed everytextcolumn with a default as a problem.#canvas, so exports leave them out.Each commit builds and passes ESLint on its own, and each one carries its own interface strings, so dropping a commit removes its strings with it. I tested the whole stack on an 18-table Postgres schema with 36 foreign keys.
The seven new interface strings are in 33 of drawDB's languages.¹
¹ Claude drafted the strings in 32 languages besides English: Arabic, Bulgarian, Chinese (Simplified and Traditional), Czech, Danish, Dutch, Filipino, Finnish, French, German, Greek, Hebrew, Hindi, Hungarian, Indonesian, Italian, Japanese, Korean, Malay, Norwegian, Persian, Polish, Portuguese, Romanian, Russian, Spanish, Swedish, Thai, Turkish, Ukrainian and Vietnamese, using each file's existing words for relationship, subject area and auto arrange. A native speaker's review would be welcome. The other 18 languages fall back to English for these strings for now.
🤖 Generated with Claude Code