ENG-1681: Advanced Search dialog with split-view preview (Roam)#994
ENG-1681: Advanced Search dialog with split-view preview (Roam)#994trangdoan982 wants to merge 4 commits intomainfrom
Conversation
|
This pull request has been ignored for the connected project Preview Branches by Supabase. |
![graphite-app[bot]](https://avatars.githubusercontent.com/in/158384?s=60&v=4){kind=small}
Adds a new command-palette-triggered search dialog ("DG: Open Node Search
Menu") with a split-view layout: left panel lists discourse node results,
right panel shows a live content preview of the selected node.
Key features:
- Chip-based type filters: type a 3-letter trigger + space (e.g. "evd ") to
add a filter chip; Tab autocompletes ghost text; Backspace focuses then
removes the last chip; ←/→ navigates between chips
- Filter popover with tri-state select-all, per-row "Only" button, and a
type-search field (portaled past modal overflow:hidden)
- Sort dropdown (Relevance, Date modified, Date created, Alphabetical, Most
connected) with per-sort directional toggles
- Help popover showing all keyboard shortcuts and type triggers dynamically
from the user's discourse graph config
- MiniSearch for fuzzy/prefix client-side search across all signed-in graphs
(via getAllDiscourseNodesSince)
- Preview pane: debounced pull() for current-graph nodes (80ms, cached);
cross-graph nodes show metadata + "open to view" note
- Enter/open actions are TODO stubs (covered in ENG-1682)
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
trangdoan982
force-pushed
the
eng-1681-advanced-search-search-dialog-ui-with-results-and-filtering
branch
from
f9155c4 to
9de15da
Compare
| return { | ||
| id: node.type, | ||
| label: node.text, | ||
| abbrev, | ||
| color: node.canvasSettings?.color ?? "#8E8E8E", | ||
| trigger, | ||
| aliases, | ||
| kind, | ||
| }; |
There was a problem hiding this comment.
The returned object is missing the required badgeStyle property from NodeTypeConfig. Add badgeStyle: {} as CSSProperties to the returned object so it satisfies the type. The actual value will be overwritten in index.tsx when getNodeTagStyles is called. Change the return to: { id: node.type, label: node.text, abbrev, color: node.canvasSettings?.color ?? '#8E8E8E', badgeStyle: {} as CSSProperties, trigger, aliases, kind }
Spotted by Graphite (based on CI logs)
Is this helpful? React 👍 or 👎 to let us know.
| import { | ||
| type NodeTypeConfig, | ||
| type Sort, | ||
| type SortKey, | ||
| type SortDir, | ||
| } from "./types"; |
There was a problem hiding this comment.
Remove the unused SortDir import. The import block should only include NodeTypeConfig, Sort, and SortKey since SortDir is never referenced in this file.
Spotted by Graphite (based on CI logs)
Is this helpful? React 👍 or 👎 to let us know.
| @@ -0,0 +1,145 @@ | |||
| import React, { useState, useEffect, useRef } from "react"; | |||
There was a problem hiding this comment.
Add /* eslint-disable @typescript-eslint/naming-convention */ at the top of the file (line 1, before the React import) to suppress naming convention violations for Roam API's colon-prefixed property names like :block/string, :block/order, :block/children, :node/title.
Spotted by Graphite (based on CI logs)
Is this helpful? React 👍 or 👎 to let us know.
1 participant
Summary
Implements the Advanced Search dialog for Roam, triggered from the command palette via "DG: Open Node Search Menu".
evd) to add a filter chip; Tab autocompletes ghost text; Backspace focuses then removes the last chip; ←/→ navigates between chips; triggers derived fromnode.tagdocument.bodyso it escapes the modal'soverflow: hiddengetAllDiscourseNodesSince)pull()for current-graph nodes (80ms, cached); cross-graph nodes show metadata + "open to view" noteEnter/open actions (
↵,⇧↵,⌘↵) are no-op stubs — covered in ENG-1682.Test plan
evd(or other node tag prefix + space) → chip is added, results filter to that typeev) → ghost autocomplete appears → Tab adds chip🤖 Generated with Claude Code