add: filetype for import collection#6533
Conversation
WalkthroughIntroduces a collection format selection feature allowing users to choose between BRU and OpenCollection YAML formats when importing collections. The format selection flows from the import UI through Redux actions to the Electron IPC handler, which applies the format to derived filenames. Changes
Sequence DiagramsequenceDiagram
actor User
participant ImportUI as ImportCollectionLocation
participant Modal as CollectionsSection
participant Redux as Redux Action
participant IPC as Electron IPC
participant Handler as collection.js
User->>ImportUI: Select format (BRU/YAML)
User->>ImportUI: Submit import form
ImportUI->>Modal: Call handleImportCollectionLocation(path, files, {format})
Modal->>Redux: dispatch(importCollection(path, files, {format}))
rect rgb(200, 220, 255)
Note over Redux,Handler: IPC Call with Format Option
Redux->>IPC: renderer:import-collection(path, files, collection, {format})
end
IPC->>Handler: Process import with format
Handler->>Handler: getFilenameWithFormat(item, format)
Handler-->>IPC: Collection imported with formatted filenames
rect rgb(200, 255, 220)
Note over IPC,Modal: Success Flow
IPC-->>Redux: Promise resolves
Redux-->>Modal: Success
Modal->>User: Show success toast + close modal
end
Estimated code review effort🎯 3 (Moderate) | ⏱️ ~25 minutes Possibly related PRs
Suggested reviewers
Poem
Pre-merge checks and finishing touches✅ Passed checks (3 passed)
✨ 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 |
There was a problem hiding this comment.
Actionable comments posted: 0
🧹 Nitpick comments (2)
packages/bruno-electron/src/ipc/collection.js (1)
854-863: Consider extractinggetFilenameWithFormatto module scope for reuse.The helper is currently scoped to the
importCollectionhandler. Similar logic exists in theclone-folderhandler (lines 978-979), suggesting this utility could be reused across multiple IPC handlers.🔎 Proposed refactor to extract helper to module scope
Move the helper function to module scope (e.g., after line 72, near other utility functions):
const uiStateSnapshotStore = new UiStateSnapshotStore(); + +const getFilenameWithFormat = (item, format) => { + if (item?.filename) { + const ext = path.extname(item.filename); + if (ext === '.bru' || ext === '.yml') { + return item.filename.replace(ext, `.${format}`); + } + return item.filename; + } + return `${item.name}.${format}`; +}; // size and file count limits to determine whether the bru files in the collection should be loaded asynchronously or not.Then update the
clone-folderhandler to use it:if (['http-request', 'graphql-request', 'grpc-request'].includes(item.type)) { const content = await stringifyRequestViaWorker(item, { format }); - // Use the correct file extension based on target format - const baseName = path.parse(item.filename).name; - const newFilename = format === 'yml' ? `${baseName}.yml` : `${baseName}.bru`; + const newFilename = getFilenameWithFormat(item, format); const filePath = path.join(currentPath, newFilename);packages/bruno-app/src/components/Sidebar/ImportCollectionLocation/index.js (1)
214-237: Review help text accuracy and label consistency.The format selection UI is functionally correct, but consider the following refinements:
Line 220: The help text claims "Industry-standard YAML format" for OpenCollection. Verify this is accurate, as OpenCollection appears to be a Bruno-specific format rather than a widely adopted industry standard.
Lines 234-235: The option labels use inconsistent patterns:
"OpenCollection (YAML)""BRU Format (.bru)"Consider standardizing to either include or exclude file extensions in both labels, e.g.:
"OpenCollection (.yml)"and"BRU (.bru)", or"OpenCollection (YAML)"and"BRU"🔎 Proposed refinement for clarity
<Help width="300"> <p>Choose the file format for storing requests in this collection.</p> <p className="mt-2"> - <strong>OpenCollection (YAML):</strong> Industry-standard YAML format (.yml files) + <strong>OpenCollection (YAML):</strong> YAML-based format (.yml files) </p> <p className="mt-1"> <strong>BRU:</strong> Bruno's native file format (.bru files) </p> </Help> </label> <select id="format" name="format" className="block textbox mt-2 w-full" value={collectionFormat} onChange={(e) => setCollectionFormat(e.target.value)} > - <option value="yml">OpenCollection (YAML)</option> - <option value="bru">BRU Format (.bru)</option> + <option value="yml">OpenCollection (.yml)</option> + <option value="bru">BRU (.bru)</option> </select>
📜 Review details
Configuration used: Path: .coderabbit.yaml
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (4)
packages/bruno-app/src/components/Sidebar/ImportCollectionLocation/index.jspackages/bruno-app/src/components/Sidebar/Sections/CollectionsSection/index.jspackages/bruno-app/src/providers/ReduxStore/slices/collections/actions.jspackages/bruno-electron/src/ipc/collection.js
🧰 Additional context used
📓 Path-based instructions (1)
**/*.{js,jsx,ts,tsx}
📄 CodeRabbit inference engine (CODING_STANDARDS.md)
**/*.{js,jsx,ts,tsx}: Use 2 spaces for indentation. No tabs, just spaces
Stick to single quotes for strings. For JSX/TSX attributes, use double quotes (e.g., )
Always add semicolons at the end of statements
No trailing commas
Always use parentheses around parameters in arrow functions, even for single params
For multiline constructs, put opening braces on the same line, and ensure consistency. Minimum 2 elements for multiline
No newlines inside function parentheses
Space before and after the arrow in arrow functions.() => {}is good
No space between function name and parentheses.func()notfunc ()
Semicolons go at the end of the line, not on a new line
Names for functions need to be concise and descriptive
Add in JSDoc comments to add more details to the abstractions if needed
Add in meaningful comments instead of obvious ones where complex code flow is explained properly
Files:
packages/bruno-app/src/providers/ReduxStore/slices/collections/actions.jspackages/bruno-app/src/components/Sidebar/ImportCollectionLocation/index.jspackages/bruno-electron/src/ipc/collection.jspackages/bruno-app/src/components/Sidebar/Sections/CollectionsSection/index.js
🧠 Learnings (2)
📚 Learning: 2025-12-17T21:41:24.730Z
Learnt from: naman-bruno
Repo: usebruno/bruno PR: 6407
File: packages/bruno-app/src/components/Environments/ConfirmCloseEnvironment/index.js:5-41
Timestamp: 2025-12-17T21:41:24.730Z
Learning: Do not suggest PropTypes validation for React components in the Bruno codebase. The project does not use PropTypes, so reviews should avoid proposing PropTypes and rely on the existing typing/validation approach (e.g., TypeScript or alternative runtime checks) if applicable. This guideline applies broadly to all JavaScript/JSX components in the repo.
Applied to files:
packages/bruno-app/src/providers/ReduxStore/slices/collections/actions.jspackages/bruno-app/src/components/Sidebar/ImportCollectionLocation/index.jspackages/bruno-electron/src/ipc/collection.jspackages/bruno-app/src/components/Sidebar/Sections/CollectionsSection/index.js
📚 Learning: 2025-12-16T07:16:23.647Z
Learnt from: sanish-bruno
Repo: usebruno/bruno PR: 6090
File: tests/scripting/hooks/init-user-data/ui-state-snapshot.json:1-8
Timestamp: 2025-12-16T07:16:23.647Z
Learning: For e2e tests in the bruno repository: Collections that are shared between CLI and UI tests (comprehensive test suites testing core functionality) should be placed in `packages/bruno-tests/` to avoid duplication. The `tests/**/fixtures/collection` pattern should be used for test-specific collections that test particular UI behaviors or are specific to a single test file.
Applied to files:
packages/bruno-app/src/components/Sidebar/Sections/CollectionsSection/index.js
🧬 Code graph analysis (3)
packages/bruno-app/src/providers/ReduxStore/slices/collections/actions.js (5)
packages/bruno-electron/src/ipc/collection.js (1)
collectionPath(101-101)packages/bruno-electron/src/ipc/network/index.js (1)
collectionPath(338-338)packages/bruno-cli/src/commands/run.js (1)
collectionPath(295-295)packages/bruno-electron/src/ipc/network/prepare-request.js (1)
collectionPath(309-309)packages/bruno-cli/src/runner/prepare-request.js (1)
collectionPath(18-18)
packages/bruno-app/src/components/Sidebar/ImportCollectionLocation/index.js (1)
packages/bruno-app/src/components/Help/index.js (1)
Help(11-38)
packages/bruno-app/src/components/Sidebar/Sections/CollectionsSection/index.js (2)
packages/bruno-app/src/components/WorkspaceHome/WorkspaceOverview/index.js (2)
handleImportCollectionLocation(60-71)dispatch(15-15)packages/bruno-app/src/providers/ReduxStore/slices/collections/actions.js (2)
importCollection(2384-2408)importCollection(2384-2408)
⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (6)
- GitHub Check: SSL Tests - Windows
- GitHub Check: SSL Tests - Linux
- GitHub Check: SSL Tests - macOS
- GitHub Check: Playwright E2E Tests
- GitHub Check: Unit Tests
- GitHub Check: CLI Tests
🔇 Additional comments (4)
packages/bruno-electron/src/ipc/collection.js (1)
869-869: LGTM!The usage correctly combines the new helper with
sanitizeName, following the same pattern asbruno-cli/src/utils/collection.js:537.packages/bruno-app/src/components/Sidebar/Sections/CollectionsSection/index.js (1)
61-62: LGTM!The signature extension is backwards compatible and correctly propagates the options object to the Redux action. The pattern aligns with the existing
WorkspaceOverview/index.jsimplementation.packages/bruno-app/src/components/Sidebar/ImportCollectionLocation/index.js (1)
95-95: LGTM!The state management for
collectionFormatis correctly wired to the submit handler via the options object. The default value of 'bru' ensures backwards compatibility.Also applies to: 123-123
packages/bruno-app/src/providers/ReduxStore/slices/collections/actions.js (1)
2392-2392: LGTM!The IPC call correctly passes the format as a third argument with a sensible default of 'bru'. The change aligns with the Electron IPC handler signature and maintains backwards compatibility.
Description
Contribution Checklist:
Note: Keeping the PR small and focused helps make it easier to review and merge. If you have multiple changes you want to make, please consider submitting them as separate pull requests.
Publishing to New Package Managers
Please see here for more information.
Summary by CodeRabbit
Release Notes
✏️ Tip: You can customize this high-level summary in your review settings.