slides: add context menu, insert cell actions#9783
Open
Light2Dark wants to merge 4 commits into
Open
Conversation
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
Light2Dark
changed the title
Contributor
There was a problem hiding this comment.
Pull request overview
This PR enhances the slides editing experience by adding minimap affordances (context menu + insert-cell lines) and improving slide deck composition/overlay behavior to prevent editor focus loss when a parked/no-output cell starts producing output.
Changes:
- Add insert/delete actions to the slides minimap (inline “insert cell” lines + right-click context menu).
- Refactor parked preview behavior in
RevealSlidesComponentto “hold” an editing cell in the overlay to avoid editor remount/focus loss, and to keep held cells out of the composed deck. - Expose/consume
LanguageTogglesin slide cell view and make its wrapper class configurable; add/expand unit tests for the new parked-preview logic.
Reviewed changes
Copilot reviewed 5 out of 5 changed files in this pull request and generated 2 comments.
Show a summary per file
| File | Description |
|---|---|
| frontend/src/components/slides/slide-cell-view.tsx | Adds language toggles to slide cell view and ensures toggle callbacks are stable. |
| frontend/src/components/slides/reveal-component.tsx | Introduces held parked-preview logic, factors out deck slide type resolution, and tweaks code-toggle UX when code is pinned on. |
| frontend/src/components/slides/minimap.tsx | Adds insert-cell UI lines and a context menu for slide thumbnail rows; adjusts thumbnail row semantics. |
| frontend/src/components/slides/tests/reveal-component.test.ts | Adds coverage for deckSlideType, parkedRendersSource, and useParkedPreview. |
| frontend/src/components/editor/cell/code/language-toggle.tsx | Adds an optional className prop to allow alternate placement/styling of language toggles. |
![cubic-dev-ai[bot]](https://avatars.githubusercontent.com/in/1082092?s=60&v=4){kind=small}
Contributor
There was a problem hiding this comment.
2 issues found across 5 files
Architecture diagram
sequenceDiagram
participant User
participant Minimap as Slides Minimap
participant SlideRow as SlideThumbnailRow
participant ContextMenu as ContextMenu Trigger
participant InsertBtn as InsertCellLine
participant CellActions as useCellActions
participant DeleteCell as useDeleteCellCallback
participant Deck as RevealSlidesComponent
participant ParkedPreview as useParkedPreview
participant DeckSlideType as deckSlideType
participant SlideCellView as SlideCellView
participant LangToggles as LanguageToggles
participant SlideCells as slideCells Store
Note over User,SlideCells: Insert Cell Flow
User->>Minimap: Clicks insert line
Minimap->>InsertBtn: Renders "+" button
InsertBtn->>InsertBtn: Stops pointer event propagation
InsertBtn->>CellActions: createNewCell({ cellId, before, code: "", autoFocus: false })
CellActions->>SlideCells: Insert new blank cell
SlideCells-->>Deck: Cell list updates
Deck->>Deck: Re-compute composition
Note over User,SlideCells: Context Menu Flow
User->>Minimap: Right-clicks slide thumbnail
Minimap->>ContextMenu: Opens (onInsertBelow / onDelete present)
alt User selects "Add cell"
ContextMenu-->>CellActions: onInsertBelow
CellActions->>SlideCells: Insert cell after
else User selects "Delete cell"
ContextMenu-->>DeleteCell: onDelete
DeleteCell->>SlideCells: Remove cell from store
end
Note over Deck,ParkedPreview: Parked Preview / Held Edit Flow
Deck->>ParkedPreview: useParkedPreview({ activeCell, slideConfigs, noOutputIds })
alt No output cell selected
ParkedPreview->>ParkedPreview: baseParked = true (no output or skip type)
ParkedPreview-->>Deck: { parkedPreviewCell, isNoOutputPreview: true, heldEditCellId: null }
else Output cell currently being edited
ParkedPreview->>ParkedPreview: baseParked = false, but heldParkedCellRef matches activeCell
ParkedPreview-->>Deck: { parkedPreviewCell, isHeldEdit: true, heldEditCellId }
else Normal rendered cell
ParkedPreview-->>Deck: { parkedPreviewCell: null }
end
Deck->>Deck: Use heldEditCellId in deckSlideType() to skip held cell from deck
DeckSlideType->>DeckSlideType: Returns "skip" for held/ no-output cells
Note over Deck,SlideCellView: Cell Rendering in Parked Overlay
Deck->>Deck: If parkedPreviewCell exists, render overlay
Deck->>SlideCellView: Render cell in overlay (if editable)
SlideCellView->>LangToggles: NEW: Shows language toggles
SlideCellView->>SlideCellView: On toggle, calls maybeAddMarimoImport()
Deck->>Deck: parkedRendersSource() decides source vs output display
Note over User,Minimap: Keyboard Navigation
User->>Minimap: Arrow keys while parked
Minimap->>Deck: Navigate to next/prev slide
alt Held cell releases
Deck->>ParkedPreview: New activeCell triggers release
ParkedPreview->>ParkedPreview: heldParkedCellRef reset
ParkedPreview-->>Deck: parkedPreviewCell = null
end
Note over SlideCellView,LangToggles: Language Toggle Integration
SlideCellView->>LangToggles: NEW: Renders with custom className
LangToggles->>SlideCellView: onAfterToggle
SlideCellView->>SlideCellView: maybeAddMarimoImport()
SlideCellView->>CellActions: createNewCell if autoInstantiate
Reply with feedback, questions, or to request a fix.
Re-trigger cubic
Collaborator
Author
|
@dmadisetti what do you think about this addition? |
Contributor
There was a problem hiding this comment.
2 issues found across 2 files (changes from recent commits).
Prompt for AI agents (unresolved issues)
Check if these issues are valid — if so, understand the root cause of each and fix them. If appropriate, use sub-agents to investigate and fix each issue separately.
<file name="frontend/src/components/slides/reveal-component.tsx">
<violation number="1" location="frontend/src/components/slides/reveal-component.tsx:567">
P2: The held-edit `C` toggle is transient; it never updates the shared code-visibility override, so the cell reverts to its previous code state once it leaves the parked overlay.</violation>
<violation number="2" location="frontend/src/components/slides/reveal-component.tsx:667">
P2: Held preview ignores persisted `showCode: true`, so code can stay hidden during held edits.</violation>
</file>
Tip: Review your code locally with the cubic CLI to iterate faster.
Re-trigger cubic
Comment on lines
+667
to
+669
| const parkedShowCode = isHeldEdit | ||
| ? heldShowsCode | ||
| : resolveShowCode(parkedPreviewCell?.id); |
Contributor
There was a problem hiding this comment.
P2: Held preview ignores persisted showCode: true, so code can stay hidden during held edits.
Prompt for AI agents
Check if this issue is valid — if so, understand the root cause and fix it. At frontend/src/components/slides/reveal-component.tsx, line 667:
<comment>Held preview ignores persisted `showCode: true`, so code can stay hidden during held edits.</comment>
<file context>
@@ -630,9 +664,9 @@ const RevealSlidesComponent = ({
- // While holding a cell in the overlay for an in-progress edit we must keep
- // the editor mounted
- const parkedShowCode = resolveShowCode(parkedPreviewCell?.id) || isHeldEdit;
+ const parkedShowCode = isHeldEdit
+ ? heldShowsCode
+ : resolveShowCode(parkedPreviewCell?.id);
</file context>
Suggested change
| const parkedShowCode = isHeldEdit | |
| ? heldShowsCode | |
| : resolveShowCode(parkedPreviewCell?.id); | |
| const parkedShowCode = isHeldEdit | |
| ? heldShowsCode || codeAlwaysShown | |
| : resolveShowCode(parkedPreviewCell?.id); |
Comment on lines
+567
to
570
| if (isHeldEdit) { | ||
| toggleHeldShowsCode(); | ||
| return; | ||
| } |
Contributor
There was a problem hiding this comment.
P2: The held-edit C toggle is transient; it never updates the shared code-visibility override, so the cell reverts to its previous code state once it leaves the parked overlay.
Prompt for AI agents
Check if this issue is valid — if so, understand the root cause and fix it. At frontend/src/components/slides/reveal-component.tsx, line 567:
<comment>The held-edit `C` toggle is transient; it never updates the shared code-visibility override, so the cell reverts to its previous code state once it leaves the parked overlay.</comment>
<file context>
@@ -534,6 +564,10 @@ const RevealSlidesComponent = ({
if (cellIdToShowCode == null || codeAlwaysShown) {
return;
}
+ if (isHeldEdit) {
+ toggleHeldShowsCode();
+ return;
</file context>
Suggested change
| if (isHeldEdit) { | |
| toggleHeldShowsCode(); | |
| return; | |
| } | |
| if (isHeldEdit) { | |
| startTransition(() => | |
| setShowCodeOverrides((prev) => { | |
| const next = new Set(prev); | |
| if (next.has(cellIdToShowCode)) { | |
| next.delete(cellIdToShowCode); | |
| } else { | |
| next.add(cellIdToShowCode); | |
| } | |
| return next; | |
| }), | |
| ); | |
| toggleHeldShowsCode(); | |
| return; | |
| } |
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.
📝 Summary
Adds a context menu, and a line between slide cells to insert new ones. Also fixes some focus bugs and keypress bugs when doing this.
Screen.Recording.2026-06-04.at.11.56.20.AM.mov
📋 Pre-Review Checklist
✅ Merge Checklist