Introduce 3 dots menu to notes - #60
Conversation
|
Important Review skippedAuto reviews are disabled on base/target branches other than the default branch. Please check the settings in the CodeRabbit UI or the You can disable this status message by setting the Use the checkbox below for a quick retry:
📝 WalkthroughWalkthroughThis pull request refactors the notes UI by replacing inline action buttons with a "More actions" dropdown menu. The changes consolidate WordPress export, RAG index controls, and note deletion into a single dropdown interface across the NoteEditor and NoteView components, supported by comprehensive test coverage using new Supabase mocking utilities. Changes
Estimated code review effort🎯 3 (Moderate) | ⏱️ ~20 minutes Possibly related PRs
Poem
🚥 Pre-merge checks | ✅ 2 | ❌ 1❌ Failed checks (1 warning)
✅ Passed checks (2 passed)
✏️ Tip: You can configure your own custom pre-merge checks in the settings. ✨ Finishing Touches🧪 Generate unit tests (beta)
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Comment |
Deploying everfreenote with
|
| Latest commit: |
caefee4
|
| Status: | ✅ Deploy successful! |
| Preview URL: | https://1519a541.everfreenote.pages.dev |
| Branch Preview URL: | https://features-improve-ui-rag.everfreenote.pages.dev |
![chatgpt-codex-connector[bot]](https://avatars.githubusercontent.com/in/1144995?s=60&v=4){kind=small}
There was a problem hiding this comment.
💡 Codex Review
Here are some automated review suggestions for this pull request.
Reviewed commit: 036875cc09
ℹ️ 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".
| AI index: {statusText()} | ||
| </DropdownMenuLabel> | ||
| <DropdownMenuItem | ||
| onClick={() => void handleIndex()} |
There was a problem hiding this comment.
In menu mode this item triggers indexing via onClick without preventing the dropdown’s default close behavior, so DropdownMenuContent unmounts immediately and RagIndexPanel loses its operation state while the network call is still running; users can reopen the menu and fire multiple concurrent rag-index requests against the same note, which wastes embedding quota and can race status updates. The adjacent delete-item comment already documents this unmount behavior, so index should use the same mounted-state strategy (or lift pending state out of the menu content).
Useful? React with 👍 / 👎.
| > | ||
| <Trash2 className="w-4 h-4 mr-2" /> | ||
| Delete | ||
| <span className="hidden sm:inline">Delete</span> |
There was a problem hiding this comment.
This change hides the only visible text label on small screens (hidden sm:inline) but does not add an aria-label to the button, so at mobile breakpoints the destructive delete action becomes an icon-only control with no accessible name for screen-reader users.
Useful? React with 👍 / 👎.
|
@CodeRabbit it's time to review |
|
✅ Actions performedReview triggered.
|
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
🧹 Nitpick comments (2)
ui/web/components/features/notes/NoteEditor.tsx (1)
193-227: Consider extracting a shared “More actions” menu composition.This block now mirrors the menu structure in
ui/web/components/features/notes/NoteView.tsx(RAG panel + optional WP export + separators). A shared subcomponent would reduce UI drift and test duplication over time.🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@ui/web/components/features/notes/NoteEditor.tsx` around lines 193 - 227, The More actions menu is duplicated between NoteEditor and NoteView; extract a shared component (e.g., MoreActionsMenu) that encapsulates the DropdownMenu composition and accepts props for noteId, moreMenuOpen/setMoreMenuOpen state handlers, getExportNote, handleExportRequest, wordpressConfigured, onDelete, and variant/trigger options; replace the inline menu in NoteEditor (and the duplicate in NoteView) with <MoreActionsMenu .../> passing RagIndexPanel and ExportToWordPressButton behavior via these props so separators and conditional rendering remain identical and tests can target the single component.cypress/component/features/notes/NoteView.cy.tsx (1)
7-48: Extract the WordPress Supabase mock into a shared test helper.
createSupabaseForExportDialogduplicates logic also present incypress/component/features/notes/NoteEditor.cy.tsx(Line 27-68). Moving this into a shared Cypress utility will reduce fixture drift across note-view/editor tests.🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed. In `@cypress/component/features/notes/NoteView.cy.tsx` around lines 7 - 48, createSupabaseForExportDialog duplicates the WordPress Supabase mock used in NoteEditor tests; extract this factory into a shared Cypress test helper (e.g., export a createSupabaseForExportDialog function from a new utils module) and replace the inline mock in NoteView.cy.tsx and NoteEditor.cy.tsx with an import from that helper so both tests reuse the same implementation; ensure the helper exports the same shape (returns { supabase, invoke }) and update both test files to import and call the shared createSupabaseForExportDialog, removing the duplicated inline code.
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.
Nitpick comments:
In `@cypress/component/features/notes/NoteView.cy.tsx`:
- Around line 7-48: createSupabaseForExportDialog duplicates the WordPress
Supabase mock used in NoteEditor tests; extract this factory into a shared
Cypress test helper (e.g., export a createSupabaseForExportDialog function from
a new utils module) and replace the inline mock in NoteView.cy.tsx and
NoteEditor.cy.tsx with an import from that helper so both tests reuse the same
implementation; ensure the helper exports the same shape (returns { supabase,
invoke }) and update both test files to import and call the shared
createSupabaseForExportDialog, removing the duplicated inline code.
In `@ui/web/components/features/notes/NoteEditor.tsx`:
- Around line 193-227: The More actions menu is duplicated between NoteEditor
and NoteView; extract a shared component (e.g., MoreActionsMenu) that
encapsulates the DropdownMenu composition and accepts props for noteId,
moreMenuOpen/setMoreMenuOpen state handlers, getExportNote, handleExportRequest,
wordpressConfigured, onDelete, and variant/trigger options; replace the inline
menu in NoteEditor (and the duplicate in NoteView) with <MoreActionsMenu .../>
passing RagIndexPanel and ExportToWordPressButton behavior via these props so
separators and conditional rendering remain identical and tests can target the
single component.
ℹ️ Review info
Configuration used: defaults
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (7)
cypress/component/features/notes/NoteEditor.cy.tsxcypress/component/features/notes/NoteView.cy.tsxcypress/component/features/notes/RagIndexPanel.cy.tsxui/web/components/features/notes/NoteEditor.tsxui/web/components/features/notes/NoteView.tsxui/web/components/features/notes/NotesShell.tsxui/web/components/features/notes/RagIndexPanel.tsx
1 participant
Summary by CodeRabbit
Release Notes
New Features
UI/UX Improvements