Add CB preview panel, using engine's `executeExpression` method to get input's evaluation result without changing actual code. Also, visualization evaluation failures are reported.
# Important Notes
* **The preview does not work yet due to engine issues**.
* The full screen preview does not work properly (it closes Component Browser). Will make a separate issue for that.
* The evaluated expression calls the visualization preprocessor in such a way it handles built-in visualizations properly, but not in general case. Will start discussion with engine how to fix that.
Introduce new AST type; use it to replace current uses of AstExtended; for now edits and synchronization are implemented on the old mechanisms (text edits / RelativeRange id map).
# Important Notes
- Edit-related code is commented out until the next PR because it is incompatible with the transitional IdMap-based synchronization.
- Closes#6206
- Zoom to all/zoom to selected in visualizations, are now both `Mod+A`
- Implement Zoom to all/zoom to selected for the graph - shortcut is `Mod+Shift+A`, as `Mod+A` is "select all nodes"
- Animate zoom+pan
# Important Notes
None
- Closes#8386
- Attempts to execute `<expr>.default_visualization` to query the engine for the *correct* fallback type
- If that is not possible, falls back to checking `inputType` - first for an exact match, then falling back to `Any` (i.e. the text/JSON visualization)
- Does not decide fallback based on the shape of the returned JSON
# Important Notes
Contains pretty significant refactors of `VisualizationMetadata` to allow it to be unset.
- Closes#8261
- Add vector editor widget
- Adding element to end
- Dragging elements
- Removing elements by dragging away
# Important Notes
- Both <kbd>Left Click</kbd> and <kbd>Ctrl</kbd> + <kbd>Left Click</kbd> are supported to begin a drag.
- Just <kbd>Left Click</kbd> alone is not sufficient as some widgets interact via left click
- Minor fixes for CodeMirror highlighting (the `!` to stop recursion was making the entire import line purple, and preventing strings inside operators from being highlighted)
- Change some icons that contain dark blue, to use `currentColor` instead
- Add execution time to hover tooltip (the LS is sending it, so might as well display it)
# Important Notes
None
- Closes#8288
- Show both `Panic`s and `DataflowError`s on nodes
- Update Code Editor diagnostics to use the same functionality to properly display `DataflowError`s
# Important Notes
- Does not include warnings
- ✔️ Done basic testing to ensure that errors *should* disappear and reappear as appropriate
- Closes#8234
- Make node expand to full width of visualization
- Have a fixed minimum width for visualizations, to be able to show at least the toolbar
- Clip viz-defined toolbars to the width visualization (don't let them overflow)
- We can consider wrapping viz-defined toolbars onto a separate line, later down the line
# Important Notes
None
- Closes#8404
# Important Notes
- All relevant documentation has already been updated in #8358.
- I've tested that the keyboard shortcuts send appropriate messages over the LS connection, and have confirmed that a non-error response is received, but I'm not sure that the profiling actually works.
- There seem to be no entries in `~/.enso/`, nor in `~/enso/`
* The "main view" (when no self type/module nor pattern is specified) contains all methods defined in top modules of every library
* Entries defined inside any "Internal" module from stdlib will be hidden by default; they will be visible only when self type is specified or the module path leading to such module internals.
* Fixed an issue with missing groups sometimes - we must wait with asking for groups for first executionComplete message.
* Modules and local variables have different default icon.
Fixed broken edge dragging and creating nodes from ports. Added basic support for multiple output ports, driven by already existing analysis of the port binding structure. Those constructs are not yet supported by the engine (hence the error in code), but the IDE has easier time already dealing with ports as individual binding expressions, not whole nodes.
<img width="865" alt="image" src="https://github.com/enso-org/enso/assets/919491/73126593-05c0-4553-ba6d-dad97d083c48">
Also improved the ability to interpret applied method arguments. Different cases of dynamic, static calls or partially applied functions are now properly supported.
<img width="961" alt="image" src="https://github.com/enso-org/enso/assets/919491/ffe02d79-841c-411d-a218-de89c2522f7b">
- Closes#8179
# Important Notes
- ⚠️ These tests are currently *not run* on any CI workflow.
- There is some unused code for mocking the PM. This has been intentionally kept, as this may be useful in the future.
Note that this may be useful for testing the dashboard, however the dashboard is currently only tested in cloud mode
- that is, without the backend switcher, and with only the remote backend available. As such, currently it uses HTTP API mocks, and no PM mock.
Fixes an exception when opening the code editor. `indexedDB.cmp` doesn't accept `undefined` values. Moved its usage to a separate function to guard against that.
Part of #8372
* Sorting was broken (sort's argument was removed)
* searching by initials now does not skip words
* icons: now we use same logic as existing nodes.
* local entities has worse score if "showLocals" option is toggled off.
# Important Notes
Please be aware that there is still an important issue with groups; sometimes they're not loaded. Reported [here](8376)
As suggested by @JaroslavTulach.
- Shows diagnostics sent by `executionContext/executionStatus`
- Shows `Panic`s and `DataflowError`s sent by `executionContext/expressionUpdates`
# Important Notes
None
Fixes#8334
There were two issues: one is bad code generated by vite. I needed to rephrase Rect.Zero definition. The second were missing widgets - that was caused by the fact that Vue components have a bit different properties than on test builds, apparently.
Fixes#8252
As we use proper alias analysis, we no longer display connections to overshadowed identifiers.
# Important Notes
I've changed the meaning of edge's "source" - now it's expression ID of the constituted identifier, not the node ID. This will allow proper handling nodes like `[x, y] = Main.get_point` once the engine will support them.
- Renames all `ReactiveIndex` and `ReactiveDb`s into the format `<key>To<value>`
- `ReactiveMapping`s (in `graphDatabase.ts`) currently have not been renamed - I'm not sure they need to be
- Removes various methods that have been made unnecessary by this change
- Simplifies some other methods
- Changes `SuggestionDb` to extend `ReactiveDb`
# Important Notes
None
- Closes#8071
# Important Notes
There is currently no way to predict the width a node, taking into account the width of widgets.
This should probably be done in another task.
Addresses several issues found during book club.
- Add placeholder icons for visualizations (see screenshot)
- Also add the corresponding export to visualizations, and relevant support in the visualization store and visualization metadata DB.
- Show icon both on the visualization selector button, and in each visualization selector entry
- Adjust gaps between visualization selector entries
- Port table viz fixes (#8102) to Vue
- Fix height of table rows to avoid cutting off descenders on letters like `y` and `g`
- Make the space and enter keys work on visualization toolbar buttons, if they are selected
- `.blur()` code editor when clicking outside of it
- And similarly `.blur()` visualization selector
- Move selection brush on scroll by scaling the delta of `scrollTop` and `scrollLeft`
- Note that mouse position is technically still incorrect when scrolling past the end. I think this is fine - the new behavior is less broken, plus I am not aware of any way to fix this.
# Important Notes
None
- Closes#8304
# Important Notes
- A better long-term solution may be to remove COOP/COEP/CORP headers instead, but that is out of scope of this PR.
- Feel free to create a new issue, or discuss elsewhere, if this is something we want to do eventually
Fixes: #8230
Fixes some rare cases caught by property tests, involving nodes with 0 width. `MultiRange` does not handle those. The thing is fixed by not using MultiRange, but by sorting nodes by the axis along which we're searching for free place.
All three reported seeds seem to be fixed.
# Important Notes
`MultiRange` is not used now, but I decided to spare it, violating YAGNI rule, as it is tested, and I feel it's a structure which may be useful.
Closes#8182
Also, improved handling of multiple files – they are placed with a small vertical gap now.
The design for uploading files is non-existent, so I implemented something simple and good-looking. We can easily adjust it at any time.
You can’t move or otherwise interact with nodes while they are uploading.
https://github.com/enso-org/enso/assets/6566674/c0709d8f-3b95-4913-a6eb-caae225b6598
Implements #8064 /
@kazcw Could you double-check that this plays well with your edge dragging implementation. Some of the code seemed a work in progress, and I want to avoid any issues with what you had planned there.
Add `line:column` information to source code references produced by the parser. This information will be used by GUI2 as part of the solution to #8134.
# Important Notes
- `parse_all_enso_files.sh` has been used to ensure this doesn't affect tree structures.
- `parse_all_enso_files.sh` now checks emitted locations for consistency, and has been used to verify that all line:col references match the values found by an independent scan of the source up to the given UTF8 position.
Part of #7926
I found myself wanting to use graph store in the `Input` class. As I learned about composables recently, I decided to refactor the class into a composable, to be more vue-like. Putting it in a separate PR because [other task may wanting to do the same](8066)
Also contains some preparations for my actual implementation.
Fixes#8070
When dragging a node, it is snapped to any axis being an extension to another node's boundary. This helps user keeping their nodes neatly aligned.
https://github.com/enso-org/enso/assets/3919101/36dd4d5f-55d3-4f3c-ba49-e8425fae8270
# Important Notes
* Now the position is saved to Yjs doc only when drag is finished.
* Node structure in graph store has two position fields: one representing what is currently stored in the node's metadata, and where the node is displayed. `nodeRects` use the visible rectangles.
The first part of #8158. No progress indication for the user implemented.
https://github.com/enso-org/enso/assets/6566674/2d8157d4-748f-4442-a9c3-a96ba0029056
# Important Notes
A few notable changes:
- A fix for `DataServer/writeBytes`
- Using `@noble/hashes` instead of `sha3` because the latter only works with node. I also tried using `js-sha3`, but it does not work well with Vite (see https://github.com/emn178/js-sha3/issues/36)
- Fixed initialization of the ID map for new nodes. Also, all new nodes are prepended by four spaces to have proper indentation inside the `main` function.
- Fixed random pattern name generation because the previous approach sometimes produces identifiers starting with a number.
While working on #8158, I noticed a crash when the `data` directory is created at the project root. Turns out it is the issue in the `ydoc-server`, which thinks every filesystem event is about files. Unfortunately, we don‘t have the needed info available, so we need to make the `file/info` request.
The qualified name for nodes was incorrect, resulting in the suggestion entry never being found.
# Important Notes
Should double-check that the issue is present on develop but not this PR. I've checked locally but it doesn't hurt to be extra sure.
Implementing most parts of the Documentation Panel in the new GUI.
Known issues:
- Links do not work (yet, covered by #7992)
- Some pages are entirely empty – I’m investigating. Missing doc sections likely cause this, so we probably want to add some placeholder.
- Tags do not look as in design. I tried implementing them correctly but didn't have enough time to finish everything. Some initial implementation is in place, though. I will create a separate task for them.
https://github.com/enso-org/enso/assets/6566674/a656ae78-5d4c-45f4-a0a5-e07fa573253e
[vokoscreenNG-2023-10-23_06-35-31.webm](https://github.com/enso-org/enso/assets/1047859/d8a5ffc5-4677-4264-a246-8def4418505a)
- Implement disconnected edges and edge interactions (#7864).
- Port edge layout from Rust.
- Implement output ports, hover extensions, backward-edge arrows, hover-splitting.
# Important Notes
- A new `currentInteraction` API supports mutually-exclusive interactions; this is used to cancel edge creation when the CB is opened. We can use it more generally to ensure only one major interaction is ongoing at a time.
- Remaining details to reach parity with gui1 edges: #8139
- Closes#8062
# Important Notes
- This PR uses a completely separate implementation from the regexes used for the existing filtering. AFAICT, this is unavoidable, since this needs to retrieve matched text.
- I've come across a couple minor bugs related to the Component Browser:
- When deleting text (backspacing), the full list of unfiltered entries momentarily reappear because the filtering is reset.
- Things like `h.m` match `HTTP_Method` - if this is not intentional, it seems like it might be more difficult to fix, unfortunately.
- Note that highlighting (I assume correctly?) *does not* highlight any part of `HTTP_Method`.
- Validate spans during existing lexer and parser unit tests, and in `enso_parser_debug`.
- Fix lost span info causing failures of updated tests.
# Important Notes
- [x] Output of `parse_all_enso_files.sh` is unchanged since before #7881 (modulo libs changes since then).
- When the parser encounters an input with the first line indented, it now creates a sub-block for lines at than indent level, and emits a syntax error (every indented block must have a parent).
- When the parser encounters a number with a base but no digits (e.g. `0x`), it now emits a `Number` with `None` in the digits field rather than a 0-length digits token.
Implements #8025: `LazyObject` now has a `visitChildren` method that observes each direct-child `LazyObject`. `childrenAstNodes` is now a simple function that flattens non-Tree nodes out of the hierarchy; `validateSpans` visits both `Tree`s and `Token`s the same way we would use the `ItemVisitor` Rust API.
- Change imports from `'./'` relative imports to `@/` or `shared/` whenever possible
- Imports in `shared/` and `ydoc-server` have been avoided for now in case they don't work with `@/` imports.
- Deduplicate `events.ts`, remove `useDocumentEvent` in favor of `useEvent(document,` (and same for `useDocumentEventConditional`
- Replace incorrect doc comments (`//*` and `///`) with correct doc comments (`/**`)
# Important Notes
None
- Closes#8041
- Integrates parser with CodeMirror
- Adds extensions builtin to CodeMirror
- Highlight text matching the selection
- Adds PoC CodeMirror extensions
- Basic syntax highlighting
- Code folding
- Hover tooltips
# Important Notes
As there is currently no way to get the corresponding node based on a position, the hover tooltip currently iterates through every node in `graphSotre.nodes`. This is potentially VERY SLOW and should be changed eventually, or disabled completely until an efficient implementation is possible.
SuggestionDb refactoring to facilitate documentation panel development and other features.
Now SuggestionDb uses `ReactiveDb` + `ReactiveIndex`es under the hood. There are no visual changes to the IDE. Everything still works the same.
You can now use two reactive indexes built on top of the SuggestionDb:
1. `db.nameToId` is a `QualifiedName→SuggestionId` relation. Reverse lookup allows you to get the qualified name by ID.
2. `db.parent` is a `SuggestionId→SuggestionId` relation, representing parent-children relations between entries. The rules are the following:
- If the `memberOf` field is present, it is used as a parent.
- Otherwise, a parent’s qualified name is used (through the `qnParent` function)
You can use reverse lookup to get the children of the entry.
You can easily add your own indexes if needed.
- Closes#8015
- Note that the (few) fallback icons are still present, as most CB entries are still missing icons. *However*, now the `iconName` from the libraries take priority over the fallback icon names.
- Also fixes a minor regression, where nodes pending execution were no longer faded out. This was introduced in #7988 because the wrong CSS variable was set.
# Important Notes
None
Fixes#7784
Instead of some heuristic, we now parse the CB's input and get the pattern and qualified name. Also we keep the "context" structure which may be used to apply suggestions properly.
# Important Notes
I created several helpers for AST. One of them is very hacky: we traverse AST tree by reading all getters in JS. Instead, we could generate it basing on schema.
- Removed `Cursor` and moved all accessors to standalone functions, reducing the generated code size significantly (especially after minification).
- Removed unnecessary `seek`s from everywhere. Now the offseting is part of each `read` implementation.
- Removed unnecessary differences between `read`s on abstract and concrete types. Now abstract types do the pointer access internally in their `read`.
- Closes#7925
# Important Notes
The type -> matching visualization lookup is populated using a `Promise`, so there is a race condition where the selector will incorrectly show the full list of visualizations if it is opened before the `Promise` resolves.
Generate TS bindings and lazy deserialization for the parser types.
# Important Notes
- The new API is imported into `ffi.ts`, but not yet used.
- I have tested the generated code in isolation, but cannot commit tests as we are not currently able to load WASM modules when running in `vitest`.
- Depends on #7773.
- Implements binary WebSocket protocol (data protocol)
- Performs some editor initialization (the bare minimum so that visualizations work)
- Adds event handlers to receive visualization data updates
# Important Notes
None
Closes#7823
We set fallback color for components without an assigned group, use a color defined in the group, or otherwise derive the color from the group name.
All group colors are available in the graph editor as CSS variables so that they can be dynamically edited and debugged via dev tools.
For deriving the color, we use [murmurhash](https://www.npmjs.com/package/murmurhash), which quickly produces sufficiently uniformly distributed 32-bit values and [oklch](https://evilmartians.com/chronicles/oklch-in-css-why-quit-rgb-hsl) colorspace. We will still have *some* hash collisions between different groups, but it shouldn't matter that much. I have also tried a few other hashes (namely `cybr53` and Java's string hashing), and the results were more or less similar.
`oklch` is rather a new thing in CSS, but it is available starting with Chrome 111, which is exactly the version we're using in Electron.
https://github.com/enso-org/enso/assets/6566674/7177f041-93e9-4536-b19f-6b67a2da8b7e
This PR adds support for the new Vue-based GUI (aka `gui2`).
The user-facing changes are primarily:
* support for `./run gui2` and `./run ide2` commands (that build just the new GUI and the whole IDE package with new GUI embedded — respectively);
* the top-level `test` and `lint` commands will now invoke the relevant commands on the new GUI
---------
Co-authored-by: Paweł Grabarz <frizi09@gmail.com>
PR adds initialization of suggestion db from the language sever (instead of fetching some mock). Also support for applying updates.
---------
Co-authored-by: Paweł Grabarz <frizi09@gmail.com>
Added bidirectional synchronization of module edits with language server. All document edits made by any of the Yjs peers are sent to language server to apply to the file. Any local file changes cause reload, which is synchronized back to Yjs by finding a diff.
- Closes#7874
- Chosen solution: Use the dashboard's shortcut manager to register keybinds and match mouse shortcuts
- Switch existing shortcuts to shortcut manager as well
- Switch visualizations to use the shortcut manager too
- Closes#7865
- Implements all shortcuts for node selection, *except* the arrow key shortcut
- Adds circle cursor selection brush
- The fade out from inactivity (which is present in the Rust source code) is currently missing
Other changes:
- Change everything to use `pointerdown` as appropriate, to ensure the event handlers are called in the right order
# Important Notes
The arrow key shortcut to navigate to the nearest node in that direction *has not* been implemented.
This may need discussion on how it should work
The implementation in general is pretty inefficient - this is intentional, performance can be optimized in the future
Because several tasks require execution context, this is a fast PR making one.
# Important Notes
* Changes in languageServer.ts and languageServerTypes.ts were directly ported from #7873
* We display warning about missing namespace, because the dashboard does not provide us any. Needs to be fixed at some point.
My first attempts to work with the `gui2` codebase. When looking at the IDE, I noticed that the top bar seems slightly off. I checked and confirmed that the sizes (heights) of some elements were not matching Figma.
Also, I tried using the `M PLUS 1` font, and it has a _completely_ different baseline than our previous one, effectively shifting all text down. I think we need to start using it as soon as possible, or else we will fix CSS rules everywhere.
I understand that the way I added the font is not the correct one, but I guess we can live with that until we properly include the files to the package.
Please forgive me, gods of Vue.js, @Frizi and @somebody1234, for this murder.
Before:
<img width="405" alt="Screenshot 2023-09-13 at 12 19 18 AM" src="https://github.com/enso-org/enso/assets/6566674/8ca81db8-1719-4761-97a1-741c2f76b45d">
After:
<img width="480" alt="Screenshot 2023-09-19 at 8 01 18 PM" src="https://github.com/enso-org/enso/assets/6566674/eb9783d3-0a34-4f1e-8afd-2f06a1b6db4f">
Dropdown animation:
https://github.com/enso-org/enso/assets/6566674/bab6baa9-23e3-4c2d-8494-1d464ba6902b
- Closes#7733
- Add infrastructure for defining custom visualizations
- Add all visualizations
# Important Notes
⚠️ Changes made:
- "Fit all" has been changed to always animate - this is because behavior was previously inconsistent:
- the scatterplot would always animate on "Fit all", but
- the histogram would never animate on "Fit all"
# Important Notes
- Binary LS endpoint is not yet handled.
- The parsing of provided source is not entirely correct, as each line (including imports) is treated as node. The usage of actual enso AST for nodes is not yet implemented.
- Modifications to the graph state are not yet synchronized back to the language server.
Fixes#7737
Added structures representing Suggestion Database entries. Currently, the db is loaded from a snapshot from the old GUI.
Added an input to CB and use it to filter components. The interpretation is simple: the input is split by the last dot, and the left part is considered a qualified name, and the right part is a function name written by the user so far. I rewrote the filtering algorithm designed by @jdunkerley, changing it a bit, so we support qualified names instead of just a type name.
https://github.com/enso-org/enso/assets/3919101/76a957f6-e53f-49ad-996c-398cd7112fc6
# Important Notes
* The component list is now sorted from "first to select" to "least interesting". The panel itself cares about putting the first on the bottom.
* The suggestion db snapshot is very big, so it's instead loaded from external server.
Adds widgets:
- Checkbox (with sorting)
- Numeric slider
- Dropdown (accepting a list of strings)
- Closes#7731
- Placeholder (underscore - has no actions)
# Important Notes
The widgets are currently added to every node, but are not synced with the yjs representation. This is intentional, as (afaict) the format for the AST representation is not yet finalized.
There are a number of design differences, for practical reasons:
- The dropdown now has a scrollbar.
- As a side effect, the sort button needed to be moved left, to avoid overlapping with the scrollbar.
- Note that it is *not* centered in the 8px horizontal padding. It is 4px wide, and has 1px left and 3px right padding: `.||||...`. (Note that the 8px horizontal padding from the design is retained.
- 4px of vertical padding has been inserted, so that there is *some* padding between the bubble for the selected item, and the outer dropdown container, when the first item is selected. Note that this is different to the 8px
- 16px of right margin has been inserted after every item. This is the same amount of padding that is added by the bubble. This means that the dropdown does not change in width when a long item is selected.
Design issues:
- The sort button for the dropdown overlaps the text
Updated the Component Browser stub from @Frizi's branch. Filled with some mocked data and implemented highlight and navigation.
https://github.com/enso-org/enso/assets/3919101/6af57413-bcb6-4402-9a4a-a992d58504ba
# Important Notes
Still missing the input panel, and obviously, the integration with anything will be a part of another task.
- Closes#7730. Adds top bar containing:
- Project title
- Execution mode selector (design/live)
- Navbar containing:
- Navigation previous/next button
- Breadcrumbs
# Important Notes
Icons are currently all separate files. This may need to be changed to a single svg containing individual icons in `defs` if(/when) that is merged into `develop`.
