-
Notifications
You must be signed in to change notification settings - Fork 0
feat(ColumnHeaderMenu): add replace functionality #169
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
feat(ColumnHeaderMenu): add replace functionality #169
Conversation
This commit adds a new "Replace" functionality to the ColumnHeaderMenu component. The changes include: - Adding a new `showReplaceDialog` ref to track the visibility of the replace dialog. - Implementing a `handleReplaceCompleted` function that is called when the replace operation is completed, displaying a success message. - Updating the "Replace" menu item to toggle the `showReplaceDialog` when clicked. - Adding a new `ReplaceDialog` component that handles the replace operation. - Updating the auto-imports to include the `useReplaceApi` composable and the `Dialog` component. These changes allow users to easily replace values in a column directly from the column header menu.
📝 WalkthroughSummary by CodeRabbit
WalkthroughAdds global component typings for Checkbox, Dialog, and a new ReplaceDialog. Updates ColumnHeaderMenu to open ReplaceDialog and handle completion. Introduces ReplaceDialog component that performs a replace operation via an API, emits completion with affected rows, and manages visibility and form state. Changes
Sequence Diagram(s)sequenceDiagram
autonumber
actor U as User
participant CHM as ColumnHeaderMenu
participant RD as ReplaceDialog
participant API as Backend API
U->>CHM: Click "Replace" on column
CHM->>RD: Open dialog (v-model:visible, columnField/header)
U->>RD: Enter find/replace, options
U->>RD: Click "Replace"
RD->>RD: Set isLoading, disable inputs
RD->>API: POST /projects/:id/replace { column, find, replace, caseSensitive, wholeWord }
API-->>RD: Response { affectedRows | error }
alt Success with affectedRows
RD-->>CHM: emit replace-completed(affectedRows)
RD->>RD: Reset form, close dialog
else Error or no affectedRows
RD->>RD: Show error, keep or close per logic
end
Estimated code review effort🎯 3 (Moderate) | ⏱️ ~25 minutes Possibly related PRs
Pre-merge checks and finishing touches✅ Passed checks (3 passed)
✨ Finishing touches
🧪 Generate unit tests
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 |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Actionable comments posted: 1
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (3)
frontend/components.d.ts(3 hunks)frontend/src/features/data-processing/components/ColumnHeaderMenu.vue(3 hunks)frontend/src/features/data-processing/components/ReplaceDialog.vue(1 hunks)
| if (!data?.affectedRows) { | ||
| showError([{ code: 'NOT_FOUND', message: 'Replace operation failed' }]) | ||
| return | ||
| } | ||
|
|
||
| if (data?.affectedRows !== undefined && data?.affectedRows !== null) { | ||
| emit('replace-completed', data.affectedRows) | ||
| } |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Handle 0-row results without flagging failure.
Line 44 treats data.affectedRows === 0 as a failure, which is a valid outcome when nothing matched the search. That branch shows an error and returns before we emit replace-completed, so callers never learn that the operation succeeded (with zero matches) and users see a spurious failure message. Please adjust the guard to only bail out when affectedRows is null/undefined, and continue to emit the event (and close the dialog) when it’s 0.
- if (!data?.affectedRows) {
- showError([{ code: 'NOT_FOUND', message: 'Replace operation failed' }])
+ if (data?.affectedRows == null) {
+ showError([{ code: 'NOT_FOUND', message: 'Replace operation failed' }])
return
}📝 Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| if (!data?.affectedRows) { | |
| showError([{ code: 'NOT_FOUND', message: 'Replace operation failed' }]) | |
| return | |
| } | |
| if (data?.affectedRows !== undefined && data?.affectedRows !== null) { | |
| emit('replace-completed', data.affectedRows) | |
| } | |
| if (data?.affectedRows == null) { | |
| showError([{ code: 'NOT_FOUND', message: 'Replace operation failed' }]) | |
| return | |
| } | |
| if (data?.affectedRows !== undefined && data?.affectedRows !== null) { | |
| emit('replace-completed', data.affectedRows) | |
| } |
🤖 Prompt for AI Agents
In frontend/src/features/data-processing/components/ReplaceDialog.vue around
lines 44 to 51, the current guard treats data.affectedRows === 0 as a failure
and returns early; change it to only treat affectedRows as missing (null or
undefined) as an error. Specifically, remove the check that interprets falsy
affectedRows as failure, instead check for affectedRows === null || affectedRows
=== undefined before calling showError and returning, and ensure
emit('replace-completed', data.affectedRows) runs for 0 as well so callers get
the zero-match result and the dialog can close.
This commit adds a new "Replace" functionality to the ColumnHeaderMenu component. The changes include:
showReplaceDialogref to track the visibility of the replace dialog.handleReplaceCompletedfunction that is called when the replace operation is completed, displaying a success message.showReplaceDialogwhen clicked.ReplaceDialogcomponent that handles the replace operation.useReplaceApicomposable and theDialogcomponent.These changes allow users to easily replace values in a column directly from the column header menu.