VFB-234 - Add Snapshot Functionality to Toolbar#219
VFB-234 - Add Snapshot Functionality to Toolbar#219jrmartin wants to merge 3 commits intodevelopmentfrom
Conversation
… layout navigation
|
@ddelpiano Ready for review, using the CameraAlt MUI icon |
There was a problem hiding this comment.
💡 Codex Review
Here are some automated review suggestions for this pull request.
Reviewed commit: 8df907cbd4
ℹ️ About Codex in GitHub
Your team has set up Codex to review pull requests in this repo. Reviews are triggered when you
- Open a pull request for review
- Mark a draft as ready
- Comment "@codex review".
If Codex has suggestions, it will comment; otherwise it will react with 👍.
Codex can also answer questions or update the PR. Try commenting "@codex address that feedback".
| id: 4, | ||
| icon: Layers, | ||
| name: "Layer", | ||
| }, | ||
| { | ||
| id: 4, | ||
| id: 5, | ||
| icon: ClearAll, | ||
| name: "Clear all", |
There was a problem hiding this comment.
Rebind Clear all after shifting nav item IDs
This commit moves Layer to id: 4 and Clear all to id: 5, but the desktop handlers still treat 4 as the clear-all action (index === 4 in SubHeader and bottomNav === 4 in Layout). In the desktop toolbar, clicking Layer can now invoke removeAllInstances() and wipe loaded instances, while the new Clear all item (id 5) no longer triggers the clear-all effect.
Useful? React with 👍 / 👎.
| {bottomNav === 0 && < VFBSnapshot open={true} setBottomNav={setBottomNav} />} | ||
| {bottomNav === 1 && < VFBUploader open={true} setBottomNav={setBottomNav} />} | ||
| {bottomNav === 2 && <VFBDownloadContents open={true} setBottomNav={setBottomNav} />} | ||
| {bottomNav === 3 && <QueryBuilder setBottomNav={setBottomNav} fullWidth={sidebarOpen} tabSelected={0}/>} |
There was a problem hiding this comment.
Move list-viewer trigger off the new Query ID
Query is remapped to bottomNav === 3 here, but Layout already has a side-effect on bottomNav === 3 that opens listViewerWidget and then resets bottomNav to undefined. After this change, clicking Query can immediately trigger the layer behavior and close the query panel, so the list-viewer side-effect should be moved to the new Layer ID.
Useful? React with 👍 / 👎.
| {bottomNav === 2 && <VFBDownloadContents open={true} setBottomNav={setBottomNav} />} | ||
| {bottomNav === 3 && <QueryBuilder setBottomNav={setBottomNav} fullWidth={sidebarOpen} tabSelected={0}/>} |
There was a problem hiding this comment.
Keep queryComponentOpened aligned with remapped IDs
With this remap, bottomNav === 2 now renders Download and Query moved to bottomNav === 3, but the queryComponentOpened effect in Layout still drives navigation to 2. When query-opening flows set that flag, users are taken to Download instead of QueryBuilder.
Useful? React with 👍 / 👎.
Adds snapshot functionality to toolbar, takes a snapshot of current UI and downloads images. No new libraries were added to VFB, it uses existing library in package.json:
html-to-imageDownloaded snapshot:

@ddelpiano This is pending changes to Figma for this and implemented those changes. Functionality is there though.