Skip to content

add: filetype for import collection#6533

Merged
bijin-bruno merged 1 commit intousebruno:mainfrom
naman-bruno:add/import-filetype
Dec 29, 2025
Merged

add: filetype for import collection#6533
bijin-bruno merged 1 commit intousebruno:mainfrom
naman-bruno:add/import-filetype

Conversation

@naman-bruno
Copy link
Collaborator

@naman-bruno naman-bruno commented Dec 29, 2025

Description

Contribution Checklist:

  • I've used AI significantly to create this pull request
  • The pull request only addresses one issue or adds one feature.
  • The pull request does not introduce any breaking changes
  • I have added screenshots or gifs to help explain the change if applicable.
  • I have read the contribution guidelines.
  • Create an issue and link to the pull request.

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

  • New Features
    • Added file format selection when importing collections—choose between BRU and OpenCollection YAML formats
    • Import operations now display success and error notifications

✏️ Tip: You can customize this high-level summary in your review settings.

@coderabbitai
Copy link
Contributor

coderabbitai bot commented Dec 29, 2025

Walkthrough

Introduces 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

Cohort / File(s) Summary
Import UI Components
packages/bruno-app/src/components/Sidebar/ImportCollectionLocation/index.js, packages/bruno-app/src/components/Sidebar/Sections/CollectionsSection/index.js
Added collectionFormat state (defaults to 'bru') with select control for format selection in ImportCollectionLocation. Extended CollectionsSection's handleImportCollectionLocation to accept optional options parameter and added promise handling with success/error toast notifications.
Redux Action Layer
packages/bruno-app/src/providers/ReduxStore/slices/collections/actions.js
Updated importCollection to pass format option via fourth IPC parameter, with 'bru' as fallback default.
Electron IPC Handler
packages/bruno-electron/src/ipc/collection.js
Introduced getFilenameWithFormat() helper that derives filenames based on selected format, replacing extension from .bru/.yml to target format or appending format extension to names without existing extension.

Sequence Diagram

sequenceDiagram
    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
Loading

Estimated code review effort

🎯 3 (Moderate) | ⏱️ ~25 minutes

Possibly related PRs

  • fix: import modal logic #6409: Modifies ImportCollectionLocation and CollectionsSection's handleImportCollectionLocation handler with related UI and form submission logic.
  • init: workspaces #6264: Updates importCollection signatures and IPC collection handlers to accept options/context, sharing the same architectural pattern for passing options through the import pipeline.

Suggested reviewers

  • helloanoop
  • lohit-bruno
  • bijin-bruno

Poem

🎨 A format choice blooms in the import flow,
From UI to IPC, the options now grow,
BRU or YAML—pick your style with care,
Filenames transform with format to spare! ✨

Pre-merge checks and finishing touches

✅ Passed checks (3 passed)
Check name Status Explanation
Description Check ✅ Passed Check skipped - CodeRabbit’s high-level summary is enabled.
Title check ✅ Passed The title 'add: filetype for import collection' directly describes the main change: adding file type selection capability to the import collection feature.
Docstring Coverage ✅ Passed No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.
✨ Finishing touches
  • 📝 Generate docstrings
🧪 Generate unit tests (beta)
  • Create PR with unit tests
  • Post copyable unit tests in a comment

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.

❤️ Share

Comment @coderabbitai help to get the list of available commands and usage tips.

Copy link
Contributor

@coderabbitai coderabbitai bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Actionable comments posted: 0

🧹 Nitpick comments (2)
packages/bruno-electron/src/ipc/collection.js (1)

854-863: Consider extracting getFilenameWithFormat to module scope for reuse.

The helper is currently scoped to the importCollection handler. Similar logic exists in the clone-folder handler (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-folder handler 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:

  1. 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.

  2. 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

📥 Commits

Reviewing files that changed from the base of the PR and between c714e9b and e9a72b4.

📒 Files selected for processing (4)
  • packages/bruno-app/src/components/Sidebar/ImportCollectionLocation/index.js
  • packages/bruno-app/src/components/Sidebar/Sections/CollectionsSection/index.js
  • packages/bruno-app/src/providers/ReduxStore/slices/collections/actions.js
  • packages/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() not func ()
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.js
  • packages/bruno-app/src/components/Sidebar/ImportCollectionLocation/index.js
  • packages/bruno-electron/src/ipc/collection.js
  • packages/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.js
  • packages/bruno-app/src/components/Sidebar/ImportCollectionLocation/index.js
  • packages/bruno-electron/src/ipc/collection.js
  • packages/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 as bruno-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.js implementation.

packages/bruno-app/src/components/Sidebar/ImportCollectionLocation/index.js (1)

95-95: LGTM!

The state management for collectionFormat is 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.

@bijin-bruno bijin-bruno merged commit 646f63d into usebruno:main Dec 29, 2025
8 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants