fix: added input block to the cli workflow

fix: multipart tests

.github/workflows/npm-bru-cli.yml

@@ -20,7 +20,10 @@ permissions:
 jobs:
   test:
     name: CLI Tests
-    runs-on: ubuntu-latest
+    strategy:
+      matrix:
+        os: [ubuntu-latest, macos-latest]
+    runs-on: ${{ matrix.os }}
     steps:
       - uses: actions/checkout@v4
       - uses: actions/setup-node@v3

.github/workflows/tests.yml

@@ -5,6 +5,9 @@ on:
   pull_request:
     branches: [main]
 
+permissions:
+  contents: read
+
 jobs:
   unit-test:
     name: Unit Tests

.nvmrc

@@ -1 +1 @@
-v20.9.0
+v22.11.0

package.json

@@ -30,6 +30,7 @@
     "ts-jest": "^29.0.5"
   },
   "scripts": {
+    "setup": "node ./scripts/setup.js",
     "dev": "concurrently --kill-others \"npm run dev:web\" \"npm run dev:electron\"",
     "dev:web": "npm run dev --workspace=packages/bruno-app",
     "build:web": "npm run build --workspace=packages/bruno-app",
@@ -51,6 +52,6 @@
     "prepare": "husky install"
   },
   "overrides": {
-    "rollup":"3.29.5"
+    "rollup": "3.29.5"
   }
 }

packages/bruno-app/.babelrc

@@ -1,4 +1,4 @@
 {
-  "presets": ["next/babel"],
+  "presets": ["@babel/preset-env"],
   "plugins": [["styled-components", { "ssr": true }]]
 }

packages/bruno-app/.gitignore

@@ -31,4 +31,6 @@ yarn-error.log*
 
 # next.js
 .next/
-out/
+dist/
+
+.env

packages/bruno-app/jest.config.js

@@ -0,0 +1,16 @@
+module.exports = {
+  rootDir: '.',
+  moduleNameMapper: {
+    '^assets/(.*)$': '<rootDir>/src/assets/$1',
+    '^components/(.*)$': '<rootDir>/src/components/$1',
+    '^hooks/(.*)$': '<rootDir>/src/hooks/$1',
+    '^themes/(.*)$': '<rootDir>/src/themes/$1',
+    '^api/(.*)$': '<rootDir>/src/api/$1',
+    '^pageComponents/(.*)$': '<rootDir>/src/pageComponents/$1',
+    '^providers/(.*)$': '<rootDir>/src/providers/$1',
+    '^utils/(.*)$': '<rootDir>/src/utils/$1'
+  },
+  clearMocks: true,
+  moduleDirectories: ['node_modules', 'src'],
+  testEnvironment: 'node'
+};

packages/bruno-app/next.config.js

@@ -1,22 +0,0 @@
-module.exports = {
-  output: 'export',
-  reactStrictMode: false,
-  publicRuntimeConfig: {
-    CI: process.env.CI,
-    PLAYWRIGHT: process.env.PLAYWRIGHT,
-    ENV: process.env.ENV
-  },
-  webpack: (config, { isServer }) => {
-    // Fixes npm packages that depend on `fs` module
-    if (!isServer) {
-      config.resolve.fallback.fs = false;
-    }
-    Object.defineProperty(config, 'devtool', {
-      get() {
-          return 'source-map';
-      },
-      set() {},
-    });
-    return config;
-  },
-};

packages/bruno-app/package.json

@@ -3,15 +3,15 @@
   "version": "0.3.0",
   "private": true,
   "scripts": {
-    "dev": "cross-env ENV=dev next dev -p 3000",
-    "build": "next build",
-    "start": "next start",
-    "lint": "next lint",
+    "dev": "rsbuild dev",
+    "build": "rsbuild build -m production",
+    "preview": "rsbuild preview",
     "test": "jest",
     "test:prettier": "prettier --check \"./src/**/*.{js,jsx,json,ts,tsx}\"",
     "prettier": "prettier --write \"./src/**/*.{js,jsx,json,ts,tsx}\""
   },
   "dependencies": {
+    "@babel/preset-env": "^7.26.0",
     "@fontsource/inter": "^5.0.15",
     "@prantlf/jsonlint": "^16.0.0",
     "@reduxjs/toolkit": "^1.8.0",
@@ -49,7 +49,6 @@
     "markdown-it-replace-link": "^1.2.0",
     "mousetrap": "^1.6.5",
     "nanoid": "3.3.4",
-    "next": "14.2.16",
     "path": "^0.12.7",
     "pdfjs-dist": "4.4.168",
     "platform": "^1.3.6",
@@ -57,16 +56,17 @@
     "prettier": "^2.7.1",
     "qs": "^6.11.0",
     "query-string": "^7.0.1",
-    "react": "18.2.0",
+    "react": "19.0.0",
     "react-copy-to-clipboard": "^5.1.0",
     "react-dnd": "^16.0.1",
     "react-dnd-html5-backend": "^16.0.1",
-    "react-dom": "18.2.0",
+    "react-dom": "19.0.0",
     "react-hot-toast": "^2.4.0",
     "react-i18next": "^15.0.1",
     "react-inspector": "^6.0.2",
     "react-pdf": "9.1.1",
-    "react-redux": "^7.2.6",
+    "react-player": "^2.16.0",
+    "react-redux": "^7.2.9",
     "react-tooltip": "^5.5.2",
     "sass": "^1.46.0",
     "strip-json-comments": "^5.0.1",
@@ -78,13 +78,14 @@
     "yup": "^0.32.11"
   },
   "devDependencies": {
-    "@babel/core": "^7.16.0",
-    "@babel/plugin-transform-spread": "^7.16.7",
-    "@babel/preset-env": "^7.16.4",
-    "@babel/preset-react": "^7.16.0",
-    "@babel/runtime": "^7.16.3",
+    "@rsbuild/core": "^1.1.2",
+    "@rsbuild/plugin-babel": "^1.0.3",
+    "@rsbuild/plugin-node-polyfill": "^1.2.0",
+    "@rsbuild/plugin-react": "^1.0.7",
+    "@rsbuild/plugin-sass": "^1.1.0",
+    "@rsbuild/plugin-styled-components": "1.1.0",
     "autoprefixer": "10.4.20",
-    "babel-loader": "^8.2.3",
+    "babel-plugin-react-compiler": "19.0.0-beta-a7bf2bd-20241110",
     "cross-env": "^7.0.3",
     "css-loader": "7.1.2",
     "file-loader": "^6.2.0",

packages/bruno-app/rsbuild.config.mjs

@@ -0,0 +1,27 @@
+import { defineConfig } from '@rsbuild/core';
+import { pluginReact } from '@rsbuild/plugin-react';
+import { pluginBabel } from '@rsbuild/plugin-babel';
+import { pluginStyledComponents } from '@rsbuild/plugin-styled-components';
+import { pluginSass } from '@rsbuild/plugin-sass';
+import { pluginNodePolyfill } from '@rsbuild/plugin-node-polyfill'
+
+export default defineConfig({
+  plugins: [
+    pluginNodePolyfill(),
+    pluginReact(),
+    pluginStyledComponents(),
+    pluginSass(),
+    pluginBabel({
+      include: /\.(?:js|jsx|tsx)$/,
+      babelLoaderOptions(opts) {
+        opts.plugins?.unshift('babel-plugin-react-compiler');
+      }
+    })
+  ],
+  source: {
+    tsconfigPath: './jsconfig.json', // Specifies the path to the JavaScript/TypeScript configuration file
+  },
+  html: {
+    title: 'Bruno'
+  },
+});

packages/bruno-app/src/components/CodeEditor/StyledWrapper.js

@@ -26,6 +26,12 @@ const StyledWrapper = styled.div`
 
   .CodeMirror-dialog {
     overflow: visible;
+    input {
+      background: transparent;
+      border: 1px solid #d3d6db;
+      outline: none;
+      border-radius: 0px;
+    }
   }
 
   #search-results-count {
@@ -82,6 +88,14 @@ const StyledWrapper = styled.div`
   .CodeMirror-search-hint {
     display: inline;
   }
+
+  .cm-s-default span.cm-property {
+    color: #1f61a0 !important;
+  }
+
+  .cm-s-default span.cm-variable {
+    color: #397d13 !important;
+  }
 `;
 
 export default StyledWrapper;

packages/bruno-app/src/components/CodeEditor/index.js

@@ -15,7 +15,7 @@ import { JSHINT } from 'jshint';
 import stripJsonComments from 'strip-json-comments';
 
 let CodeMirror;
-const SERVER_RENDERED = typeof navigator === 'undefined' || global['PREVENT_CODEMIRROR_RENDER'] === true;
+const SERVER_RENDERED = typeof window === 'undefined' || global['PREVENT_CODEMIRROR_RENDER'] === true;
 const TAB_SIZE = 2;
 
 if (!SERVER_RENDERED) {
@@ -58,13 +58,14 @@ if (!SERVER_RENDERED) {
     'req.getExecutionMode()',
     'bru',
     'bru.cwd()',
-    'bru.getEnvName(key)',
+    'bru.getEnvName()',
     'bru.getProcessEnv(key)',
     'bru.hasEnvVar(key)',
     'bru.getEnvVar(key)',
     'bru.getFolderVar(key)',
     'bru.getCollectionVar(key)',
     'bru.setEnvVar(key,value)',
+    'bru.deleteEnvVar(key)',
     'bru.hasVar(key)',
     'bru.getVar(key)',
     'bru.setVar(key,value)',
@@ -189,32 +190,8 @@ export default class CodeEditor extends React.Component {
         'Cmd-Y': 'foldAll',
         'Ctrl-I': 'unfoldAll',
         'Cmd-I': 'unfoldAll',
-        'Cmd-/': (cm) => {
-          // comment/uncomment every selected line(s)
-          const selections = cm.listSelections();
-          selections.forEach((range) => {
-            for (let i = range.from().line; i <= range.to().line; i++) {
-              const selectedLine = cm.getLine(i);
-              // if commented line, remove comment
-              if (selectedLine.trim().startsWith('//')) {
-                cm.replaceRange(
-                  selectedLine.replace(/^(\s*)\/\/\s?/, '$1'),
-                  { line: i, ch: 0 },
-                  { line: i, ch: selectedLine.length }
-                );
-                continue;
-              }
-              // otherwise add comment
-              cm.replaceRange(
-                selectedLine.search(/\S|$/) >= TAB_SIZE
-                  ? ' '.repeat(TAB_SIZE) + '// ' + selectedLine.trim()
-                  : '// ' + selectedLine,
-                { line: i, ch: 0 },
-                { line: i, ch: selectedLine.length }
-              );
-            }
-          });
-        }
+        'Ctrl-/': 'toggleComment',
+        'Cmd-/': 'toggleComment'
       },
       foldOptions: {
         widget: (from, to) => {
@@ -281,9 +258,9 @@ export default class CodeEditor extends React.Component {
         while (end < currentLine.length && /[^{}();\s\[\]\,]/.test(currentLine.charAt(end))) ++end;
         while (start && /[^{}();\s\[\]\,]/.test(currentLine.charAt(start - 1))) --start;
         let curWord = start != end && currentLine.slice(start, end);
-        //Qualify if autocomplete will be shown
+        // Qualify if autocomplete will be shown
         if (
-          /^(?!Shift|Tab|Enter|Escape|ArrowUp|ArrowDown|ArrowLeft|ArrowRight|\s)\w*/.test(event.key) &&
+          /^(?!Shift|Tab|Enter|Escape|ArrowUp|ArrowDown|ArrowLeft|ArrowRight|Meta|Alt|Home|End\s)\w*/.test(event.key) &&
           curWord.length > 0 &&
           !/\/\/|\/\*|.*{{|`[^$]*{|`[^{]*$/.test(currentLine.slice(0, end)) &&
           /(?<!\d)[a-zA-Z\._]$/.test(curWord)

packages/bruno-app/src/components/Environments/EnvironmentSettings/CreateEnvironment/index.js

@@ -10,6 +10,11 @@ import Modal from 'components/Modal';
 const CreateEnvironment = ({ collection, onClose }) => {
   const dispatch = useDispatch();
   const inputRef = useRef();
+
+ const validateEnvironmentName = (name) => {
+   return !collection?.environments?.some((env) => env?.name?.toLowerCase().trim() === name?.toLowerCase().trim());
+ };
+
   const formik = useFormik({
     enableReinitialize: true,
     initialValues: {
@@ -17,9 +22,10 @@ const CreateEnvironment = ({ collection, onClose }) => {
     },
     validationSchema: Yup.object({
       name: Yup.string()
-        .min(1, 'must be at least 1 character')
-        .max(50, 'must be 50 characters or less')
-        .required('name is required')
+        .min(1, 'Must be at least 1 character')
+        .max(50, 'Must be 50 characters or less')
+        .required('Name is required')
+        .test('duplicate-name', 'Environment already exists', validateEnvironmentName)
     }),
     onSubmit: (values) => {
       dispatch(addEnvironment(values.name, collection.uid))

packages/bruno-app/src/components/FolderSettings/Documentation/StyledWrapper.js

@@ -0,0 +1,10 @@
+import styled from 'styled-components';
+
+const StyledWrapper = styled.div`
+  .editing-mode {
+    cursor: pointer;
+    color: ${(props) => props.theme.colors.text.yellow};
+  }
+`;
+
+export default StyledWrapper;

packages/bruno-app/src/components/FolderSettings/Documentation/index.js

@@ -0,0 +1,63 @@
+import 'github-markdown-css/github-markdown.css';
+import get from 'lodash/get';
+import { updateFolderDocs } from 'providers/ReduxStore/slices/collections';
+import { useTheme } from 'providers/Theme';
+import { useState } from 'react';
+import { useDispatch, useSelector } from 'react-redux';
+import { saveFolderRoot } from 'providers/ReduxStore/slices/collections/actions';
+import Markdown from 'components/MarkDown';
+import CodeEditor from 'components/CodeEditor';
+import StyledWrapper from './StyledWrapper';
+
+const Documentation = ({ collection, folder }) => {
+  const dispatch = useDispatch();
+  const { displayedTheme } = useTheme();
+  const preferences = useSelector((state) => state.app.preferences);
+  const [isEditing, setIsEditing] = useState(false);
+  const docs = get(folder, 'root.docs', '');
+
+  const toggleViewMode = () => {
+    setIsEditing((prev) => !prev);
+  };
+
+  const onEdit = (value) => {
+    dispatch(
+      updateFolderDocs({
+        folderUid: folder.uid,
+        collectionUid: collection.uid,
+        docs: value
+      })
+    );
+  };
+
+  const onSave = () => dispatch(saveFolderRoot(collection.uid, folder.uid));
+
+  if (!folder) {
+    return null;
+  }
+
+  return (
+    <StyledWrapper className="flex flex-col gap-y-1 h-full w-full relative">
+      <div className="editing-mode" role="tab" onClick={toggleViewMode}>
+        {isEditing ? 'Preview' : 'Edit'}
+      </div>
+
+      {isEditing ? (
+        <CodeEditor
+          collection={collection}
+          theme={displayedTheme}
+          font={get(preferences, 'font.codeFont', 'default')}
+          fontSize={get(preferences, 'font.codeFontSize')}
+          value={docs || ''}
+          onEdit={onEdit}
+          onSave={onSave}
+          mode="application/text"
+        />
+      ) : (
+        <Markdown collectionPath={collection.pathname} onDoubleClick={toggleViewMode} content={docs} />
+      )}
+    </StyledWrapper>
+  );
+};
+
+export default Documentation;

packages/bruno-app/src/components/FolderSettings/index.js

@@ -7,6 +7,7 @@ import Script from './Script';
 import Tests from './Tests';
 import StyledWrapper from './StyledWrapper';
 import Vars from './Vars';
+import Documentation from './Documentation';
 import DotIcon from 'components/Icons/Dot';
 
 const ContentIndicator = () => {
@@ -60,6 +61,9 @@ const FolderSettings = ({ collection, folder }) => {
       case 'vars': {
         return <Vars collection={collection} folder={folder} />;
       }
+      case 'docs': {
+        return <Documentation collection={collection} folder={folder} />;
+      }
     }
   };
 
@@ -89,6 +93,9 @@ const FolderSettings = ({ collection, folder }) => {
             Vars
             {activeVarsCount > 0 && <sup className="ml-1 font-medium">{activeVarsCount}</sup>}
           </div>
+          <div className={getTabClassname('docs')} role="tab" onClick={() => setTab('docs')}>
+            Docs
+          </div>
         </div>
         <section className={`flex mt-4 h-full`}>{getTabPanel(tab)}</section>
       </div>

packages/bruno-app/src/components/GlobalEnvironments/EnvironmentSettings/CreateEnvironment/index.js

@@ -2,12 +2,19 @@ import React, { useEffect, useRef } from 'react';
 import toast from 'react-hot-toast';
 import { useFormik } from 'formik';
 import * as Yup from 'yup';
-import { useDispatch } from 'react-redux';
+import { useDispatch, useSelector } from 'react-redux';
 import Portal from 'components/Portal';
 import Modal from 'components/Modal';
 import { addGlobalEnvironment } from 'providers/ReduxStore/slices/global-environments';
 
 const CreateEnvironment = ({ onClose }) => {
+  const globalEnvs = useSelector((state) => state?.globalEnvironments?.globalEnvironments);
+
+  const validateEnvironmentName = (name) => {
+    const trimmedName = name?.toLowerCase().trim();
+    return globalEnvs.every((env) => env?.name?.toLowerCase().trim() !== trimmedName);
+  };
+
   const dispatch = useDispatch();
   const inputRef = useRef();
   const formik = useFormik({
@@ -17,9 +24,10 @@ const CreateEnvironment = ({ onClose }) => {
     },
     validationSchema: Yup.object({
       name: Yup.string()
-        .min(1, 'must be at least 1 character')
-        .max(50, 'must be 50 characters or less')
-        .required('name is required')
+        .min(1, 'Must be at least 1 character')
+        .max(50, 'Must be 50 characters or less')
+        .required('Name is required')
+        .test('duplicate-name', 'Global Environment already exists', validateEnvironmentName)
     }),
     onSubmit: (values) => {
       dispatch(addGlobalEnvironment({ name: values.name }))

packages/bruno-app/src/components/MultiLineEditor/StyledWrapper.js

@@ -13,6 +13,12 @@ const StyledWrapper = styled.div`
     line-height: 30px;
     overflow: hidden;
 
+    pre.CodeMirror-placeholder {
+      color: ${(props) => props.theme.text};
+      padding-left: 0;
+      opacity: 0.5;
+    }
+
     .CodeMirror-scroll {
       overflow: hidden !important;
       ${'' /* padding-bottom: 50px !important; */}

packages/bruno-app/src/components/MultiLineEditor/index.js

@@ -5,7 +5,7 @@ import { defineCodeMirrorBrunoVariablesMode } from 'utils/common/codemirror';
 import StyledWrapper from './StyledWrapper';
 
 let CodeMirror;
-const SERVER_RENDERED = typeof navigator === 'undefined' || global['PREVENT_CODEMIRROR_RENDER'] === true;
+const SERVER_RENDERED = typeof window === 'undefined' || global['PREVENT_CODEMIRROR_RENDER'] === true;
 
 if (!SERVER_RENDERED) {
   CodeMirror = require('codemirror');
@@ -30,6 +30,7 @@ class MultiLineEditor extends Component {
       lineWrapping: false,
       lineNumbers: false,
       theme: this.props.theme === 'dark' ? 'monokai' : 'default',
+      placeholder: this.props.placeholder,
       mode: 'brunovariables',
       brunoVarInfo: {
         variables

packages/bruno-app/src/components/Portal/index.js

@@ -1,8 +1,6 @@
 import { createPortal } from 'react-dom';
 
-function Portal({ children, wrapperId }) {
-  wrapperId = wrapperId || 'bruno-app-body';
-
-  return createPortal(children, document.getElementById(wrapperId));
+function Portal({ children }) {
+  return createPortal(children, document.body);
 }
 export default Portal;

packages/bruno-app/src/components/RequestPane/Assertions/AssertionOperator/index.js

@@ -20,6 +20,7 @@ import React from 'react';
  * endsWith    : ends with
  * between     : between
  * isEmpty     : is empty
+ * isNotEmpty  : is not empty
  * isNull      : is null
  * isUndefined : is undefined
  * isDefined   : is defined
@@ -51,6 +52,7 @@ const AssertionOperator = ({ operator, onChange }) => {
     'endsWith',
     'between',
     'isEmpty',
+    'isNotEmpty',
     'isNull',
     'isUndefined',
     'isDefined',

packages/bruno-app/src/components/RequestPane/Assertions/AssertionRow/index.js

@@ -24,6 +24,7 @@ import { useTheme } from 'providers/Theme';
  * endsWith    : ends with
  * between     : between
  * isEmpty     : is empty
+ * isNotEmpty  : is not empty
  * isNull      : is null
  * isUndefined : is undefined
  * isDefined   : is defined
@@ -61,6 +62,7 @@ const parseAssertionOperator = (str = '') => {
     'endsWith',
     'between',
     'isEmpty',
+    'isNotEmpty',
     'isNull',
     'isUndefined',
     'isDefined',
@@ -75,6 +77,7 @@ const parseAssertionOperator = (str = '') => {
 
   const unaryOperators = [
     'isEmpty',
+    'isNotEmpty',
     'isNull',
     'isUndefined',
     'isDefined',
@@ -113,6 +116,7 @@ const parseAssertionOperator = (str = '') => {
 const isUnaryOperator = (operator) => {
   const unaryOperators = [
     'isEmpty',
+    'isNotEmpty',
     'isNull',
     'isUndefined',
     'isDefined',

packages/bruno-app/src/components/RequestPane/Assertions/StyledWrapper.js

@@ -20,8 +20,8 @@ const Wrapper = styled.div`
     td {
       padding: 6px 10px;
 
-      &:nth-child(1) {
-        width: 30%;
+      &:nth-child(2) {
+        width: 130px;
       }
 
       &:nth-child(4) {

packages/bruno-app/src/components/RequestPane/MultipartFormParams/StyledWrapper.js

@@ -24,7 +24,15 @@ const Wrapper = styled.div`
         width: 30%;
       }
 
+      &:nth-child(2) {
+        width: 45%;
+      }
+
       &:nth-child(3) {
+        width: 25%;
+      }
+
+      &:nth-child(4) {
         width: 70px;
       }
     }

packages/bruno-app/src/components/RequestPane/MultipartFormParams/index.js

@@ -54,6 +54,10 @@ const MultipartFormParams = ({ item, collection }) => {
         param.value = e.target.value;
         break;
       }
+      case 'contentType': {
+        param.contentType = e.target.value;
+        break;
+      }
       case 'enabled': {
         param.enabled = e.target.checked;
         break;
@@ -85,6 +89,7 @@ const MultipartFormParams = ({ item, collection }) => {
           <tr>
             <td>Key</td>
             <td>Value</td>
+            <td>Content-Type</td>
             <td></td>
           </tr>
         </thead>
@@ -145,6 +150,27 @@ const MultipartFormParams = ({ item, collection }) => {
                         />
                       )}
                     </td>
+                    <td>
+                      <MultiLineEditor
+                        onSave={onSave}
+                        theme={storedTheme}
+                        placeholder="Auto"
+                        value={param.contentType}
+                        onChange={(newValue) =>
+                          handleParamChange(
+                            {
+                              target: {
+                                value: newValue
+                              }
+                            },
+                            param,
+                            'contentType'
+                          )
+                        }
+                        onRun={handleRun}
+                        collection={collection}
+                      />
+                    </td>
                     <td>
                       <div className="flex items-center">
                         <input

packages/bruno-app/src/components/RequestPane/QueryEditor/StyledWrapper.js

@@ -54,6 +54,14 @@ const StyledWrapper = styled.div`
   .CodeMirror-search-hint {
     display: inline;
   }
+
+  .cm-s-default span.cm-property {
+    color: #1f61a0 !important;
+  }
+
+  .cm-s-default span.cm-variable {
+    color: #397d13 !important;
+  }
 `;
 
 export default StyledWrapper;

packages/bruno-app/src/components/RequestPane/QueryEditor/index.js

@@ -19,7 +19,7 @@ import { IconWand } from '@tabler/icons';
 import onHasCompletion from './onHasCompletion';
 
 let CodeMirror;
-const SERVER_RENDERED = typeof navigator === 'undefined' || global['PREVENT_CODEMIRROR_RENDER'] === true;
+const SERVER_RENDERED = typeof window === 'undefined' || global['PREVENT_CODEMIRROR_RENDER'] === true;
 
 if (!SERVER_RENDERED) {
   CodeMirror = require('codemirror');

packages/bruno-app/src/components/RequestPane/QueryUrl/index.js

@@ -70,7 +70,7 @@ const QueryUrl = ({ item, collection, handleRun }) => {
 
   const handleGenerateCode = (e) => {
     e.stopPropagation();
-    if (item.request.url !== '' || (item.draft?.request.url !== undefined && item.draft?.request.url !== '')) {
+    if (item?.request?.url !== '' || (item.draft?.request?.url !== undefined && item.draft?.request?.url !== '')) {
       setGenerateCodeItemModalOpen(true);
     } else {
       toast.error('URL is required');

packages/bruno-app/src/components/RequestTabPanel/StyledWrapper.js

@@ -10,6 +10,7 @@ const StyledWrapper = styled.div`
     align-items: center;
     justify-content: center;
     width: 10px;
+    min-width: 10px;
     padding: 0;
     cursor: col-resize;
     background: transparent;

packages/bruno-app/src/components/RequestTabPanel/index.js

@@ -20,7 +20,7 @@ import { DocExplorer } from '@usebruno/graphql-docs';
 import StyledWrapper from './StyledWrapper';
 import SecuritySettings from 'components/SecuritySettings';
 import FolderSettings from 'components/FolderSettings';
-import { getGlobalEnvironmentVariables } from 'utils/collections/index';
+import { getGlobalEnvironmentVariables, getGlobalEnvironmentVariablesMasked } from 'utils/collections/index';
 import { produce } from 'immer';
 
 const MIN_LEFT_PANE_WIDTH = 300;
@@ -45,7 +45,9 @@ const RequestTabPanel = () => {
     if (collection) {
       // add selected global env variables to the collection object
       const globalEnvironmentVariables = getGlobalEnvironmentVariables({ globalEnvironments, activeGlobalEnvironmentUid });
+      const globalEnvSecrets = getGlobalEnvironmentVariablesMasked({ globalEnvironments, activeGlobalEnvironmentUid });
       collection.globalEnvironmentVariables = globalEnvironmentVariables;
+      collection.globalEnvSecrets = globalEnvSecrets;
     }
   });
 

packages/bruno-app/src/components/ResponsePane/QueryResult/QueryResultPreview/index.js

@@ -1,14 +1,41 @@
+import React, { useState, useEffect } from 'react';
 import CodeEditor from 'components/CodeEditor/index';
 import { get } from 'lodash';
 import { useDispatch, useSelector } from 'react-redux';
 import { sendRequest } from 'providers/ReduxStore/slices/collections/actions';
 import { Document, Page } from 'react-pdf';
-import { useState } from 'react';
 import 'pdfjs-dist/build/pdf.worker';
 import 'react-pdf/dist/esm/Page/AnnotationLayer.css';
 import 'react-pdf/dist/esm/Page/TextLayer.css';
 import { GlobalWorkerOptions } from 'pdfjs-dist/build/pdf';
 GlobalWorkerOptions.workerSrc = 'pdfjs-dist/legacy/build/pdf.worker.min.mjs';
+import ReactPlayer from 'react-player';
+
+const VideoPreview = React.memo(({ contentType, dataBuffer }) => {
+  const [videoUrl, setVideoUrl] = useState(null);
+
+  useEffect(() => {
+    const videoType = contentType.split(';')[0];
+    const byteArray = Buffer.from(dataBuffer, 'base64');
+    const blob = new Blob([byteArray], { type: videoType });
+    const url = URL.createObjectURL(blob);
+    setVideoUrl(url);
+    return () => URL.revokeObjectURL(url);
+  }, [contentType, dataBuffer]);
+
+  if (!videoUrl) return <div>Loading video...</div>;
+
+  return (
+    <ReactPlayer
+      url={videoUrl}
+      controls
+      muted={true}
+      width="100%"
+      height="100%"
+      onError={(e) => console.error('Error loading video:', e)}
+    />
+  );
+});
 
 const QueryResultPreview = ({
   previewTab,
@@ -73,9 +100,7 @@ const QueryResultPreview = ({
       );
     }
     case 'preview-video': {
-      return (
-        <video controls src={`data:${contentType.replace(/\;(.*)/, '')};base64,${dataBuffer}`} className="mx-auto" />
-      );
+      return <VideoPreview contentType={contentType} dataBuffer={dataBuffer} />;
     }
     default:
     case 'raw': {

packages/bruno-app/src/components/ResponsePane/QueryResult/index.js

@@ -20,14 +20,14 @@ const formatResponse = (data, mode, filter) => {
   }
 
   if (data === null) {
-    return data;
+    return 'null';
   }
 
   if (mode.includes('json')) {
     let isValidJSON = false;
 
     try {
-      isValidJSON = typeof JSON.parse(JSON.stringify(data)) === 'object';
+      isValidJSON = typeof JSON.parse(JSON.stringify(data)) === 'object'
     } catch (error) {
       console.log('Error parsing JSON: ', error.message);
     }

packages/bruno-app/src/components/Sidebar/Collections/Collection/CollectionItem/DeleteCollectionItem/index.js

@@ -12,10 +12,15 @@ const DeleteCollectionItem = ({ onClose, item, collection }) => {
   const isFolder = isItemAFolder(item);
   const onConfirm = () => {
     dispatch(deleteItem(item.uid, collection.uid)).then(() => {
+
       if (isFolder) {
+        // close all tabs that belong to the folder
+        // including the folder itself and its children
+        const tabUids = [...recursivelyGetAllItemUids(item.items), item.uid]
+
         dispatch(
           closeTabs({
-            tabUids: recursivelyGetAllItemUids(item.items)
+            tabUids: tabUids
           })
         );
       } else {

packages/bruno-app/src/components/Sidebar/Collections/Collection/CollectionItem/RenameCollectionItem/index.js

@@ -6,6 +6,7 @@ import { useDispatch } from 'react-redux';
 import { isItemAFolder } from 'utils/tabs';
 import { renameItem, saveRequest } from 'providers/ReduxStore/slices/collections/actions';
 import toast from 'react-hot-toast';
+import { closeTabs } from 'providers/ReduxStore/slices/tabs';
 
 const RenameCollectionItem = ({ collection, item, onClose }) => {
   const dispatch = useDispatch();
@@ -33,7 +34,8 @@ const RenameCollectionItem = ({ collection, item, onClose }) => {
       }
       dispatch(renameItem(values.name, item.uid, collection.uid))
         .then(() => {
-          toast.success('Request renamed');
+          isFolder && dispatch(closeTabs({ tabUids: [item.uid] }));
+          toast.success(isFolder ? 'Folder renamed' : 'Request renamed');
           onClose();
         })
         .catch((err) => {

packages/bruno-app/src/components/Sidebar/Collections/Collection/CollectionItem/index.js

@@ -183,7 +183,7 @@ const CollectionItem = ({ item, collection, searchText }) => {
   const handleGenerateCode = (e) => {
     e.stopPropagation();
     dropdownTippyRef.current.hide();
-    if (item.request.url !== '' || (item.draft?.request.url !== undefined && item.draft?.request.url !== '')) {
+    if (item?.request?.url !== '' || (item?.draft?.request?.url !== undefined && item?.draft?.request?.url !== '')) {
       setGenerateCodeItemModalOpen(true);
     } else {
       toast.error('URL is required');

packages/bruno-app/src/components/Sidebar/Collections/Collection/RenameCollection/index.js

@@ -17,7 +17,6 @@ const RenameCollection = ({ collection, onClose }) => {
     validationSchema: Yup.object({
       name: Yup.string()
         .min(1, 'must be at least 1 character')
-        .max(50, 'must be 50 characters or less')
         .required('name is required')
     }),
     onSubmit: (values) => {

packages/bruno-app/src/components/Sidebar/GoldenEdition/index.js

@@ -8,7 +8,7 @@ import StyledWrapper from './StyledWrapper';
 import { useTheme } from 'providers/Theme/index';
 
 let posthogClient = null;
-const posthogApiKey = 'phc_7gtqSrrdZRohiozPMLIacjzgHbUlhalW1Bu16uYijMR';
+const posthogApiKey = process.env.NEXT_PUBLIC_POSTHOG_API_KEY;
 const getPosthogClient = () => {
   if (posthogClient) {
     return posthogClient;

packages/bruno-app/src/components/Sidebar/NewRequest/StyledWrapper.js

@@ -39,6 +39,14 @@ const StyledWrapper = styled.div`
   textarea.curl-command {
     min-height: 150px;
   }
+
+  .dropdown {
+    width: fit-content;
+  
+   .dropdown-item {
+    padding: 0.2rem 0.6rem !important;
+    }
+  }
 `;
 
 export default StyledWrapper;

packages/bruno-app/src/components/Sidebar/NewRequest/index.js

@@ -1,4 +1,4 @@
-import React, { useRef, useEffect, useCallback } from 'react';
+import React, { useRef, useEffect, useCallback, forwardRef, useState } from 'react';
 import { useFormik } from 'formik';
 import * as Yup from 'yup';
 import toast from 'react-hot-toast';
@@ -12,6 +12,8 @@ import HttpMethodSelector from 'components/RequestPane/QueryUrl/HttpMethodSelect
 import { getDefaultRequestPaneTab } from 'utils/collections';
 import StyledWrapper from './StyledWrapper';
 import { getRequestFromCurlCommand } from 'utils/curl';
+import Dropdown from 'components/Dropdown';
+import { IconCaretDown } from '@tabler/icons';
 
 const NewRequest = ({ collection, item, isEphemeral, onClose }) => {
   const dispatch = useDispatch();
@@ -19,6 +21,39 @@ const NewRequest = ({ collection, item, isEphemeral, onClose }) => {
   const {
     brunoConfig: { presets: collectionPresets = {} }
   } = collection;
+  const [curlRequestTypeDetected, setCurlRequestTypeDetected] = useState(null);
+
+  const dropdownTippyRef = useRef();
+  const onDropdownCreate = (ref) => (dropdownTippyRef.current = ref);
+
+  const Icon = forwardRef((props, ref) => {
+    return (
+      <div ref={ref} className="flex items-center justify-end auth-type-label select-none">
+        {curlRequestTypeDetected === 'http-request' ? "HTTP" : "GraphQL"}
+        <IconCaretDown className="caret ml-1 mr-1" size={14} strokeWidth={2} />
+      </div>
+    );
+  });
+
+  // This function analyzes a given cURL command string and determines whether the request is a GraphQL or HTTP request.
+  const identifyCurlRequestType = (url, headers, body) => {
+    if (url.endsWith('/graphql')) {
+      setCurlRequestTypeDetected('graphql-request');
+      return;
+    }
+
+    const contentType = headers?.find((h) => h.name.toLowerCase() === 'content-type')?.value;
+    if (contentType && contentType.includes('application/graphql')) {
+      setCurlRequestTypeDetected('graphql-request');
+      return;
+    }
+
+    setCurlRequestTypeDetected('http-request');
+  };
+
+  const curlRequestTypeChange = (type) => {
+    setCurlRequestTypeDetected(type);
+  };
 
   const getRequestType = (collectionPresets) => {
     if (!collectionPresets || !collectionPresets.requestType) {
@@ -99,11 +134,11 @@ const NewRequest = ({ collection, item, isEphemeral, onClose }) => {
           })
           .catch((err) => toast.error(err ? err.message : 'An error occurred while adding the request'));
       } else if (values.requestType === 'from-curl') {
-        const request = getRequestFromCurlCommand(values.curlCommand);
+        const request = getRequestFromCurlCommand(values.curlCommand, curlRequestTypeDetected);
         dispatch(
           newHttpRequest({
             requestName: values.requestName,
-            requestType: 'http-request',
+            requestType: curlRequestTypeDetected,
             requestUrl: request.url,
             requestMethod: request.method,
             collectionUid: collection.uid,
@@ -158,6 +193,12 @@ const NewRequest = ({ collection, item, isEphemeral, onClose }) => {
         formik.setFieldValue('requestType', 'from-curl');
         formik.setFieldValue('curlCommand', pastedData);
 
+        // Identify the request type
+        const request = getRequestFromCurlCommand(pastedData);
+        if (request) {
+          identifyCurlRequestType(request.url, request.headers, request.body);
+        }
+
         // Prevent the default paste behavior to avoid pasting into the textarea
         event.preventDefault();
       }
@@ -165,6 +206,18 @@ const NewRequest = ({ collection, item, isEphemeral, onClose }) => {
     [formik]
   );
 
+  const handleCurlCommandChange = (event) => {
+    formik.handleChange(event);
+
+    if (event.target.name === 'curlCommand') {
+      const curlCommand = event.target.value;
+      const request = getRequestFromCurlCommand(curlCommand);
+      if (request) {
+        identifyCurlRequestType(request.url, request.headers, request.body);
+      }
+    }
+  };
+
   return (
     <StyledWrapper>
       <Modal size="md" title="New Request" confirmText="Create" handleConfirm={onSubmit} handleCancel={onClose}>
@@ -279,15 +332,37 @@ const NewRequest = ({ collection, item, isEphemeral, onClose }) => {
             </>
           ) : (
             <div className="mt-4">
-              <label htmlFor="request-url" className="block font-semibold">
-                cURL Command
-              </label>
+              <div className="flex justify-between">
+                <label htmlFor="request-url" className="block font-semibold">
+                  cURL Command
+                </label>
+                <Dropdown className="dropdown" onCreate={onDropdownCreate} icon={<Icon />} placement="bottom-end">
+                  <div
+                    className="dropdown-item"
+                    onClick={() => {
+                      dropdownTippyRef.current.hide();
+                      curlRequestTypeChange('http-request');
+                    }}
+                  >
+                    HTTP
+                  </div>
+                  <div
+                    className="dropdown-item"
+                    onClick={() => {
+                      dropdownTippyRef.current.hide();
+                      curlRequestTypeChange('graphql-request');
+                    }}
+                  >
+                    GraphQL
+                  </div>
+                </Dropdown>
+              </div>
               <textarea
                 name="curlCommand"
                 placeholder="Enter cURL request here.."
                 className="block textbox w-full mt-4 curl-command"
                 value={formik.values.curlCommand}
-                onChange={formik.handleChange}
+                onChange={handleCurlCommandChange}
               ></textarea>
               {formik.touched.curlCommand && formik.errors.curlCommand ? (
                 <div className="text-red-500">{formik.errors.curlCommand}</div>

packages/bruno-app/src/components/Sidebar/index.js

@@ -184,7 +184,7 @@ const Sidebar = () => {
                   Star
                 </GitHubButton> */}
               </div>
-              <div className="flex flex-grow items-center justify-end text-xs mr-2">v1.34.2</div>
+              <div className="flex flex-grow items-center justify-end text-xs mr-2">v1.36.0</div>
             </div>
           </div>
         </div>

packages/bruno-app/src/components/SingleLineEditor/index.js

@@ -6,7 +6,7 @@ import StyledWrapper from './StyledWrapper';
 import { IconEye, IconEyeOff } from '@tabler/icons';
 
 let CodeMirror;
-const SERVER_RENDERED = typeof navigator === 'undefined' || global['PREVENT_CODEMIRROR_RENDER'] === true;
+const SERVER_RENDERED = typeof window === 'undefined' || global['PREVENT_CODEMIRROR_RENDER'] === true;
 
 if (!SERVER_RENDERED) {
   CodeMirror = require('codemirror');

packages/bruno-app/src/components/Table/index.js

@@ -63,16 +63,16 @@ const Table = ({ minColumnWidth = 1, headers = [], children }) => {
     [activeColumnIndex, columns, minColumnWidth]
   );
 
-  const handleMouseUp = useCallback(() => {
-    setActiveColumnIndex(null);
-    removeListeners();
-  }, [removeListeners]);
-
   const removeListeners = useCallback(() => {
     window.removeEventListener('mousemove', handleMouseMove);
     window.removeEventListener('mouseup', removeListeners);
   }, [handleMouseMove]);
 
+  const handleMouseUp = useCallback(() => {
+    setActiveColumnIndex(null);
+    removeListeners?.();
+  }, [removeListeners]);
+
   useEffect(() => {
     if (activeColumnIndex !== null) {
       window.addEventListener('mousemove', handleMouseMove);

packages/bruno-app/src/globalStyles.js

@@ -233,7 +233,7 @@ const GlobalStyle = createGlobalStyle`
   }
 
   .CodeMirror-hint-active {
-    background: #89f !important;
+    background: #08f !important;
     color: #fff !important;
   }
 `;

packages/bruno-app/src/index.js

@@ -0,0 +1,14 @@
+import React from 'react';
+import ReactDOM from 'react-dom/client';
+import App from './pages/index';
+
+const rootElement = document.getElementById('root');
+
+if (rootElement) {
+  const root = ReactDOM.createRoot(rootElement);
+  root.render(
+    <React.StrictMode>
+      <App />
+    </React.StrictMode>
+  );
+}

packages/bruno-app/src/pages/Bruno/index.js

@@ -10,7 +10,7 @@ import 'codemirror/theme/material.css';
 import 'codemirror/theme/monokai.css';
 import 'codemirror/addon/scroll/simplescrollbars.css';
 
-const SERVER_RENDERED = typeof navigator === 'undefined' || global['PREVENT_CODEMIRROR_RENDER'] === true;
+const SERVER_RENDERED = typeof window === 'undefined' || global['PREVENT_CODEMIRROR_RENDER'] === true;
 if (!SERVER_RENDERED) {
   require('codemirror/mode/javascript/javascript');
   require('codemirror/mode/xml/xml');
@@ -31,6 +31,7 @@ if (!SERVER_RENDERED) {
   require('codemirror/addon/search/jump-to-line');
   require('codemirror/addon/search/search');
   require('codemirror/addon/search/searchcursor');
+  require('codemirror/addon/display/placeholder');
   require('codemirror/keymap/sublime');
 
   require('codemirror-graphql/hint');

packages/bruno-app/src/pages/Main.js

@@ -8,7 +8,6 @@ import ReduxStore from 'providers/ReduxStore';
 import ThemeProvider from 'providers/Theme/index';
 import ErrorBoundary from './ErrorBoundary';
 
-import '../styles/app.scss';
 import '../styles/globals.css';
 import 'codemirror/lib/codemirror.css';
 import 'graphiql/graphiql.min.css';
@@ -26,31 +25,7 @@ import '@fontsource/inter/900.css';
 import { setupPolyfills } from 'utils/common/setupPolyfills';
 setupPolyfills();
 
-function SafeHydrate({ children }) {
-  return <div suppressHydrationWarning>{typeof window === 'undefined' ? null : children}</div>;
-}
-
-function NoSsr({ children }) {
-  const SERVER_RENDERED = typeof navigator === 'undefined';
-
-  if (SERVER_RENDERED) {
-    return null;
-  }
-
-  return <>{children}</>;
-}
-
-function MyApp({ Component, pageProps }) {
-  const [domLoaded, setDomLoaded] = useState(false);
-
-  useEffect(() => {
-    setDomLoaded(true);
-  }, []);
-
-  if (!domLoaded) {
-    return null;
-  }
-
+function Main({ children }) {
   if (!window.ipcRenderer) {
     return (
       <div class="bg-red-100 border border-red-400 text-red-700 px-4 py-3 mx-10 my-10 rounded relative" role="alert">
@@ -66,23 +41,21 @@ function MyApp({ Component, pageProps }) {
 
   return (
     <ErrorBoundary>
-      <SafeHydrate>
-        <NoSsr>
-          <Provider store={ReduxStore}>
-            <ThemeProvider>
-              <ToastProvider>
-                <AppProvider>
-                  <HotkeysProvider>
-                    <Component {...pageProps} />
-                  </HotkeysProvider>
-                </AppProvider>
-              </ToastProvider>
-            </ThemeProvider>
-          </Provider>
-        </NoSsr>
-      </SafeHydrate>
+      <Provider store={ReduxStore}>
+        <ThemeProvider>
+          <ToastProvider>
+            <AppProvider>
+              <HotkeysProvider>
+                {children}
+              </HotkeysProvider>
+            </AppProvider>
+          </ToastProvider>
+        </ThemeProvider>
+      </Provider>
     </ErrorBoundary>
   );
 }
 
-export default MyApp;
+export default Main;
+
+

packages/bruno-app/src/pages/_document.js

@@ -1,41 +0,0 @@
-import Document, { Html, Head, Main, NextScript } from 'next/document';
-import { ServerStyleSheet } from 'styled-components';
-
-export default class MyDocument extends Document {
-  static async getInitialProps(ctx) {
-    const sheet = new ServerStyleSheet();
-    const originalRenderPage = ctx.renderPage;
-
-    try {
-      ctx.renderPage = () =>
-        originalRenderPage({
-          enhanceApp: (App) => (props) => sheet.collectStyles(<App {...props} />)
-        });
-
-      const initialProps = await Document.getInitialProps(ctx);
-      return {
-        ...initialProps,
-        styles: (
-          <>
-            {initialProps.styles}
-            {sheet.getStyleElement()}
-          </>
-        )
-      };
-    } finally {
-      sheet.seal();
-    }
-  }
-
-  render() {
-    return (
-      <Html>
-        <Head />
-        <body id="bruno-app-body">
-          <Main />
-          <NextScript />
-        </body>
-      </Html>
-    );
-  }
-}

packages/bruno-app/src/pages/index.js

@@ -1,20 +1,16 @@
-import Head from 'next/head';
 import Bruno from './Bruno';
 import GlobalStyle from '../globalStyles';
 import '../i18n';
+import Main from './Main';
 
-export default function Home() {
+export default function App() {
   return (
     <div>
-      <Head>
-        <title>Bruno</title>
-        <link rel="icon" href="/favicon.ico" />
-      </Head>
-
-      <GlobalStyle />
-
       <main>
-        <Bruno />
+        <Main>
+          <GlobalStyle />
+          <Bruno />
+        </Main>
       </main>
     </div>
   );

packages/bruno-app/src/providers/App/useTelemetry.js

@@ -7,21 +7,19 @@
  */
 
 import { useEffect } from 'react';
-import getConfig from 'next/config';
 import { PostHog } from 'posthog-node';
 import platformLib from 'platform';
 import { uuid } from 'utils/common';
 
-const { publicRuntimeConfig } = getConfig();
-const posthogApiKey = 'phc_7gtqSrrdZRohiozPMLIacjzgHbUlhalW1Bu16uYijMR';
+const posthogApiKey = process.env.NEXT_PUBLIC_POSTHOG_API_KEY;
 let posthogClient = null;
 
 const isPlaywrightTestRunning = () => {
-  return publicRuntimeConfig.PLAYWRIGHT ? true : false;
+  return process.env.PLAYWRIGHT ? true : false;
 };
 
 const isDevEnv = () => {
-  return publicRuntimeConfig.ENV === 'dev';
+  return import.meta.env.MODE === 'development';
 };
 
 const getPosthogClient = () => {
@@ -60,7 +58,7 @@ const trackStart = () => {
     event: 'start',
     properties: {
       os: platformLib.os.family,
-      version: '1.34.2'
+      version: '1.36.0'
     }
   });
 };

packages/bruno-app/src/providers/Hotkeys/index.js

@@ -6,7 +6,12 @@ import { useSelector, useDispatch } from 'react-redux';
 import EnvironmentSettings from 'components/Environments/EnvironmentSettings';
 import NetworkError from 'components/ResponsePane/NetworkError';
 import NewRequest from 'components/Sidebar/NewRequest';
-import { sendRequest, saveRequest, saveCollectionRoot } from 'providers/ReduxStore/slices/collections/actions';
+import {
+  sendRequest,
+  saveRequest,
+  saveCollectionRoot,
+  saveFolderRoot
+} from 'providers/ReduxStore/slices/collections/actions';
 import { findCollectionByUid, findItemInCollection } from 'utils/collections';
 import { closeTabs, switchTab } from 'providers/ReduxStore/slices/tabs';
 import { getKeyBindingsForActionAllOS } from './keyMappings';
@@ -43,7 +48,11 @@ export const HotkeysProvider = (props) => {
           if (collection) {
             const item = findItemInCollection(collection, activeTab.uid);
             if (item && item.uid) {
-              dispatch(saveRequest(activeTab.uid, activeTab.collectionUid));
+              if (activeTab.type === 'folder-settings') {
+                dispatch(saveFolderRoot(collection.uid, item.uid));
+              } else {
+                dispatch(saveRequest(activeTab.uid, activeTab.collectionUid));
+              }
             } else if (activeTab.type === 'collection-settings') {
               dispatch(saveCollectionRoot(collection.uid));
             }

packages/bruno-app/src/providers/ReduxStore/index.js

@@ -1,4 +1,3 @@
-import getConfig from 'next/config';
 import { configureStore } from '@reduxjs/toolkit';
 import tasksMiddleware from './middlewares/tasks/middleware';
 import debugMiddleware from './middlewares/debug/middleware';
@@ -8,9 +7,8 @@ import tabsReducer from './slices/tabs';
 import notificationsReducer from './slices/notifications';
 import globalEnvironmentsReducer from './slices/global-environments';
 
-const { publicRuntimeConfig } = getConfig();
 const isDevEnv = () => {
-  return publicRuntimeConfig.ENV === 'dev';
+  return import.meta.env.MODE === 'development';
 };
 
 let middleware = [tasksMiddleware.middleware];

packages/bruno-app/src/providers/ReduxStore/slices/collections/index.js

@@ -1,6 +1,5 @@
 import { uuid } from 'utils/common';
-import path from 'path';
-import { find, map, forOwn, concat, filter, each, cloneDeep, get, set, debounce } from 'lodash';
+import { find, map, forOwn, concat, filter, each, cloneDeep, get, set } from 'lodash';
 import { createSlice } from '@reduxjs/toolkit';
 import {
   addDepth,
@@ -13,6 +12,7 @@ import {
   findEnvironmentInCollection,
   findItemInCollection,
   findItemInCollectionByPathname,
+  isItemAFolder,
   isItemARequest
 } from 'utils/collections';
 import { parsePathParams, parseQueryParams, splitOnFirst, stringifyQueryParams } from 'utils/url';
@@ -765,6 +765,7 @@ export const collectionsSlice = createSlice({
             name: '',
             value: action.payload.value,
             description: '',
+            contentType: '',
             enabled: true
           });
         }
@@ -786,6 +787,7 @@ export const collectionsSlice = createSlice({
             param.name = action.payload.param.name;
             param.value = action.payload.param.value;
             param.description = action.payload.param.description;
+            param.contentType = action.payload.param.contentType;
             param.enabled = action.payload.param.enabled;
           }
         }
@@ -1733,6 +1735,15 @@ export const collectionsSlice = createSlice({
           item.draft.request.docs = action.payload.docs;
         }
       }
+    },
+    updateFolderDocs: (state, action) => {
+      const collection = findCollectionByUid(state.collections, action.payload.collectionUid);
+      const folder = collection ? findItemInCollection(collection, action.payload.folderUid) : null;
+      if (folder) {
+        if (isItemAFolder(folder)) {
+          set(folder, 'root.docs', action.payload.docs);
+        }
+      }
     }
   }
 });
@@ -1827,7 +1838,8 @@ export const {
   runRequestEvent,
   runFolderEvent,
   resetCollectionRunner,
-  updateRequestDocs
+  updateRequestDocs,
+  updateFolderDocs
 } = collectionsSlice.actions;
 
 export default collectionsSlice.reducer;

packages/bruno-app/src/providers/ReduxStore/slices/global-environments.js

@@ -92,9 +92,7 @@ export const addGlobalEnvironment = ({ name, variables = [] }) => (dispatch, get
     const uid = uuid();
     ipcRenderer
       .invoke('renderer:create-global-environment', { name, uid, variables })
-      .then(
-        dispatch(_addGlobalEnvironment({ name, uid, variables }))
-      )
+      .then(() => dispatch(_addGlobalEnvironment({ name, uid, variables })))
       .then(resolve)
       .catch(reject);
   });
@@ -108,9 +106,7 @@ export const copyGlobalEnvironment = ({ name, environmentUid: baseEnvUid }) => (
     const uid = uuid();
     ipcRenderer
       .invoke('renderer:create-global-environment', { uid, name, variables: baseEnv.variables })
-      .then(() => {
-        dispatch(_copyGlobalEnvironment({ name, uid, variables: baseEnv.variables }))
-      })
+      .then(() => dispatch(_copyGlobalEnvironment({ name, uid, variables: baseEnv.variables })))
       .then(resolve)
       .catch(reject);
   });
@@ -127,9 +123,7 @@ export const renameGlobalEnvironment = ({ name: newName, environmentUid }) => (d
     environmentSchema
       .validate(environment)
       .then(() => ipcRenderer.invoke('renderer:rename-global-environment', { name: newName, environmentUid }))
-      .then(
-        dispatch(_renameGlobalEnvironment({ name: newName, environmentUid }))
-      )
+      .then(() => dispatch(_renameGlobalEnvironment({ name: newName, environmentUid })))
       .then(resolve)
       .catch(reject);
   });
@@ -151,9 +145,7 @@ export const saveGlobalEnvironment = ({ variables, environmentUid }) => (dispatc
         environmentUid,
         variables
       }))
-      .then(
-        dispatch(_saveGlobalEnvironment({ environmentUid, variables }))
-      )
+      .then(() => dispatch(_saveGlobalEnvironment({ environmentUid, variables })))
       .then(resolve)
       .catch((error) => {
         reject(error);
@@ -165,9 +157,7 @@ export const selectGlobalEnvironment = ({ environmentUid }) => (dispatch, getSta
   return new Promise((resolve, reject) => {
     ipcRenderer
       .invoke('renderer:select-global-environment', { environmentUid })
-      .then(
-        dispatch(_selectGlobalEnvironment({ environmentUid }))
-      )
+      .then(() => dispatch(_selectGlobalEnvironment({ environmentUid })))
       .then(resolve)
       .catch(reject);
   });
@@ -177,9 +167,7 @@ export const deleteGlobalEnvironment = ({ environmentUid }) => (dispatch, getSta
   return new Promise((resolve, reject) => {
     ipcRenderer
       .invoke('renderer:delete-global-environment', { environmentUid })
-      .then(
-        dispatch(_deleteGlobalEnvironment({ environmentUid }))
-      )
+      .then(() => dispatch(_deleteGlobalEnvironment({ environmentUid })))
       .then(resolve)
       .catch(reject);
   });
@@ -195,7 +183,6 @@ export const globalEnvironmentsUpdateEvent = ({ globalEnvironmentVariables }) =>
     const environment = globalEnvironments?.find(env => env?.uid == environmentUid);
 
     if (!environment || !environmentUid) {
-      console.error('Global Environment not found');
       return resolve();
     }
 
@@ -204,7 +191,7 @@ export const globalEnvironmentsUpdateEvent = ({ globalEnvironmentVariables }) =>
     // update existing values
     variables = variables?.map?.(variable => ({
       ...variable,
-      value: stringifyIfNot(globalEnvironmentVariables?.[variable?.name])
+      value: globalEnvironmentVariables?.[variable?.name]
     }));
 
     // add new env values
@@ -214,7 +201,7 @@ export const globalEnvironmentsUpdateEvent = ({ globalEnvironmentVariables }) =>
         variables.push({
           uid: uuid(),
           name: key,
-          value: stringifyIfNot(value),
+          value,
           type: 'text',
           secret: false,
           enabled: true
@@ -228,9 +215,7 @@ export const globalEnvironmentsUpdateEvent = ({ globalEnvironmentVariables }) =>
         environmentUid,
         variables
       }))
-      .then(
-        dispatch(_saveGlobalEnvironment({ environmentUid, variables }))
-      )
+      .then(() => dispatch(_saveGlobalEnvironment({ environmentUid, variables })))
       .then(resolve)
       .catch((error) => {
         reject(error);

packages/bruno-app/src/providers/ReduxStore/slices/notifications.js

@@ -9,6 +9,7 @@ const getReadNotificationIds = () => {
     return readNotificationIds;
   } catch (err) {
     toast.error('An error occurred while fetching read notifications');
+    return [];
   }
 };
 
@@ -34,7 +35,6 @@ export const notificationSlice = createSlice({
       state.loading = action.payload.fetching;
     },
     setNotifications: (state, action) => {
-      console.log('notifications', notifications);
       let notifications = action.payload.notifications || [];
       let readNotificationIds = state.readNotificationIds;
 
@@ -58,14 +58,16 @@ export const notificationSlice = createSlice({
       });
     },
     markNotificationAsRead: (state, action) => {
-      if (state.readNotificationIds.includes(action.payload.notificationId)) return;
+      const { notificationId } = action.payload;
+
+      if (state.readNotificationIds.includes(notificationId)) return;
 
       const notification = state.notifications.find(
-        (notification) => notification.id === action.payload.notificationId
+        (notification) => notification.id === notificationId
       );
       if (!notification) return;
 
-      state.readNotificationIds.push(action.payload.notificationId);
+      state.readNotificationIds.push(notificationId);
       setReadNotificationsIds(state.readNotificationIds);
       notification.read = true;
     },

packages/bruno-app/src/styles/globals.css

@@ -23,18 +23,19 @@
   --color-method-options: rgb(52 52 52);
   --color-method-head: rgb(52 52 52);
 }
+
 :root,.graphiql-container,.CodeMirror-info,.CodeMirror-lint-tooltip,reach-portal {
   /* Required CSS variables after upgrading GraphiQL from v1.5.9 to v2.4.7 */
   /* Colors */
-  --color-primary: 320, 95%, 43% !important;
-  --color-secondary: 242, 51%, 61% !important;
-  --color-tertiary: 188, 100%, 36% !important;
-  --color-info: 208, 100%, 46% !important;
-  --color-success: 158, 60%, 42% !important;
-  --color-warning: 36, 100%, 41% !important;
-  --color-error: 13, 93%, 58% !important;
-  --color-neutral: 219, 28%, 32% !important;
-  --color-base: 219, 28%, 100% !important;
+  --color-primary: 0, 0%, 0% !important;
+  --color-secondary: 0, 0%, 0% !important;
+  --color-tertiary: 0, 0%, 0% !important;
+  --color-info: 0, 0%, 0% !important;
+  --color-success: 0, 0%, 0% !important;
+  --color-warning: 0, 0%, 0% !important;
+  --color-error: 0, 0%, 0% !important;
+  --color-neutral: 0, 0%, 0% !important;
+  --color-base: 0, 0%, 100% !important;
 
   /* Color alpha values */
   --alpha-secondary: 0.76 !important;
@@ -43,6 +44,59 @@
   --alpha-background-medium: 0.1 !important;
   --alpha-background-light: 0.07 !important;
   
+  --font-family: Consolas,Inconsolata,Droid Sans Mono,Monaco,monospace;
+  --font-family-mono: 'Fira Code', monospace;
+  --font-size-hint: .75rem;
+  --font-size-inline-code: .8125rem;
+  --font-size-body: .8rem;
+  --font-size-h4: 1.125rem;
+  --font-size-h3: 1.375rem;
+  --font-size-h2: 1.8125rem;
+  --font-weight-regular: 400;
+  --font-weight-medium: 500;
+  --line-height: 1.5;
+  --px-2: 0px;
+  --px-4: 0px;
+  --px-6: 2px;
+  --px-8: 8px;
+  --px-10: 10px;
+  --px-12: 12px;
+  --px-16: 16px;
+  --px-20: 20px;
+  --px-24: 24px;
+  --border-radius-2: 0px !important;
+  --border-radius-4: 0px !important;
+  --border-radius-8: 0px !important;
+  --border-radius-12: 0px !important;
+  --popover-box-shadow: 0px 0px 1px #000 !important;
+  --popover-border: none;
+  --sidebar-width: 60px;
+  --toolbar-width: 40px;
+  --session-header-height: 51px
+}
+
+/* Required CSS variables after upgrading GraphiQL from v1.5.9 to v2.4.7 */
+.graphiql-container, .CodeMirror-info, .CodeMirror-lint-tooltip, reach-portal {
+  /* General Colors */
+  --color-primary: 0, 0%, 0% !important;
+  --color-secondary: 0, 0%, 0% !important;
+  --color-tertiary: 0, 0%, 0% !important;
+  --color-info: 0, 0%, 0% !important;
+  --color-success: 0, 0%, 0% !important;
+  --color-warning: 0, 0%, 0% !important;
+  --color-error: 0, 0%, 0% !important;
+  --color-base: 0, 0%, 100% !important;
+  --color-neutral: 0, 0%, 60% !important;
+  
+  /* Color alpha values */
+  --alpha-secondary: 0.76 !important;
+  --alpha-tertiary: 0.5 !important;
+  --alpha-background-heavy: 0.15 !important;
+  --alpha-background-medium: 0.1 !important;
+  --alpha-background-light: 0.07 !important;
+  
+  --font-family: Consolas,Inconsolata,Droid Sans Mono,Monaco,monospace;
+  --font-family-mono: 'Fira Code', monospace;
   --font-size-hint: .75rem;
   --font-size-inline-code: .8125rem;
   --font-size-body: .9375rem;
@@ -52,15 +106,15 @@
   --font-weight-regular: 400;
   --font-weight-medium: 500;
   --line-height: 1.5;
-  --px-2: 2px;
-  --px-4: 4px;
-  --px-6: 6px;
-  --px-8: 8px;
-  --px-10: 10px;
-  --px-12: 12px;
-  --px-16: 16px;
-  --px-20: 20px;
-  --px-24: 24px;
+  --px-2: 2px !important;
+  --px-4: 4px !important;
+  --px-6: 6px !important;
+  --px-8: 8px !important;
+  --px-10: 10px !important;
+  --px-12: 12px !important;
+  --px-16: 16px !important;
+  --px-20: 20px !important;
+  --px-24: 24px !important;
   --border-radius-2: 2px !important;
   --border-radius-4: 2px !important;
   --border-radius-8: 2px !important;
@@ -72,6 +126,15 @@
   --session-header-height: 51px
 }
 
+.CodeMirror-dialog {
+  --px-4: 0px !important;
+  --px-12: 2px !important;
+}
+
+.graphiql-container {
+  background: transparent !important;
+}
+
 html,
 body {
   margin: 0;

packages/bruno-app/src/utils/codegenerator/har.js

@@ -19,16 +19,23 @@ const createContentType = (mode) => {
   }
 };
 
+/**
+ * Creates a list of enabled headers for the request, ensuring no duplicate content-type headers.
+ *
+ * @param {Object} request - The request object.
+ * @param {Object[]} headers - The array of header objects, each containing name, value, and enabled properties.
+ * @returns {Object[]} - An array of enabled headers with normalized names and values.
+ */
 const createHeaders = (request, headers) => {
   const enabledHeaders = headers
     .filter((header) => header.enabled)
     .map((header) => ({
-      name: header.name,
+      name: header.name.toLowerCase(),
       value: header.value
     }));
 
   const contentType = createContentType(request.body?.mode);
-  if (contentType !== '') {
+  if (contentType !== '' && !enabledHeaders.some((header) => header.name === 'content-type')) {
     enabledHeaders.push({ name: 'content-type', value: contentType });
   }
 

packages/bruno-app/src/utils/codemirror/autocomplete.js

@@ -1,5 +1,5 @@
 let CodeMirror;
-const SERVER_RENDERED = typeof navigator === 'undefined' || global['PREVENT_CODEMIRROR_RENDER'] === true;
+const SERVER_RENDERED = typeof window === 'undefined' || global['PREVENT_CODEMIRROR_RENDER'] === true;
 
 if (!SERVER_RENDERED) {
   CodeMirror = require('codemirror');

packages/bruno-app/src/utils/codemirror/brunoVarInfo.js

@@ -12,7 +12,7 @@ import brunoCommon from '@usebruno/common';
 const { interpolate } = brunoCommon;
 
 let CodeMirror;
-const SERVER_RENDERED = typeof navigator === 'undefined' || global['PREVENT_CODEMIRROR_RENDER'] === true;
+const SERVER_RENDERED = typeof window === 'undefined' || global['PREVENT_CODEMIRROR_RENDER'] === true;
 const { get } = require('lodash');
 
 if (!SERVER_RENDERED) {
@@ -44,8 +44,11 @@ if (!SERVER_RENDERED) {
     const into = document.createElement('div');
     const descriptionDiv = document.createElement('div');
     descriptionDiv.className = 'info-description';
-
-    descriptionDiv.appendChild(document.createTextNode(variableValue));
+    if (options?.variables?.maskedEnvVariables?.includes(variableName)) {
+      descriptionDiv.appendChild(document.createTextNode('*****'));
+    } else {
+      descriptionDiv.appendChild(document.createTextNode(variableValue));
+    }
     into.appendChild(descriptionDiv);
 
     return into;
@@ -90,9 +93,6 @@ if (!SERVER_RENDERED) {
 
     const box = target.getBoundingClientRect();
 
-    const hoverTime = getHoverTime(cm);
-    state.hoverTimeout = setTimeout(onHover, hoverTime);
-
     const onMouseMove = function () {
       clearTimeout(state.hoverTimeout);
       state.hoverTimeout = setTimeout(onHover, hoverTime);
@@ -112,6 +112,9 @@ if (!SERVER_RENDERED) {
       onMouseHover(cm, box);
     };
 
+    const hoverTime = getHoverTime(cm);
+    state.hoverTimeout = setTimeout(onHover, hoverTime);
+
     CodeMirror.on(document, 'mousemove', onMouseMove);
     CodeMirror.on(cm.getWrapperElement(), 'mouseout', onMouseOut);
   }

packages/bruno-app/src/utils/codemirror/javascript-lint.js

@@ -6,7 +6,7 @@
  */
 
 let CodeMirror;
-const SERVER_RENDERED = typeof navigator === 'undefined' || global['PREVENT_CODEMIRROR_RENDER'] === true;
+const SERVER_RENDERED = typeof window === 'undefined' || global['PREVENT_CODEMIRROR_RENDER'] === true;
 
 if (!SERVER_RENDERED) {
   CodeMirror = require('codemirror');

packages/bruno-app/src/utils/collections/index.js

@@ -303,7 +303,8 @@ export const transformCollectionToSaveToExportAsFile = (collection, options = {}
           script: si.request.script,
           vars: si.request.vars,
           assertions: si.request.assertions,
-          tests: si.request.tests
+          tests: si.request.tests,
+          docs: si.request.docs
         };
 
         // Handle auth object dynamically
@@ -403,7 +404,7 @@ export const transformCollectionToSaveToExportAsFile = (collection, options = {}
           request: {}
         };
 
-        let { request, meta } = si?.root || {};
+        let { request, meta, docs } = si?.root || {};
         let { headers, script = {}, vars = {}, tests } = request || {};
 
         // folder level headers
@@ -435,6 +436,11 @@ export const transformCollectionToSaveToExportAsFile = (collection, options = {}
           di.root.request.tests = tests;
         }
 
+        // folder level docs
+        if (docs?.length) {
+          di.root.docs = docs;
+        }
+
         if (meta?.name) {
           di.root.meta = {};
           di.root.meta.name = meta?.name;
@@ -791,7 +797,7 @@ export const getGlobalEnvironmentVariables = ({ globalEnvironments, activeGlobal
   const environment = globalEnvironments?.find(env => env?.uid === activeGlobalEnvironmentUid);
   if (environment) {
     each(environment.variables, (variable) => {
-      if (variable.name && variable.value && variable.enabled) {
+      if (variable.name && variable.enabled) {
         variables[variable.name] = variable.value;
       }
     });
@@ -799,6 +805,19 @@ export const getGlobalEnvironmentVariables = ({ globalEnvironments, activeGlobal
   return variables;
 };
 
+export const getGlobalEnvironmentVariablesMasked = ({ globalEnvironments, activeGlobalEnvironmentUid }) => {
+  const environment = globalEnvironments?.find(env => env?.uid === activeGlobalEnvironmentUid);
+
+  if (environment && Array.isArray(environment.variables)) {
+    return environment.variables
+      .filter((variable) => variable.name && variable.value && variable.enabled && variable.secret)
+      .map((variable) => variable.name);
+  }
+
+  return [];
+};
+
+
 export const getEnvironmentVariables = (collection) => {
   let variables = {};
   if (collection) {
@@ -815,6 +834,23 @@ export const getEnvironmentVariables = (collection) => {
   return variables;
 };
 
+export const getEnvironmentVariablesMasked = (collection) => {
+  // Return an empty array if the collection is invalid or not provided
+  if (!collection || !collection.activeEnvironmentUid) {
+    return [];
+  }
+
+  // Find the active environment in the collection
+  const environment = findEnvironmentInCollection(collection, collection.activeEnvironmentUid);
+  if (!environment || !environment.variables) {
+    return [];
+  }
+
+  // Filter the environment variables to get only the masked (secret) ones
+  return environment.variables
+    .filter((variable) => variable.name && variable.value && variable.enabled && variable.secret)
+    .map((variable) => variable.name);
+};
 
 const getPathParams = (item) => {
   let pathParams = {};
@@ -850,6 +886,27 @@ export const getAllVariables = (collection, item) => {
   const { globalEnvironmentVariables = {} } = collection;
 
   const { processEnvVariables = {}, runtimeVariables = {} } = collection;
+  const mergedVariables = {
+    ...folderVariables,
+    ...requestVariables,
+    ...runtimeVariables
+  };
+
+  const mergedVariablesGlobal = {
+    ...collectionVariables,
+    ...envVariables,
+    ...folderVariables,
+    ...requestVariables,
+    ...runtimeVariables,
+  }
+
+  const maskedEnvVariables = getEnvironmentVariablesMasked(collection) || [];
+  const maskedGlobalEnvVariables = collection?.globalEnvSecrets || [];
+
+  const filteredMaskedEnvVariables = maskedEnvVariables.filter((key) => !(key in mergedVariables));
+  const filteredMaskedGlobalEnvVariables = maskedGlobalEnvVariables.filter((key) => !(key in mergedVariablesGlobal));
+
+  const uniqueMaskedVariables = [...new Set([...filteredMaskedEnvVariables, ...filteredMaskedGlobalEnvVariables])];
 
   return {
     ...globalEnvironmentVariables,
@@ -861,6 +918,7 @@ export const getAllVariables = (collection, item) => {
     pathParams: {
       ...pathParams
     },
+    maskedEnvVariables: uniqueMaskedVariables,
     process: {
       env: {
         ...processEnvVariables

packages/bruno-app/src/utils/common/codemirror.js

@@ -1,7 +1,7 @@
 import get from 'lodash/get';
 
 let CodeMirror;
-const SERVER_RENDERED = typeof navigator === 'undefined' || global['PREVENT_CODEMIRROR_RENDER'] === true;
+const SERVER_RENDERED = typeof window === 'undefined' || global['PREVENT_CODEMIRROR_RENDER'] === true;
 
 if (!SERVER_RENDERED) {
   CodeMirror = require('codemirror');
@@ -52,17 +52,33 @@ export class MaskedEditor {
   /** Replaces all rendered characters, with the provided character. */
   maskContent = () => {
     const content = this.editor.getValue();
+    const lineCount = this.editor.lineCount();
+
+    if (lineCount === 0) return;
     this.editor.operation(() => {
       // Clear previous masked text
       this.editor.getAllMarks().forEach((mark) => mark.clear());
       // Apply new masked text
-      for (let i = 0; i < content.length; i++) {
-        if (content[i] !== '\n') {
-          const maskedNode = document.createTextNode(this.maskChar);
+
+      if (content.length <= 500) {
+        for (let i = 0; i < content.length; i++) {
+          if (content[i] !== '\n') {
+            const maskedNode = document.createTextNode(this.maskChar);
+            this.editor.markText(
+              { line: this.editor.posFromIndex(i).line, ch: this.editor.posFromIndex(i).ch },
+              { line: this.editor.posFromIndex(i + 1).line, ch: this.editor.posFromIndex(i + 1).ch },
+              { replacedWith: maskedNode, handleMouseEvents: true }
+            );
+          }
+        }
+      } else {
+        for (let line = 0; line < lineCount; line++) {
+          const lineLength = this.editor.getLine(line).length;
+          const maskedNode = document.createTextNode('*'.repeat(lineLength)); 
           this.editor.markText(
-            { line: this.editor.posFromIndex(i).line, ch: this.editor.posFromIndex(i).ch },
-            { line: this.editor.posFromIndex(i + 1).line, ch: this.editor.posFromIndex(i + 1).ch },
-            { replacedWith: maskedNode, handleMouseEvents: true }
+            { line, ch: 0 },
+            { line, ch: lineLength },
+            { replacedWith: maskedNode, handleMouseEvents: false } 
           );
         }
       }

packages/bruno-app/src/utils/common/index.js

@@ -151,7 +151,15 @@ export const relativeDate = (dateString) => {
 export const humanizeDate = (dateString) => {
   // See this discussion for why .split is necessary
   // https://stackoverflow.com/questions/7556591/is-the-javascript-date-object-always-one-day-off
-  const date = new Date(dateString.split('-'));
+
+  if (!dateString || typeof dateString !== 'string') {
+    return 'Invalid Date';
+  }
+  const date = new Date(dateString);
+  if (isNaN(date.getTime())) {
+    return 'Invalid Date';
+  }
+
   return date.toLocaleDateString('en-US', {
     year: 'numeric',
     month: 'long',

packages/bruno-app/src/utils/common/index.spec.js

@@ -58,6 +58,18 @@ describe('common utils', () => {
     it('should return invalid date if the date is invalid', () => {
       expect(humanizeDate('9999-99-99')).toBe('Invalid Date');
     });
+
+    it('should return "Invalid Date" if the date is null', () => {
+      expect(humanizeDate(null)).toBe('Invalid Date');
+    });
+
+    it('should return a humanized date for a valid date in ISO format', () => {
+      expect(humanizeDate('2024-11-28T00:00:00Z')).toBe('November 28, 2024');
+    });
+
+    it('should return "Invalid Date" for a non-date string', () => {
+      expect(humanizeDate('some random text')).toBe('Invalid Date');
+    });
   });
 
   describe('relativeDate', () => {

packages/bruno-app/src/utils/curl/curl-to-json.js

@@ -36,6 +36,12 @@ function getQueries(request) {
   return queries;
 }
 
+/**
+ * Converts request data to a string based on its content type.
+ *
+ * @param {Object} request - The request object containing data and headers.
+ * @returns {Object} An object containing the data string.
+ */
 function getDataString(request) {
   if (typeof request.data === 'number') {
     request.data = request.data.toString();
@@ -44,7 +50,15 @@ function getDataString(request) {
   const contentType = getContentType(request.headers);
 
   if (contentType && contentType.includes('application/json')) {
-    return { data: request.data.toString() };
+    try {
+      const parsedData = JSON.parse(request.data);
+      return { data: JSON.stringify(parsedData) };
+    } catch (error) {
+      console.error('Failed to parse JSON data:', error);
+      return { data: request.data.toString() };
+    }
+  } else if (contentType && (contentType.includes('application/xml') || contentType.includes('text/plain'))) {
+    return { data: request.data };
   }
 
   const parsedQueryString = querystring.parse(request.data, { sort: false });
@@ -160,14 +174,14 @@ const curlToJson = (curlCommand) => {
   }
 
   if (request.auth) {
-    if(request.auth.mode === 'basic'){
+    if (request.auth.mode === 'basic') {
       requestJson.auth = {
         mode: 'basic',
         basic: {
           username: repr(request.auth.basic?.username),
           password: repr(request.auth.basic?.password)
         }
-      }
+      };
     }
   }
 

packages/bruno-app/src/utils/curl/index.js

@@ -2,7 +2,7 @@ import { forOwn } from 'lodash';
 import { convertToCodeMirrorJson } from 'utils/common';
 import curlToJson from './curl-to-json';
 
-export const getRequestFromCurlCommand = (curlCommand) => {
+export const getRequestFromCurlCommand = (curlCommand, requestType = 'http-request') => {
   const parseFormData = (parsedBody) => {
     const formData = [];
     forOwn(parsedBody, (value, key) => {
@@ -12,6 +12,22 @@ export const getRequestFromCurlCommand = (curlCommand) => {
     return formData;
   };
 
+  const parseGraphQL = (text) => {
+    try {
+      const graphql = JSON.parse(text);
+
+      return {
+        query: graphql.query,
+        variables: JSON.stringify(graphql.variables, null, 2)
+      };
+    } catch (e) {
+      return {
+        query: '',
+        variables: ''
+      };
+    }
+  };
+
   try {
     if (!curlCommand || typeof curlCommand !== 'string' || curlCommand.length === 0) {
       return null;
@@ -24,6 +40,8 @@ export const getRequestFromCurlCommand = (curlCommand) => {
       Object.keys(parsedHeaders).map((key) => ({ name: key, value: parsedHeaders[key], enabled: true }));
 
     const contentType = headers?.find((h) => h.name.toLowerCase() === 'content-type')?.value;
+    const parsedBody = request.data;
+
     const body = {
       mode: 'none',
       json: null,
@@ -31,14 +49,18 @@ export const getRequestFromCurlCommand = (curlCommand) => {
       xml: null,
       sparql: null,
       multipartForm: null,
-      formUrlEncoded: null
+      formUrlEncoded: null,
+      graphql: null
     };
-    const parsedBody = request.data;
+
     if (parsedBody && contentType && typeof contentType === 'string') {
-      if (contentType.includes('application/json')) {
+      if (requestType === 'graphql-request' && (contentType.includes('application/json') || contentType.includes('application/graphql'))) {
+        body.mode = 'graphql';
+        body.graphql = parseGraphQL(parsedBody);
+      } else if (contentType.includes('application/json')) {
         body.mode = 'json';
         body.json = convertToCodeMirrorJson(parsedBody);
-      } else if (contentType.includes('text/xml')) {
+      } else if (contentType.includes('xml')) {
         body.mode = 'xml';
         body.xml = parsedBody;
       } else if (contentType.includes('application/x-www-form-urlencoded')) {

packages/bruno-app/src/utils/importers/common.js

@@ -79,9 +79,9 @@ export const transformItemsInCollection = (collection) => {
         // from 5 feb 2024, multipartFormData needs to have a type
         // this was introduced when we added support for file uploads
         // below logic is to make older collection exports backward compatible
-        let multipartFormData = _.get(item, 'request.body.multipartForm');
+        let multipartFormData = get(item, 'request.body.multipartForm');
         if (multipartFormData) {
-          _.each(multipartFormData, (form) => {
+          each(multipartFormData, (form) => {
             if (!form.type) {
               form.type = 'text';
             }

packages/bruno-app/src/utils/importers/openapi-collection.js

@@ -271,7 +271,7 @@ const resolveRefs = (spec, components = spec?.components, visitedItems = new Set
 
   // Recursively resolve references in nested objects
   for (const prop in spec) {
-    spec[prop] = resolveRefs(spec[prop], components, visitedItems);
+    spec[prop] = resolveRefs(spec[prop], components, new Set(visitedItems));
   }
 
   return spec;
@@ -316,7 +316,7 @@ const getDefaultUrl = (serverObject) => {
       url = url.replace(`{${variableName}}`, sub);
     });
   }
-  return url.endsWith('/') ? url : `${url}/`;
+  return url.endsWith('/') ? url.slice(0, -1) : url;
 };
 
 const getSecurity = (apiSpec) => {
@@ -353,7 +353,7 @@ const openAPIRuntimeExpressionToScript = (expression) => {
   return expression;
 };
 
-const parseOpenApiCollection = (data) => {
+export const parseOpenApiCollection = (data) => {
   const brunoCollection = {
     name: '',
     uid: uuid(),

packages/bruno-app/src/utils/importers/openapi-collection.spec.js

@@ -0,0 +1,67 @@
+import { parseOpenApiCollection } from './openapi-collection';
+import { uuid } from 'utils/common';
+
+jest.mock('utils/common');
+
+describe('openapi importer util functions', () => {
+  afterEach(jest.clearAllMocks);
+
+  it('should convert openapi object to bruno collection correctly', async () => {
+    const input = {
+      openapi: '3.0.3',
+      info: {
+        title: 'Sample API with Multiple Servers',
+        description: 'API spec with multiple servers.',
+        version: '1.0.0'
+      },
+      servers: [
+        { url: 'https://api.example.com/v1', description: 'Production Server' },
+        { url: 'https://staging-api.example.com/v1', description: 'Staging Server' },
+        { url: 'http://localhost:3000/v1', description: 'Local Server' }
+      ],
+      paths: {
+        '/users': {
+          get: {
+            summary: 'Get a list of users',
+            parameters: [
+              { name: 'page', in: 'query', required: false, schema: { type: 'integer' } },
+              { name: 'limit', in: 'query', required: false, schema: { type: 'integer' } }
+            ],
+            responses: {
+              '200': { description: 'A list of users' }
+            }
+          }
+        }
+      }
+    };
+
+    const expectedOutput = {
+      name: 'Sample API with Multiple Servers',
+      version: '1',
+      items: [
+        {
+          name: 'Get a list of users',
+          type: 'http-request',
+          request: {
+            url: '{{baseUrl}}/users',
+            method: 'GET',
+            params: [
+              { name: 'page', value: '', enabled: false, type: 'query' },
+              { name: 'limit', value: '', enabled: false, type: 'query' }
+            ]
+          }
+        }
+      ],
+      environments: [
+        { name: 'Production Server', variables: [{ name: 'baseUrl', value: 'https://api.example.com/v1' }] },
+        { name: 'Staging Server', variables: [{ name: 'baseUrl', value: 'https://staging-api.example.com/v1' }] },
+        { name: 'Local Server', variables: [{ name: 'baseUrl', value: 'http://localhost:3000/v1' }] }
+      ]
+    };
+
+    const result = await parseOpenApiCollection(input);
+
+    expect(result).toMatchObject(expectedOutput);
+    expect(uuid).toHaveBeenCalledTimes(10);
+  });
+});

packages/bruno-app/src/utils/importers/postman-collection.js

@@ -166,6 +166,17 @@ const importScriptsFromEvents = (events, requestObject, options, pushTranslation
   });
 };
 
+const importCollectionLevelVariables = (variables, requestObject) => {
+  const vars = variables.map((v) => ({
+    uid: uuid(),
+    name: v.key,
+    value: v.value,
+    enabled: true
+  }));
+
+  requestObject.vars.req = vars;
+};
+
 const importPostmanV2CollectionItem = (brunoParent, item, parentAuth, options) => {
   brunoParent.items = brunoParent.items || [];
   const folderMap = {};
@@ -494,6 +505,10 @@ const importPostmanV2Collection = (collection, options) => {
     importScriptsFromEvents(collection.event, brunoCollection.root.request, options, pushTranslationLog);
   }
 
+  if (collection?.variable){
+    importCollectionLevelVariables(collection.variable, brunoCollection.root.request);
+  }
+
   importPostmanV2CollectionItem(brunoCollection, collection.item, collection.auth, options);
 
   return brunoCollection;

packages/bruno-app/src/utils/importers/translators/index.spec.js

@@ -11,6 +11,9 @@ describe('postmanTranslation function', () => {
       pm.collectionVariables.set('key', 'value');
       const data = pm.response.json();
       pm.expect(pm.environment.has('key')).to.be.true;
+      postman.setEnvironmentVariable('key', 'value');
+      postman.getEnvironmentVariable('key');
+      postman.clearEnvironmentVariable('key');
     `;
     const expectedOutput = `
       bru.getEnvVar('key');
@@ -21,6 +24,9 @@ describe('postmanTranslation function', () => {
       bru.setVar('key', 'value');
       const data = res.getBody();
       expect(bru.getEnvVar('key') !== undefined && bru.getEnvVar('key') !== null).to.be.true;
+      bru.setEnvVar('key', 'value');
+      bru.getEnvVar('key');
+      bru.deleteEnvVar('key');
     `;
     expect(postmanTranslation(inputScript)).toBe(expectedOutput);
   });
@@ -151,3 +157,13 @@ test('should handle response commands', () => {
   `;
   expect(postmanTranslation(inputScript)).toBe(expectedOutput);
 });
+
+test('should handle tests object', () => {
+  const inputScript = `
+    tests['Status code is 200'] = responseCode.code === 200;
+  `;
+  const expectedOutput = `
+    test("Status code is 200", function() { expect(Boolean(responseCode.code === 200)).to.be.true; });
+  `;
+  expect(postmanTranslation(inputScript)).toBe(expectedOutput);
+});

packages/bruno-app/src/utils/importers/translators/postman_translation.js

@@ -17,7 +17,13 @@ const replacements = {
   'pm\\.response\\.code': 'res.getStatus()',
   'pm\\.response\\.text\\(': 'res.getBody()?.toString(',
   'pm\\.expect\\.fail\\(': 'expect.fail(',
-  'pm\\.response\\.responseTime': 'res.getResponseTime()'
+  'pm\\.response\\.responseTime': 'res.getResponseTime()',
+  'pm\\.environment\\.name': 'bru.getEnvName()',
+  "tests\\['([^']+)'\\]\\s*=\\s*([^;]+);": 'test("$1", function() { expect(Boolean($2)).to.be.true; });',
+  // deprecated translations
+  'postman\\.setEnvironmentVariable\\(': 'bru.setEnvVar(',
+  'postman\\.getEnvironmentVariable\\(': 'bru.getEnvVar(',
+  'postman\\.clearEnvironmentVariable\\(': 'bru.deleteEnvVar(',
 };
 
 const extendedReplacements = Object.keys(replacements).reduce((acc, key) => {

packages/bruno-cli/package.json

@@ -37,10 +37,10 @@
     "fs-extra": "^10.1.0",
     "http-proxy-agent": "^7.0.0",
     "https-proxy-agent": "^7.0.2",
-    "json-bigint": "^1.0.0",
     "lodash": "^4.17.21",
     "qs": "^6.11.0",
     "socks-proxy-agent": "^8.0.2",
+    "tough-cookie": "^4.1.3",
     "@usebruno/vm2": "^3.9.13",
     "xmlbuilder": "^15.1.1",
     "yargs": "^17.6.2"

packages/bruno-cli/src/commands/run.js

@@ -93,8 +93,68 @@ const printRunSummary = (results) => {
   };
 };
 
+const createCollectionFromPath = (collectionPath) => {
+  const environmentsPath = path.join(collectionPath, `environments`);
+  const getFilesInOrder = (collectionPath) => {
+    let collection = {
+      pathname: collectionPath
+    };
+    const traverse = (currentPath) => {
+      const filesInCurrentDir = fs.readdirSync(currentPath);
+
+      if (currentPath.includes('node_modules')) {
+        return;
+      }
+      const currentDirItems = [];
+      for (const file of filesInCurrentDir) {
+        const filePath = path.join(currentPath, file);
+        const stats = fs.lstatSync(filePath);
+        if (
+          stats.isDirectory() &&
+          filePath !== environmentsPath &&
+          !filePath.startsWith('.git') &&
+          !filePath.startsWith('node_modules')
+        ) {
+          let folderItem = { name: file, pathname: filePath, type: 'folder', items: traverse(filePath) }
+          const folderBruFilePath = path.join(filePath, 'folder.bru');
+          const folderBruFileExists = fs.existsSync(folderBruFilePath);
+          if(folderBruFileExists) {
+            const folderBruContent = fs.readFileSync(folderBruFilePath, 'utf8');
+            let folderBruJson = collectionBruToJson(folderBruContent);
+            folderItem.root = folderBruJson;
+          }
+          currentDirItems.push(folderItem);
+        }
+      }
+
+      for (const file of filesInCurrentDir) {
+        if (['collection.bru', 'folder.bru'].includes(file)) {
+          continue;
+        }
+        const filePath = path.join(currentPath, file);
+        const stats = fs.lstatSync(filePath);
+
+        if (!stats.isDirectory() && path.extname(filePath) === '.bru') {
+          const bruContent = fs.readFileSync(filePath, 'utf8');
+          const bruJson = bruToJson(bruContent);
+          currentDirItems.push({
+            name: file,
+            pathname: filePath,
+            ...bruJson
+          });
+        }
+      }
+      return currentDirItems
+    };
+    collection.items = traverse(collectionPath);
+    return collection;
+  };
+  return getFilesInOrder(collectionPath);
+};
+
 const getBruFilesRecursively = (dir, testsOnly) => {
   const environmentsPath = 'environments';
+  const collection = {};
 
   const getFilesInOrder = (dir) => {
     let bruJsons = [];
@@ -211,6 +271,11 @@ const builder = async (yargs) => {
       description:
         'The specified custom CA certificate (--cacert) will be used exclusively and the default truststore is ignored, if this option is specified. Evaluated in combination with "--cacert" only.'
     })
+    .option('disable-cookies', {
+      type: 'boolean',
+      default: false,
+      description: 'Automatically save and sent cookies with requests'
+    })
     .option('env', {
       describe: 'Environment variables',
       type: 'string'
@@ -259,10 +324,30 @@ const builder = async (yargs) => {
       type: 'boolean',
       description: 'Stop execution after a failure of a request, test, or assertion'
     })
+    .option('reporter-skip-all-headers', {
+      type: 'boolean',
+      description: 'Omit headers from the reporter output',
+      default: false
+    })
+    .option('reporter-skip-headers', {
+      type: 'array',
+      description: 'Skip specific headers from the reporter output',
+      default: []
+    })
+    .option('client-cert-config', {
+      type: 'string',
+      description: 'Path to the Client certificate config file used for securing the connection in the request'
+    })
+
     .example('$0 run request.bru', 'Run a request')
     .example('$0 run request.bru --env local', 'Run a request with the environment set to local')
     .example('$0 run folder', 'Run all requests in a folder')
     .example('$0 run folder -r', 'Run all requests in a folder recursively')
+    .example('$0 run --reporter-skip-all-headers', 'Run all requests in a folder recursively with omitted headers from the reporter output')
+    .example(
+      '$0 run --reporter-skip-headers "Authorization"',
+      'Run all requests in a folder recursively with skipped headers from the reporter output'
+    )
     .example(
       '$0 run request.bru --env local --env-var secret=xxx',
       'Run a request with the environment set to local and overwrite the variable secret with value xxx'
@@ -292,7 +377,8 @@ const builder = async (yargs) => {
     .example(
       '$0 run folder --cacert myCustomCA.pem --ignore-truststore',
       'Use a custom CA certificate exclusively when validating the peers of the requests in the specified folder.'
-    );
+    )
+    .example('$0 run --client-cert-config client-cert-config.json', 'Run a request with Client certificate configurations');
 };
 
 const handler = async function (argv) {
@@ -301,6 +387,7 @@ const handler = async function (argv) {
       filename,
       cacert,
       ignoreTruststore,
+      disableCookies,
       env,
       envVar,
       insecure,
@@ -312,7 +399,10 @@ const handler = async function (argv) {
       reporterHtml,
       sandbox,
       testsOnly,
-      bail
+      bail,
+      reporterSkipAllHeaders,
+      reporterSkipHeaders,
+      clientCertConfig
     } = argv;
     const collectionPath = process.cwd();
 
@@ -329,6 +419,47 @@ const handler = async function (argv) {
     const brunoConfigFile = fs.readFileSync(brunoJsonPath, 'utf8');
     const brunoConfig = JSON.parse(brunoConfigFile);
     const collectionRoot = getCollectionRoot(collectionPath);
+    let collection = createCollectionFromPath(collectionPath);
+    collection = {
+      brunoConfig,
+      root: collectionRoot,
+      ...collection
+    }
+
+    if (clientCertConfig) {
+      try {
+        const clientCertConfigExists = await exists(clientCertConfig);
+        if (!clientCertConfigExists) {
+          console.error(chalk.red(`Client Certificate Config file "${clientCertConfig}" does not exist.`));
+          process.exit(constants.EXIT_STATUS.ERROR_FILE_NOT_FOUND);
+        }
+
+        const clientCertConfigFileContent = fs.readFileSync(clientCertConfig, 'utf8');
+        let clientCertConfigJson;
+
+        try {
+          clientCertConfigJson = JSON.parse(clientCertConfigFileContent);
+        } catch (err) {
+          console.error(chalk.red(`Failed to parse Client Certificate Config JSON: ${err.message}`));
+          process.exit(constants.EXIT_STATUS.ERROR_INVALID_JSON);
+        }
+
+        if (clientCertConfigJson?.enabled && Array.isArray(clientCertConfigJson?.certs)) {
+          if (brunoConfig.clientCertificates) {
+            brunoConfig.clientCertificates.certs.push(...clientCertConfigJson.certs);
+          } else {
+            brunoConfig.clientCertificates = { certs: clientCertConfigJson.certs };
+          }
+          console.log(chalk.green(`Client certificates has been added`));
+        } else {
+          console.warn(chalk.yellow(`Client certificate configuration is enabled, but it either contains no valid "certs" array or the added configuration has been set to false`));
+        }
+      } catch (err) {
+        console.error(chalk.red(`Unexpected error: ${err.message}`));
+        process.exit(constants.EXIT_STATUS.ERROR_UNKNOWN);
+      }
+    }
+
 
     if (filename && filename.length) {
       const pathExists = await exists(filename);
@@ -392,6 +523,9 @@ const handler = async function (argv) {
     if (insecure) {
       options['insecure'] = true;
     }
+    if (disableCookies) {
+      options['disableCookies'] = true;
+    }
     if (cacert && cacert.length) {
       if (insecure) {
         console.error(chalk.red(`Ignoring the cacert option since insecure connections are enabled`));
@@ -516,7 +650,8 @@ const handler = async function (argv) {
         processEnvVars,
         brunoConfig,
         collectionRoot,
-        runtime
+        runtime,
+        collection
       );
 
       results.push({
@@ -525,6 +660,35 @@ const handler = async function (argv) {
         suitename: bruFilepath.replace('.bru', '')
       });
 
+      if (reporterSkipAllHeaders) {
+        results.forEach((result) => {
+          result.request.headers = {};
+          result.response.headers = {};
+        });
+      }
+
+      const deleteHeaderIfExists = (headers, header) => {
+        if (headers && headers[header]) {
+          delete headers[header];
+        }
+      };
+
+      if (reporterSkipHeaders?.length) {
+        results.forEach((result) => {
+          if (result.request?.headers) {
+            reporterSkipHeaders.forEach((header) => {
+              deleteHeaderIfExists(result.request.headers, header);
+            });
+          }
+          if (result.response?.headers) {
+            reporterSkipHeaders.forEach((header) => {
+              deleteHeaderIfExists(result.response.headers, header);
+            });
+          }
+        });
+      }
+
+
       // bail if option is set and there is a failure
       if (bail) {
         const requestFailure = result?.error;

packages/bruno-cli/src/constants.js

@@ -24,7 +24,7 @@ const EXIT_STATUS = {
   // Invalid output format requested
   ERROR_INCORRECT_OUTPUT_FORMAT: 9,
   // Everything else
-  ERROR_GENERIC: 255,
+  ERROR_GENERIC: 255
 };
 
 module.exports = {

packages/bruno-cli/src/runner/interpolate-vars.js

@@ -13,14 +13,17 @@ const getContentType = (headers = {}) => {
   return contentType;
 };
 
-const interpolateVars = (request, envVars = {}, runtimeVariables = {}, processEnvVars = {}) => {
+const interpolateVars = (request, envVariables = {}, runtimeVariables = {}, processEnvVars = {}) => {
+  const collectionVariables = request?.collectionVariables || {};
+  const folderVariables = request?.folderVariables || {};
+  const requestVariables = request?.requestVariables || {};
   // we clone envVars because we don't want to modify the original object
-  envVars = cloneDeep(envVars);
+  envVariables = cloneDeep(envVariables);
 
   // envVars can inturn have values as {{process.env.VAR_NAME}}
   // so we need to interpolate envVars first with processEnvVars
-  forOwn(envVars, (value, key) => {
-    envVars[key] = interpolate(value, {
+  forOwn(envVariables, (value, key) => {
+    envVariables[key] = interpolate(value, {
       process: {
         env: {
           ...processEnvVars
@@ -36,7 +39,10 @@ const interpolateVars = (request, envVars = {}, runtimeVariables = {}, processEn
 
     // runtimeVariables take precedence over envVars
     const combinedVars = {
-      ...envVars,
+      ...collectionVariables,
+      ...envVariables,
+      ...folderVariables,
+      ...requestVariables,
       ...runtimeVariables,
       process: {
         env: {
@@ -80,11 +86,12 @@ const interpolateVars = (request, envVars = {}, runtimeVariables = {}, processEn
       } catch (err) {}
     }
   } else if (contentType === 'multipart/form-data') {
-    if (typeof request.data === 'object' && !(request?.data instanceof FormData)) {
+    if (Array.isArray(request?.data) && !(request.data instanceof FormData)) {
       try {
-        forOwn(request?.data, (value, key) => {
-          request.data[key] = _interpolate(value);
-        });
+        request.data = request?.data?.map(d => ({
+          ...d,
+          value: _interpolate(d?.value)
+        }));   
       } catch (err) {}
     }
   } else {

packages/bruno-cli/src/runner/prepare-request.js

@@ -1,24 +1,24 @@
 const { get, each, filter } = require('lodash');
-const fs = require('fs');
-var JSONbig = require('json-bigint');
 const decomment = require('decomment');
 const crypto = require('node:crypto');
+const { mergeHeaders, mergeScripts, mergeVars, getTreePathFromCollectionToItem } = require('../utils/collection');
+const { createFormData } = require('../utils/form-data');
 
-const prepareRequest = (request, collectionRoot) => {
+const prepareRequest = (item = {}, collection = {}) => {
+  const request = item?.request;
+  const brunoConfig = get(collection, 'brunoConfig', {});
   const headers = {};
   let contentTypeDefined = false;
 
-  // collection headers
-  each(get(collectionRoot, 'request.headers', []), (h) => {
-    if (h.enabled) {
-      headers[h.name] = h.value;
-      if (h.name.toLowerCase() === 'content-type') {
-        contentTypeDefined = true;
-      }
-    }
-  });
+  const scriptFlow = brunoConfig?.scripts?.flow ?? 'sandwich';
+  const requestTreePath = getTreePathFromCollectionToItem(collection, item);
+  if (requestTreePath && requestTreePath.length > 0) {
+    mergeHeaders(collection, request, requestTreePath);
+    mergeScripts(collection, request, requestTreePath, scriptFlow);
+    mergeVars(collection, request, requestTreePath);
+  }
 
-  each(request.headers, (h) => {
+  each(get(request, 'headers', []), (h) => {
     if (h.enabled) {
       headers[h.name] = h.value;
       if (h.name.toLowerCase() === 'content-type') {
@@ -31,10 +31,11 @@ const prepareRequest = (request, collectionRoot) => {
     method: request.method,
     url: request.url,
     headers: headers,
-    pathParams: request?.params?.filter((param) => param.type === 'path')
+    pathParams: request?.params?.filter((param) => param.type === 'path'),
+    responseType: 'arraybuffer'
   };
 
-  const collectionAuth = get(collectionRoot, 'request.auth');
+  const collectionAuth = get(collection, 'root.request.auth');
   if (collectionAuth && request.auth.mode === 'inherit') {
     if (collectionAuth.mode === 'basic') {
       axiosRequest.auth = {
@@ -96,16 +97,10 @@ const prepareRequest = (request, collectionRoot) => {
     if (!contentTypeDefined) {
       axiosRequest.headers['content-type'] = 'application/json';
     }
-    let jsonBody;
     try {
-      jsonBody = decomment(request?.body?.json);
+      axiosRequest.data = decomment(request?.body?.json);
     } catch (error) {
-      jsonBody = request?.body?.json;
-    }
-    try {
-      axiosRequest.data = JSONbig.parse(jsonBody);
-    } catch (error) {
-      axiosRequest.data = jsonBody;
+      axiosRequest.data = request?.body?.json;
     }
   }
 
@@ -118,7 +113,7 @@ const prepareRequest = (request, collectionRoot) => {
 
   if (request.body.mode === 'xml') {
     if (!contentTypeDefined) {
-      axiosRequest.headers['content-type'] = 'text/xml';
+      axiosRequest.headers['content-type'] = 'application/xml';
     }
     axiosRequest.data = request.body.xml;
   }
@@ -137,13 +132,11 @@ const prepareRequest = (request, collectionRoot) => {
     each(enabledParams, (p) => (params[p.name] = p.value));
     axiosRequest.data = params;
   }
-
+  
   if (request.body.mode === 'multipartForm') {
     axiosRequest.headers['content-type'] = 'multipart/form-data';
-    const params = {};
     const enabledParams = filter(request.body.multipartForm, (p) => p.enabled);
-    each(enabledParams, (p) => (params[p.name] = p.value));
-    axiosRequest.data = params;
+    axiosRequest.data = enabledParams;
   }
 
   if (request.body.mode === 'graphql') {
@@ -157,10 +150,19 @@ const prepareRequest = (request, collectionRoot) => {
     axiosRequest.data = graphqlQuery;
   }
 
-  if (request.script && request.script.length) {
+  if (request.script) {
     axiosRequest.script = request.script;
   }
 
+  if (request.tests) {
+    axiosRequest.tests = request.tests;
+  }
+
+  axiosRequest.vars = request.vars;
+  axiosRequest.collectionVariables = request.collectionVariables;
+  axiosRequest.folderVariables = request.folderVariables;
+  axiosRequest.requestVariables = request.requestVariables;
+
   return axiosRequest;
 };
 

packages/bruno-cli/src/runner/run-single-request.js

@@ -19,7 +19,9 @@ const { makeAxiosInstance } = require('../utils/axios-instance');
 const { addAwsV4Interceptor, resolveAwsV4Credentials } = require('./awsv4auth-helper');
 const { shouldUseProxy, PatchedHttpsProxyAgent } = require('../utils/proxy-util');
 const path = require('path');
-const { createFormData } = require('../utils/common');
+const { parseDataFromResponse } = require('../utils/common');
+const { getCookieStringForUrl, saveCookies, shouldUseCookies } = require('../utils/cookies');
+const { createFormData } = require('../utils/form-data');
 const protocolRegex = /^([-+\w]{1,25})(:?\/\/|:)/;
 
 const onConsoleLog = (type, args) => {
@@ -35,13 +37,17 @@ const runSingleRequest = async function (
   processEnvVars,
   brunoConfig,
   collectionRoot,
-  runtime
+  runtime,
+  collection
 ) {
   try {
     let request;
     let nextRequestName;
-
-    request = prepareRequest(bruJson.request, collectionRoot);
+    let item = { 
+      pathname: path.join(collectionPath, filename),
+      ...bruJson
+    }
+    request = prepareRequest(item, collection);
 
     request.__bruno__executionMode = 'cli';
 
@@ -49,10 +55,7 @@ const runSingleRequest = async function (
     scriptingConfig.runtime = runtime;
 
     // run pre request script
-    const requestScriptFile = compact([
-      get(collectionRoot, 'request.script.req'),
-      get(bruJson, 'request.script.req')
-    ]).join(os.EOL);
+    const requestScriptFile = get(request, 'script.req');
     if (requestScriptFile?.length) {
       const scriptRuntime = new ScriptRuntime({ runtime: scriptingConfig?.runtime });
       const result = await scriptRuntime.runRequestScript(
@@ -178,6 +181,14 @@ const runSingleRequest = async function (
       });
     }
 
+    //set cookies if enabled
+    if (!options.disableCookies) {
+      const cookieString = getCookieStringForUrl(request.url);
+      if (cookieString && typeof cookieString === 'string' && cookieString.length) {
+        request.headers['cookie'] = cookieString;
+      }
+    }
+
     // stringify the request url encoded params
     if (request.headers['content-type'] === 'application/x-www-form-urlencoded') {
       request.data = qs.stringify(request.data);
@@ -217,11 +228,21 @@ const runSingleRequest = async function (
       /** @type {import('axios').AxiosResponse} */
       response = await axiosInstance(request);
 
+      const { data } = parseDataFromResponse(response, request.__brunoDisableParsingResponseJson);
+      response.data = data;
+
       // Prevents the duration on leaking to the actual result
       responseTime = response.headers.get('request-duration');
       response.headers.delete('request-duration');
+
+      //save cookies if enabled
+      if (!options.disableCookies) {
+        saveCookies(request.url, response.headers);
+      }
     } catch (err) {
       if (err?.response) {
+        const { data } = parseDataFromResponse(err?.response);
+        err.response.data = data;
         response = err.response;
 
         // Prevents the duration on leaking to the actual result
@@ -246,7 +267,7 @@ const runSingleRequest = async function (
             data: null,
             responseTime: 0
           },
-          error: err.message,
+          error: err?.message || err?.errors?.map(e => e?.message)?.at(0) || err?.code || 'Request Failed!',
           assertionResults: [],
           testResults: [],
           nextRequestName: nextRequestName
@@ -277,10 +298,7 @@ const runSingleRequest = async function (
     }
 
     // run post response script
-    const responseScriptFile = compact([
-      get(collectionRoot, 'request.script.res'),
-      get(bruJson, 'request.script.res')
-    ]).join(os.EOL);
+    const responseScriptFile = get(request, 'script.res');
     if (responseScriptFile?.length) {
       const scriptRuntime = new ScriptRuntime({ runtime: scriptingConfig?.runtime });
       const result = await scriptRuntime.runResponseScript(
@@ -325,7 +343,7 @@ const runSingleRequest = async function (
 
     // run tests
     let testResults = [];
-    const testFile = compact([get(collectionRoot, 'request.tests'), get(bruJson, 'request.tests')]).join(os.EOL);
+    const testFile = get(request, 'tests');
     if (typeof testFile === 'string') {
       const testRuntime = new TestRuntime({ runtime: scriptingConfig?.runtime });
       const result = await testRuntime.runTests(

packages/bruno-cli/src/utils/bru.js

@@ -58,7 +58,7 @@ const bruToJson = (bru) => {
         body: _.get(json, 'body', {}),
         vars: _.get(json, 'vars', []),
         assertions: _.get(json, 'assertions', []),
-        script: _.get(json, 'script', ''),
+        script: _.get(json, 'script', {}),
         tests: _.get(json, 'tests', '')
       }
     };

packages/bruno-cli/src/utils/collection.js

@@ -0,0 +1,208 @@
+const { get, each, find, compact } = require('lodash');
+const os = require('os');
+
+const mergeHeaders = (collection, request, requestTreePath) => {
+  let headers = new Map();
+
+  let collectionHeaders = get(collection, 'root.request.headers', []);
+  collectionHeaders.forEach((header) => {
+    if (header.enabled) {
+      headers.set(header.name, header.value);
+    }
+  });
+
+  for (let i of requestTreePath) {
+    if (i.type === 'folder') {
+      let _headers = get(i, 'root.request.headers', []);
+      _headers.forEach((header) => {
+        if (header.enabled) {
+          headers.set(header.name, header.value);
+        }
+      });
+    } else {
+      const _headers = i?.draft ? get(i, 'draft.request.headers', []) : get(i, 'request.headers', []);
+      _headers.forEach((header) => {
+        if (header.enabled) {
+          headers.set(header.name, header.value);
+        }
+      });
+    }
+  }
+
+  request.headers = Array.from(headers, ([name, value]) => ({ name, value, enabled: true }));
+};
+
+const mergeVars = (collection, request, requestTreePath) => {
+  let reqVars = new Map();
+  let collectionRequestVars = get(collection, 'root.request.vars.req', []);
+  let collectionVariables = {};
+  collectionRequestVars.forEach((_var) => {
+    if (_var.enabled) {
+      reqVars.set(_var.name, _var.value);
+      collectionVariables[_var.name] = _var.value;
+    }
+  });
+  let folderVariables = {};
+  let requestVariables = {};
+  for (let i of requestTreePath) {
+    if (i.type === 'folder') {
+      let vars = get(i, 'root.request.vars.req', []);
+      vars.forEach((_var) => {
+        if (_var.enabled) {
+          reqVars.set(_var.name, _var.value);
+          folderVariables[_var.name] = _var.value;
+        }
+      });
+    } else {
+      const vars = i?.draft ? get(i, 'draft.request.vars.req', []) : get(i, 'request.vars.req', []);
+      vars.forEach((_var) => {
+        if (_var.enabled) {
+          reqVars.set(_var.name, _var.value);
+          requestVariables[_var.name] = _var.value;
+        }
+      });
+    }
+  }
+
+  request.collectionVariables = collectionVariables;
+  request.folderVariables = folderVariables;
+  request.requestVariables = requestVariables;
+
+  if(request?.vars) {
+    request.vars.req = Array.from(reqVars, ([name, value]) => ({
+      name,
+      value,
+      enabled: true,
+      type: 'request'
+    }));
+  }
+
+  let resVars = new Map();
+  let collectionResponseVars = get(collection, 'root.request.vars.res', []);
+  collectionResponseVars.forEach((_var) => {
+    if (_var.enabled) {
+      resVars.set(_var.name, _var.value);
+    }
+  });
+  for (let i of requestTreePath) {
+    if (i.type === 'folder') {
+      let vars = get(i, 'root.request.vars.res', []);
+      vars.forEach((_var) => {
+        if (_var.enabled) {
+          resVars.set(_var.name, _var.value);
+        }
+      });
+    } else {
+      const vars = i?.draft ? get(i, 'draft.request.vars.res', []) : get(i, 'request.vars.res', []);
+      vars.forEach((_var) => {
+        if (_var.enabled) {
+          resVars.set(_var.name, _var.value);
+        }
+      });
+    }
+  }
+
+  if(request?.vars) {
+    request.vars.res = Array.from(resVars, ([name, value]) => ({
+      name,
+      value,
+      enabled: true,
+      type: 'response'
+    }));
+  }
+};
+
+const mergeScripts = (collection, request, requestTreePath, scriptFlow) => {
+  let collectionPreReqScript = get(collection, 'root.request.script.req', '');
+  let collectionPostResScript = get(collection, 'root.request.script.res', '');
+  let collectionTests = get(collection, 'root.request.tests', '');
+
+  let combinedPreReqScript = [];
+  let combinedPostResScript = [];
+  let combinedTests = [];
+  for (let i of requestTreePath) {
+    if (i.type === 'folder') {
+      let preReqScript = get(i, 'root.request.script.req', '');
+      if (preReqScript && preReqScript.trim() !== '') {
+        combinedPreReqScript.push(preReqScript);
+      }
+
+      let postResScript = get(i, 'root.request.script.res', '');
+      if (postResScript && postResScript.trim() !== '') {
+        combinedPostResScript.push(postResScript);
+      }
+
+      let tests = get(i, 'root.request.tests', '');
+      if (tests && tests?.trim?.() !== '') {
+        combinedTests.push(tests);
+      }
+    }
+  }
+
+  request.script.req = compact([collectionPreReqScript, ...combinedPreReqScript, request?.script?.req || '']).join(os.EOL);
+
+  if (scriptFlow === 'sequential') {
+    request.script.res = compact([collectionPostResScript, ...combinedPostResScript, request?.script?.res || '']).join(os.EOL);
+  } else {
+    request.script.res = compact([request?.script?.res || '', ...combinedPostResScript.reverse(), collectionPostResScript]).join(os.EOL);
+  }
+
+  if (scriptFlow === 'sequential') {
+    request.tests = compact([collectionTests, ...combinedTests, request?.tests || '']).join(os.EOL);
+  } else {
+    request.tests = compact([request?.tests || '', ...combinedTests.reverse(), collectionTests]).join(os.EOL);
+  }
+};
+
+const findItem = (items = [], pathname) => {
+  return find(items, (i) => i.pathname === pathname);
+};
+
+const findItemInCollection = (collection, pathname) => {
+  let flattenedItems = flattenItems(collection.items);
+
+  return findItem(flattenedItems, pathname);
+};
+
+const findParentItemInCollection = (collection, pathname) => {
+  let flattenedItems = flattenItems(collection.items);
+
+  return find(flattenedItems, (item) => {
+    return item.items && find(item.items, (i) => i.pathname === pathname);
+  });
+};
+
+const flattenItems = (items = []) => {
+  const flattenedItems = [];
+
+  const flatten = (itms, flattened) => {
+    each(itms, (i) => {
+      flattened.push(i);
+
+      if (i.items && i.items.length) {
+        flatten(i.items, flattened);
+      }
+    });
+  };
+
+  flatten(items, flattenedItems);
+
+  return flattenedItems;
+};
+
+const getTreePathFromCollectionToItem = (collection, _item) => {
+  let path = [];
+  let item = findItemInCollection(collection, _item.pathname);
+  while (item) {
+    path.unshift(item);
+    item = findParentItemInCollection(collection, item.pathname);
+  }
+  return path;
+};
+
+module.exports = {
+  mergeHeaders,
+  mergeVars,
+  mergeScripts,
+  getTreePathFromCollectionToItem
+}

packages/bruno-cli/src/utils/common.js

@@ -2,6 +2,7 @@ const fs = require('fs');
 const FormData = require('form-data');
 const { forOwn } = require('lodash');
 const path = require('path');
+const iconv = require('iconv-lite');
 
 const lpad = (str, width) => {
   let paddedStr = str;
@@ -19,33 +20,34 @@ const rpad = (str, width) => {
   return paddedStr;
 };
 
-const createFormData = (datas, collectionPath) => {
-  // make axios work in node using form data
-  // reference: https://github.com/axios/axios/issues/1006#issuecomment-320165427
-  const form = new FormData();
-  forOwn(datas, (value, key) => {
-    if (typeof value == 'string') {
-      form.append(key, value);
-      return;
+const parseDataFromResponse = (response, disableParsingResponseJson = false) => {
+  // Parse the charset from content type: https://stackoverflow.com/a/33192813
+  const charsetMatch = /charset=([^()<>@,;:"/[\]?.=\s]*)/i.exec(response.headers['content-type'] || '');
+  // https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/RegExp/exec#using_exec_with_regexp_literals
+  const charsetValue = charsetMatch?.[1];
+  const dataBuffer = Buffer.from(response.data);
+  // Overwrite the original data for backwards compatibility
+  let data;
+  if (iconv.encodingExists(charsetValue)) {
+    data = iconv.decode(dataBuffer, charsetValue);
+  } else {
+    data = iconv.decode(dataBuffer, 'utf-8');
+  }
+  // Try to parse response to JSON, this can quietly fail
+  try {
+    // Filter out ZWNBSP character
+    // https://gist.github.com/antic183/619f42b559b78028d1fe9e7ae8a1352d
+    data = data.replace(/^\uFEFF/, '');
+    if (!disableParsingResponseJson) {
+      data = JSON.parse(data);
     }
+  } catch { }
 
-    const filePaths = value || [];
-    filePaths?.forEach?.((filePath) => {
-      let trimmedFilePath = filePath.trim();
-
-      if (!path.isAbsolute(trimmedFilePath)) {
-        trimmedFilePath = path.join(collectionPath, trimmedFilePath);
-      }
-
-      form.append(key, fs.createReadStream(trimmedFilePath), path.basename(trimmedFilePath));
-    });
-  });
-  return form;
+  return { data, dataBuffer };
 };
 
-
 module.exports = {
   lpad,
   rpad,
-  createFormData
+  parseDataFromResponse
 };

packages/bruno-cli/src/utils/cookies.js

@@ -0,0 +1,100 @@
+const { Cookie, CookieJar } = require('tough-cookie');
+const each = require('lodash/each');
+
+const cookieJar = new CookieJar();
+
+const addCookieToJar = (setCookieHeader, requestUrl) => {
+  const cookie = Cookie.parse(setCookieHeader, { loose: true });
+  cookieJar.setCookieSync(cookie, requestUrl, {
+    ignoreError: true // silently ignore things like parse errors and invalid domains
+  });
+};
+
+const getCookiesForUrl = (url) => {
+  return cookieJar.getCookiesSync(url);
+};
+
+const getCookieStringForUrl = (url) => {
+  const cookies = getCookiesForUrl(url);
+
+  if (!Array.isArray(cookies) || !cookies.length) {
+    return '';
+  }
+
+  const validCookies = cookies.filter((cookie) => !cookie.expires || cookie.expires > Date.now());
+
+  return validCookies.map((cookie) => cookie.cookieString()).join('; ');
+};
+
+const getDomainsWithCookies = () => {
+  return new Promise((resolve, reject) => {
+    const domainCookieMap = {};
+
+    cookieJar.store.getAllCookies((err, cookies) => {
+      if (err) {
+        return reject(err);
+      }
+
+      cookies.forEach((cookie) => {
+        if (!domainCookieMap[cookie.domain]) {
+          domainCookieMap[cookie.domain] = [cookie];
+        } else {
+          domainCookieMap[cookie.domain].push(cookie);
+        }
+      });
+
+      const domains = Object.keys(domainCookieMap);
+      const domainsWithCookies = [];
+
+      each(domains, (domain) => {
+        const cookies = domainCookieMap[domain];
+        const validCookies = cookies.filter((cookie) => !cookie.expires || cookie.expires > Date.now());
+
+        if (validCookies.length) {
+          domainsWithCookies.push({
+            domain,
+            cookies: validCookies,
+            cookieString: validCookies.map((cookie) => cookie.cookieString()).join('; ')
+          });
+        }
+      });
+
+      resolve(domainsWithCookies);
+    });
+  });
+};
+
+const deleteCookiesForDomain = (domain) => {
+  return new Promise((resolve, reject) => {
+    cookieJar.store.removeCookies(domain, null, (err) => {
+      if (err) {
+        return reject(err);
+      }
+
+      return resolve();
+    });
+  });
+};
+
+const saveCookies = (url, headers) => {
+  let setCookieHeaders = [];
+  if (headers['set-cookie']) {
+    setCookieHeaders = Array.isArray(headers['set-cookie'])
+      ? headers['set-cookie']
+      : [headers['set-cookie']];
+    for (let setCookieHeader of setCookieHeaders) {
+      if (typeof setCookieHeader === 'string' && setCookieHeader.length) {
+        addCookieToJar(setCookieHeader, url);
+      }
+    }
+  }
+}
+
+module.exports = {
+  addCookieToJar,
+  getCookiesForUrl,
+  getCookieStringForUrl,
+  getDomainsWithCookies,
+  deleteCookiesForDomain,
+  saveCookies
+};

packages/bruno-cli/src/utils/form-data.js

@@ -0,0 +1,42 @@
+const { forEach } = require('lodash');
+const FormData = require('form-data');
+const fs = require('fs');
+const path = require('path');
+
+const createFormData = (data, collectionPath) => {
+  // make axios work in node using form data
+  // reference: https://github.com/axios/axios/issues/1006#issuecomment-320165427
+  const form = new FormData();
+  forEach(data, (datum) => {
+    const { name, type, value, contentType } = datum;
+    let options = {};
+    if (contentType) {
+      options.contentType = contentType;
+    }
+    if (type === 'text') {
+      if (Array.isArray(value)) {
+        value.forEach((val) => form.append(name, val, options));
+      } else {
+        form.append(name, value, options);
+      }
+      return;
+    }
+
+    if (type === 'file') {
+      const filePaths = value || [];
+      filePaths.forEach((filePath) => {
+        let trimmedFilePath = filePath.trim();
+        if (!path.isAbsolute(trimmedFilePath)) {
+          trimmedFilePath = path.join(collectionPath, trimmedFilePath);
+        }
+        options.filename = path.basename(trimmedFilePath);
+        form.append(name, fs.createReadStream(trimmedFilePath), options);
+      });
+    }
+  });
+  return form;
+};
+
+module.exports = {
+  createFormData
+}

packages/bruno-cli/tests/runner/prepare-request.spec.js

@@ -6,15 +6,19 @@ describe('prepare-request: prepareRequest', () => {
   describe('Decomments request body', () => {
     it('If request body is valid JSON', async () => {
       const body = { mode: 'json', json: '{\n"test": "{{someVar}}" // comment\n}' };
-      const expected = { test: '{{someVar}}' };
-      const result = prepareRequest({ body });
+      const expected = `{
+\"test\": \"{{someVar}}\" 
+}`;
+      const result = prepareRequest({ request: { body } });
       expect(result.data).toEqual(expected);
     });
 
     it('If request body is not valid JSON', async () => {
       const body = { mode: 'json', json: '{\n"test": {{someVar}} // comment\n}' };
-      const expected = '{\n"test": {{someVar}} \n}';
-      const result = prepareRequest({ body });
+      const expected = `{
+\"test\": {{someVar}} 
+}`;
+      const result = prepareRequest({ request: { body } });
       expect(result.data).toEqual(expected);
     });
   });

packages/bruno-electron/package.json

@@ -1,5 +1,5 @@
 {
-  "version": "v1.34.2",
+  "version": "v1.36.0",
   "name": "bruno",
   "description": "Opensource API Client for Exploring and Testing APIs",
   "homepage": "https://www.usebruno.com",

packages/bruno-electron/src/app/watcher.js

@@ -2,7 +2,7 @@ const _ = require('lodash');
 const fs = require('fs');
 const path = require('path');
 const chokidar = require('chokidar');
-const { hasBruExtension } = require('../utils/filesystem');
+const { hasBruExtension, isWSLPath, normalizeAndResolvePath, normalizeWslPath } = require('../utils/filesystem');
 const { bruToEnvJson, bruToJson, collectionBruToJson } = require('../bru');
 const { dotenvToJson } = require('@usebruno/lang');
 
@@ -389,6 +389,8 @@ const change = async (win, pathname, collectionUid, collectionPath) => {
 };
 
 const unlink = (win, pathname, collectionUid, collectionPath) => {
+  console.log(`watcher unlink: ${pathname}`);
+
   if (isBruEnvironmentConfig(pathname, collectionPath)) {
     return unlinkEnvironmentFile(win, pathname, collectionUid);
   }
@@ -445,11 +447,11 @@ class Watcher {
         ignoreInitial: false,
         usePolling: watchPath.startsWith('\\\\') || forcePolling ? true : false,
         ignored: (filepath) => {
-          const normalizedPath = filepath.replace(/\\/g, '/');
+          const normalizedPath = isWSLPath(filepath) ? normalizeWslPath(filepath) : normalizeAndResolvePath(filepath);
           const relativePath = path.relative(watchPath, normalizedPath);
 
           return ignores.some((ignorePattern) => {
-            const normalizedIgnorePattern = ignorePattern.replace(/\\/g, '/');
+            const normalizedIgnorePattern = isWSLPath(ignorePattern) ? normalizeWslPath(ignorePattern) : ignorePattern.replace(/\\/g, '/');
             return relativePath === normalizedIgnorePattern || relativePath.startsWith(normalizedIgnorePattern);
           });
         },
@@ -506,6 +508,33 @@ class Watcher {
       this.watchers[watchPath] = null;
     }
   }
+
+  getWatcherByItemPath(itemPath) {
+    const paths = Object.keys(this.watchers);
+
+    const watcherPath = paths?.find(collectionPath => {
+      const absCollectionPath = path.resolve(collectionPath);
+      const absItemPath = path.resolve(itemPath);
+
+      return absItemPath.startsWith(absCollectionPath);
+    });
+
+    return watcherPath ? this.watchers[watcherPath] : null;
+  }
+
+  unlinkItemPathInWatcher(itemPath) {
+    const watcher = this.getWatcherByItemPath(itemPath);
+    if (watcher) {
+      watcher.unwatch(itemPath);
+    }
+  }
+  
+  addItemPathInWatcher(itemPath) {
+    const watcher = this.getWatcherByItemPath(itemPath);
+    if (watcher && !watcher?.has?.(itemPath)) {
+      watcher?.add?.(itemPath);
+    }
+  }
 }
 
 module.exports = Watcher;

packages/bruno-electron/src/ipc/collection.js

@@ -1,5 +1,7 @@
 const _ = require('lodash');
 const fs = require('fs');
+const fsExtra = require('fs-extra');
+const os = require('os');
 const path = require('path');
 const { ipcMain, shell, dialog, app } = require('electron');
 const { envJsonToBru, bruToJson, jsonToBru, jsonToCollectionBru } = require('../bru');
@@ -17,7 +19,11 @@ const {
   isWSLPath,
   normalizeWslPath,
   normalizeAndResolvePath,
-  safeToRename
+  safeToRename,
+  sanitizeCollectionName,
+  isWindowsOS,
+  isValidFilename,
+  hasSubDirectories,
 } = require('../utils/filesystem');
 const { openCollectionDialog } = require('../app/collections');
 const { generateUidBasedOnHash, stringifyJson, safeParseJSON, safeStringifyJSON } = require('../utils/common');
@@ -63,6 +69,8 @@ const registerRendererEventHandlers = (mainWindow, watcher, lastOpenedCollection
     'renderer:create-collection',
     async (event, collectionName, collectionFolderName, collectionLocation) => {
       try {
+        collectionFolderName = sanitizeDirectoryName(collectionFolderName);
+        collectionName = sanitizeCollectionName(collectionName);
         const dirPath = path.join(collectionLocation, collectionFolderName);
         if (fs.existsSync(dirPath)) {
           const files = fs.readdirSync(dirPath);
@@ -71,9 +79,8 @@ const registerRendererEventHandlers = (mainWindow, watcher, lastOpenedCollection
             throw new Error(`collection: ${dirPath} already exists and is not empty`);
           }
         }
-
-        if (!isValidPathname(dirPath)) {
-          throw new Error(`collection: invalid pathname - ${dir}`);
+        if (!isValidPathname(path.basename(dirPath))) {
+          throw new Error(`collection: invalid pathname - ${dirPath}`);
         }
 
         if (!fs.existsSync(dirPath)) {
@@ -101,13 +108,14 @@ const registerRendererEventHandlers = (mainWindow, watcher, lastOpenedCollection
   ipcMain.handle(
     'renderer:clone-collection',
     async (event, collectionName, collectionFolderName, collectionLocation, previousPath) => {
+      collectionFolderName = sanitizeCollectionName(collectionFolderName);
       const dirPath = path.join(collectionLocation, collectionFolderName);
       if (fs.existsSync(dirPath)) {
         throw new Error(`collection: ${dirPath} already exists`);
       }
 
-      if (!isValidPathname(dirPath)) {
-        throw new Error(`collection: invalid pathname - ${dir}`);
+      if (!isValidPathname(path.basename(dirPath))) {
+        throw new Error(`collection: invalid pathname - ${dirPath}`);
       }
 
       // create dir
@@ -146,6 +154,7 @@ const registerRendererEventHandlers = (mainWindow, watcher, lastOpenedCollection
   // rename collection
   ipcMain.handle('renderer:rename-collection', async (event, newName, collectionPathname) => {
     try {
+      newName = sanitizeCollectionName(newName);
       const brunoJsonFilePath = path.join(collectionPathname, 'bruno.json');
       const content = fs.readFileSync(brunoJsonFilePath, 'utf8');
       const json = JSON.parse(content);
@@ -201,7 +210,9 @@ const registerRendererEventHandlers = (mainWindow, watcher, lastOpenedCollection
       if (fs.existsSync(pathname)) {
         throw new Error(`path: ${pathname} already exists`);
       }
-
+      if (!isValidFilename(request.name)) {
+        throw new Error(`path: ${request.name}.bru is not a valid filename`);
+      }
       const content = jsonToBru(request);
       await writeFile(pathname, content);
     } catch (error) {
@@ -337,6 +348,12 @@ const registerRendererEventHandlers = (mainWindow, watcher, lastOpenedCollection
 
   // rename item
   ipcMain.handle('renderer:rename-item', async (event, oldPath, newPath, newName) => {
+    const tempDir = path.join(os.tmpdir(), `temp-folder-${Date.now()}`);
+    // const parentDir = path.dirname(oldPath);
+    const isWindowsOSAndNotWSLAndItemHasSubDirectories = isDirectory(oldPath) && isWindowsOS() && !isWSLPath(oldPath) && hasSubDirectories(oldPath);
+    // let parentDirUnwatched = false;
+    // let parentDirRewatched = false;
+
     try {
       // Normalize paths if they are WSL paths
       oldPath = isWSLPath(oldPath) ? normalizeWslPath(oldPath) : normalizeAndResolvePath(oldPath);
@@ -358,33 +375,80 @@ const registerRendererEventHandlers = (mainWindow, watcher, lastOpenedCollection
           const newBruFilePath = bruFile.replace(oldPath, newPath);
           moveRequestUid(bruFile, newBruFilePath);
         }
-        return fs.renameSync(oldPath, newPath);
+
+        // watcher.unlinkItemPathInWatcher(parentDir);
+        // parentDirUnwatched = true;
+
+        /**
+         * If it is windows OS
+         * And it is not WSL path (meaning its not linux running on windows using WSL)
+         * And it has sub directories
+         * Only then we need to use the temp dir approach to rename the folder
+         * 
+         * Windows OS would sometimes throw error when renaming a folder with sub directories
+         * This is a alternative approach to avoid that error
+         */
+        if (isWindowsOSAndNotWSLAndItemHasSubDirectories) {
+          await fsExtra.copy(oldPath, tempDir);
+          await fsExtra.remove(oldPath);
+          await fsExtra.move(tempDir, newPath, { overwrite: true });
+          await fsExtra.remove(tempDir);
+        } else {
+          await fs.renameSync(oldPath, newPath);
+        }
+        // watcher.addItemPathInWatcher(parentDir);
+        // parentDirRewatched = true;
+
+        return newPath;
       }
 
-      const isBru = hasBruExtension(oldPath);
-      if (!isBru) {
+      if (!hasBruExtension(oldPath)) {
         throw new Error(`path: ${oldPath} is not a bru file`);
       }
 
-      // update name in file and save new copy, then delete old copy
-      const data = fs.readFileSync(oldPath, 'utf8');
-      const jsonData = bruToJson(data);
+      if (!isValidFilename(newName)) {
+        throw new Error(`path: ${newName} is not a valid filename`);
+      }
 
+      // update name in file and save new copy, then delete old copy
+      const data = await fs.promises.readFile(oldPath, 'utf8'); // Use async read
+      const jsonData = bruToJson(data);
       jsonData.name = newName;
       moveRequestUid(oldPath, newPath);
 
       const content = jsonToBru(jsonData);
-      await fs.unlinkSync(oldPath);
+      await fs.promises.unlink(oldPath);
       await writeFile(newPath, content);
 
       return newPath;
     } catch (error) {
+      // in case an error occurs during the rename file operations after unlinking the parent dir
+      // and the rewatch fails, we need to add it back to watcher
+      // if (parentDirUnwatched && !parentDirRewatched) {
+      //   watcher.addItemPathInWatcher(parentDir);
+      // }
+
+      // in case the rename file operations fails, and we see that the temp dir exists
+      // and the old path does not exist, we need to restore the data from the temp dir to the old path
+      if (isWindowsOSAndNotWSLAndItemHasSubDirectories) {
+        if (fsExtra.pathExistsSync(tempDir) && !fsExtra.pathExistsSync(oldPath)) {
+          try {
+            await fsExtra.copy(tempDir, oldPath);
+            await fsExtra.remove(tempDir);
+          } catch (err) {
+            console.error("Failed to restore data to the old path:", err);
+          }
+        }
+      }
+
       return Promise.reject(error);
     }
   });
 
   // new folder
   ipcMain.handle('renderer:new-folder', async (event, pathname) => {
+    const resolvedFolderName = sanitizeDirectoryName(path.basename(pathname));
+    pathname = path.join(path.dirname(pathname), resolvedFolderName);
     try {
       if (!fs.existsSync(pathname)) {
         fs.mkdirSync(pathname);
@@ -443,7 +507,7 @@ const registerRendererEventHandlers = (mainWindow, watcher, lastOpenedCollection
 
   ipcMain.handle('renderer:import-collection', async (event, collection, collectionLocation) => {
     try {
-      let collectionName = sanitizeDirectoryName(collection.name);
+      let collectionName = sanitizeCollectionName(collection.name);
       let collectionPath = path.join(collectionLocation, collectionName);
 
       if (fs.existsSync(collectionPath)) {
@@ -459,6 +523,7 @@ const registerRendererEventHandlers = (mainWindow, watcher, lastOpenedCollection
             fs.writeFileSync(filePath, content);
           }
           if (item.type === 'folder') {
+            item.name = sanitizeDirectoryName(item.name);
             const folderPath = path.join(currentPath, item.name);
             fs.mkdirSync(folderPath);
 

packages/bruno-electron/src/ipc/network/index.js

@@ -38,7 +38,7 @@ const {
 const Oauth2Store = require('../../store/oauth2');
 const iconv = require('iconv-lite');
 const FormData = require('form-data');
-const { createFormData } = prepareRequest;
+const { createFormData } = require('../../utils/form-data');
 
 const safeStringifyJSON = (data) => {
   try {
@@ -365,11 +365,15 @@ const parseDataFromResponse = (response, disableParsingResponseJson = false) =>
   try {
     // Filter out ZWNBSP character
     // https://gist.github.com/antic183/619f42b559b78028d1fe9e7ae8a1352d
+
+    // If the response is a string and starts and ends with double quotes, it's a stringified JSON and should not be parsed
     data = data.replace(/^\uFEFF/, '');
-    if (!disableParsingResponseJson) {
+    if ( !disableParsingResponseJson && ! (typeof data === 'string' && data.startsWith("\"") && data.endsWith("\""))) {
       data = JSON.parse(data);
     }
-  } catch { }
+  } catch { 
+    console.log('Failed to parse response data as JSON');
+   }
 
   return { data, dataBuffer };
 };
@@ -397,7 +401,7 @@ const registerNetworkIpc = (mainWindow) => {
   ) => {
     // run pre-request script
     let scriptResult;
-    const requestScript = compact([get(collectionRoot, 'request.script.req'), get(request, 'script.req')]).join(os.EOL);
+    const requestScript = get(request, 'script.req');
     if (requestScript?.length) {
       const scriptRuntime = new ScriptRuntime({ runtime: scriptingConfig?.runtime });
       scriptResult = await scriptRuntime.runRequestScript(
@@ -493,12 +497,7 @@ const registerNetworkIpc = (mainWindow) => {
     }
 
     // run post-response script
-    const responseScript = compact(scriptingConfig.flow === 'sequential' ? [
-      get(collectionRoot, 'request.script.res'), get(request, 'script.res')
-    ] : [
-      get(request, 'script.res'), get(collectionRoot, 'request.script.res')
-    ]).join(os.EOL);
-
+    const responseScript = get(request, 'script.res');
     let scriptResult;
     if (responseScript?.length) {
       const scriptRuntime = new ScriptRuntime({ runtime: scriptingConfig?.runtime });
@@ -675,14 +674,7 @@ const registerNetworkIpc = (mainWindow) => {
         });
       }
 
-      // run tests
-      const testScript = item.draft ? get(item.draft, 'request.tests') : get(item, 'request.tests');
-      const testFile = compact(scriptingConfig.flow === 'sequential' ? [
-        get(collectionRoot, 'request.tests'), testScript,
-      ] : [
-        testScript, get(collectionRoot, 'request.tests')
-      ]).join(os.EOL);
-
+      const testFile = get(request, 'tests');
       if (typeof testFile === 'string') {
         const testRuntime = new TestRuntime({ runtime: scriptingConfig?.runtime });
         const testResults = await testRuntime.runTests(
@@ -1147,14 +1139,7 @@ const registerNetworkIpc = (mainWindow) => {
               });
             }
 
-            // run tests
-            const testScript = item.draft ? get(item.draft, 'request.tests') : get(item, 'request.tests');
-            const testFile = compact(scriptingConfig.flow === 'sequential' ? [
-              get(collectionRoot, 'request.tests'), testScript
-            ] : [
-              testScript, get(collectionRoot, 'request.tests')
-            ]).join(os.EOL);
-
+            const testFile = get(request, 'tests');
             if (typeof testFile === 'string') {
               const testRuntime = new TestRuntime({ runtime: scriptingConfig?.runtime });
               const testResults = await testRuntime.runTests(

packages/bruno-electron/src/ipc/network/interpolate-vars.js

@@ -86,11 +86,12 @@ const interpolateVars = (request, envVariables = {}, runtimeVariables = {}, proc
       } catch (err) {}
     }
   } else if (contentType === 'multipart/form-data') {
-    if (typeof request.data === 'object' && !(request.data instanceof FormData)) {
+    if (Array.isArray(request?.data) && !(request.data instanceof FormData)) {
       try {
-        forOwn(request?.data, (value, key) => {
-          request.data[key] = _interpolate(value);
-        });        
+        request.data = request?.data?.map(d => ({
+          ...d,
+          value: _interpolate(d?.value)
+        }));   
       } catch (err) {}
     }
   } else {

packages/bruno-electron/src/ipc/network/prepare-request.js

@@ -1,194 +1,8 @@
-const os = require('os');
-const { get, each, filter, compact, forOwn } = require('lodash');
+const { get, each, filter } = require('lodash');
 const decomment = require('decomment');
-const FormData = require('form-data');
-const fs = require('fs');
-const path = require('path');
 const crypto = require('node:crypto');
-const { getTreePathFromCollectionToItem } = require('../../utils/collection');
-const { buildFormUrlEncodedPayload } = require('../../utils/common');
-
-const mergeFolderLevelHeaders = (request, requestTreePath) => {
-  let folderHeaders = new Map();
-
-  for (let i of requestTreePath) {
-    if (i.type === 'folder') {
-      let headers = get(i, 'root.request.headers', []);
-      headers.forEach((header) => {
-        if (header.enabled) {
-          folderHeaders.set(header.name, header.value);
-        }
-      });
-    } else if (i.uid === request.uid) {
-      const headers = i?.draft ? get(i, 'draft.request.headers', []) : get(i, 'request.headers', []);
-      headers.forEach((header) => {
-        if (header.enabled) {
-          folderHeaders.set(header.name, header.value);
-        }
-      });
-    }
-  }
-
-  let mergedFolderHeaders = Array.from(folderHeaders, ([name, value]) => ({ name, value, enabled: true }));
-  let requestHeaders = request.headers || [];
-  let requestHeadersMap = new Map();
-
-  for (let header of requestHeaders) {
-    if (header.enabled) {
-      requestHeadersMap.set(header.name, header.value);
-    }
-  }
-
-  mergedFolderHeaders.forEach((header) => {
-    requestHeadersMap.set(header.name, header.value);
-  });
-
-  request.headers = Array.from(requestHeadersMap, ([name, value]) => ({ name, value, enabled: true }));
-};
-
-const mergeVars = (collection, request, requestTreePath) => {
-  let reqVars = new Map();
-  let collectionRequestVars = get(collection, 'root.request.vars.req', []);
-  let collectionVariables = {};
-  collectionRequestVars.forEach((_var) => {
-    if (_var.enabled) {
-      reqVars.set(_var.name, _var.value);
-      collectionVariables[_var.name] = _var.value;
-    }
-  });
-  let folderVariables = {};
-  let requestVariables = {};
-  for (let i of requestTreePath) {
-    if (i.type === 'folder') {
-      let vars = get(i, 'root.request.vars.req', []);
-      vars.forEach((_var) => {
-        if (_var.enabled) {
-          reqVars.set(_var.name, _var.value);
-          folderVariables[_var.name] = _var.value;
-        }
-      });
-    } else {
-      const vars = i?.draft ? get(i, 'draft.request.vars.req', []) : get(i, 'request.vars.req', []);
-      vars.forEach((_var) => {
-        if (_var.enabled) {
-          reqVars.set(_var.name, _var.value);
-          requestVariables[_var.name] = _var.value;
-        }
-      });
-    }
-  }
-
-  request.collectionVariables = collectionVariables;
-  request.folderVariables = folderVariables;
-  request.requestVariables = requestVariables;
-
-  request.vars.req = Array.from(reqVars, ([name, value]) => ({
-    name,
-    value,
-    enabled: true,
-    type: 'request'
-  }));
-
-  let resVars = new Map();
-  let collectionResponseVars = get(collection, 'root.request.vars.res', []);
-  collectionResponseVars.forEach((_var) => {
-    if (_var.enabled) {
-      resVars.set(_var.name, _var.value);
-    }
-  });
-  for (let i of requestTreePath) {
-    if (i.type === 'folder') {
-      let vars = get(i, 'root.request.vars.res', []);
-      vars.forEach((_var) => {
-        if (_var.enabled) {
-          resVars.set(_var.name, _var.value);
-        }
-      });
-    } else {
-      const vars = i?.draft ? get(i, 'draft.request.vars.res', []) : get(i, 'request.vars.res', []);
-      vars.forEach((_var) => {
-        if (_var.enabled) {
-          resVars.set(_var.name, _var.value);
-        }
-      });
-    }
-  }
-
-  request.vars.res = Array.from(resVars, ([name, value]) => ({
-    name,
-    value,
-    enabled: true,
-    type: 'response'
-  }));
-};
-
-const mergeFolderLevelScripts = (request, requestTreePath, scriptFlow) => {
-  let folderCombinedPreReqScript = [];
-  let folderCombinedPostResScript = [];
-  let folderCombinedTests = [];
-  for (let i of requestTreePath) {
-    if (i.type === 'folder') {
-      let preReqScript = get(i, 'root.request.script.req', '');
-      if (preReqScript && preReqScript.trim() !== '') {
-        folderCombinedPreReqScript.push(preReqScript);
-      }
-
-      let postResScript = get(i, 'root.request.script.res', '');
-      if (postResScript && postResScript.trim() !== '') {
-        folderCombinedPostResScript.push(postResScript);
-      }
-
-      let tests = get(i, 'root.request.tests', '');
-      if (tests && tests?.trim?.() !== '') {
-        folderCombinedTests.push(tests);
-      }
-    }
-  }
-
-  if (folderCombinedPreReqScript.length) {
-    request.script.req = compact([...folderCombinedPreReqScript, request?.script?.req || '']).join(os.EOL);
-  }
-
-  if (folderCombinedPostResScript.length) {
-    if (scriptFlow === 'sequential') {
-      request.script.res = compact([...folderCombinedPostResScript, request?.script?.res || '']).join(os.EOL);
-    } else {
-      request.script.res = compact([request?.script?.res || '', ...folderCombinedPostResScript.reverse()]).join(os.EOL);
-    }
-  }
-
-  if (folderCombinedTests.length) {
-    if (scriptFlow === 'sequential') {
-      request.tests = compact([...folderCombinedTests, request?.tests || '']).join(os.EOL);
-    } else {
-      request.tests = compact([request?.tests || '', ...folderCombinedTests.reverse()]).join(os.EOL);
-    }
-  }
-};
-
-const createFormData = (datas, collectionPath) => {
-  // make axios work in node using form data
-  // reference: https://github.com/axios/axios/issues/1006#issuecomment-320165427
-  const form = new FormData();
-  forOwn(datas, (value, key) => {
-    if (typeof value == 'string') {
-      form.append(key, value);
-      return;
-    }
-
-    const filePaths = value || [];
-    filePaths?.forEach?.((filePath) => {
-      let trimmedFilePath = filePath.trim();
-
-      if (!path.isAbsolute(trimmedFilePath)) {
-        trimmedFilePath = path.join(collectionPath, trimmedFilePath);
-      }
-
-      form.append(key, fs.createReadStream(trimmedFilePath), path.basename(trimmedFilePath));
-    });
-  });
-  return form;
-};
+const { getTreePathFromCollectionToItem, mergeHeaders, mergeScripts, mergeVars } = require('../../utils/collection');
+const { buildFormUrlEncodedPayload, createFormData } = require('../../utils/form-data');
 
 const setAuthHeaders = (axiosRequest, request, collectionRoot) => {
   const collectionAuth = get(collectionRoot, 'request.auth');
@@ -352,29 +166,25 @@ const prepareRequest = (item, collection) => {
   const headers = {};
   let contentTypeDefined = false;
   let url = request.url;
-
-  // Collection level headers
+  
   each(get(collectionRoot, 'request.headers', []), (h) => {
-    if (h.enabled && h.name.length > 0) {
-      headers[h.name] = h.value;
-      if (h.name.toLowerCase() === 'content-type') {
-        contentTypeDefined = true;
-      }
+    if (h.enabled && h.name?.toLowerCase() === 'content-type') {
+      contentTypeDefined = true;
+      return false;
     }
   });
-
-  // scriptFlow is either "sandwich" or "sequential"
+  
   const scriptFlow = collection.brunoConfig?.scripts?.flow ?? 'sandwich';
   const requestTreePath = getTreePathFromCollectionToItem(collection, item);
   if (requestTreePath && requestTreePath.length > 0) {
-    mergeFolderLevelHeaders(request, requestTreePath);
-    mergeFolderLevelScripts(request, requestTreePath, scriptFlow);
+    mergeHeaders(collection, request, requestTreePath);
+    mergeScripts(collection, request, requestTreePath, scriptFlow);
     mergeVars(collection, request, requestTreePath);
     request.globalEnvironmentVariables = collection?.globalEnvironmentVariables;
   }
 
-  // Request level headers
-  each(request.headers, (h) => {
+
+  each(get(request, 'headers', []), (h) => {
     if (h.enabled && h.name.length > 0) {
       headers[h.name] = h.value;
       if (h.name.toLowerCase() === 'content-type') {
@@ -414,7 +224,7 @@ const prepareRequest = (item, collection) => {
 
   if (request.body.mode === 'xml') {
     if (!contentTypeDefined) {
-      axiosRequest.headers['content-type'] = 'text/xml';
+      axiosRequest.headers['content-type'] = 'application/xml';
     }
     axiosRequest.data = request.body.xml;
   }
@@ -435,11 +245,11 @@ const prepareRequest = (item, collection) => {
   }
 
   if (request.body.mode === 'multipartForm') {
-    axiosRequest.headers['content-type'] = 'multipart/form-data';
-    const params = {};
+    if (!contentTypeDefined) {
+      axiosRequest.headers['content-type'] = 'multipart/form-data';
+    }
     const enabledParams = filter(request.body.multipartForm, (p) => p.enabled);
-    each(enabledParams, (p) => (params[p.name] = p.value));
-    axiosRequest.data = params;
+    axiosRequest.data = enabledParams;
   }
 
   if (request.body.mode === 'graphql') {
@@ -458,6 +268,10 @@ const prepareRequest = (item, collection) => {
     axiosRequest.script = request.script;
   }
 
+  if (request.tests) {
+    axiosRequest.tests = request.tests;
+  }
+
   axiosRequest.vars = request.vars;
   axiosRequest.collectionVariables = request.collectionVariables;
   axiosRequest.folderVariables = request.folderVariables;
@@ -470,4 +284,3 @@ const prepareRequest = (item, collection) => {
 
 module.exports = prepareRequest;
 module.exports.setAuthHeaders = setAuthHeaders;
-module.exports.createFormData = createFormData;

packages/bruno-electron/src/store/global-environments.js

@@ -63,6 +63,10 @@ class GlobalEnvironmentsStore {
 
   addGlobalEnvironment({ uid, name, variables = [] }) {
     let globalEnvironments = this.getGlobalEnvironments();
+    const existingEnvironment = globalEnvironments.find(env => env?.name == name);
+    if (existingEnvironment) {
+      throw new Error('Environment with the same name already exists');
+    }
     globalEnvironments.push({
       uid,
       name,

packages/bruno-electron/src/utils/collection.js

@@ -1,5 +1,161 @@
-const each = require('lodash/each');
-const find = require('lodash/find');
+const { get, each, find, compact } = require('lodash');
+const os = require('os');
+
+const mergeHeaders = (collection, request, requestTreePath) => {
+  let headers = new Map();
+
+  let collectionHeaders = get(collection, 'root.request.headers', []);
+  collectionHeaders.forEach((header) => {
+    if (header.enabled) {
+      headers.set(header.name, header.value);
+      if (header?.name?.toLowerCase() === 'content-type') {
+        contentTypeDefined = true;
+      }
+    }
+  });
+
+  for (let i of requestTreePath) {
+    if (i.type === 'folder') {
+      let _headers = get(i, 'root.request.headers', []);
+      _headers.forEach((header) => {
+        if (header.enabled) {
+          headers.set(header.name, header.value);
+        }
+      });
+    } else {
+      const _headers = i?.draft ? get(i, 'draft.request.headers', []) : get(i, 'request.headers', []);
+      _headers.forEach((header) => {
+        if (header.enabled) {
+          headers.set(header.name, header.value);
+        }
+      });
+    }
+  }
+
+  request.headers = Array.from(headers, ([name, value]) => ({ name, value, enabled: true }));
+};
+
+const mergeVars = (collection, request, requestTreePath) => {
+  let reqVars = new Map();
+  let collectionRequestVars = get(collection, 'root.request.vars.req', []);
+  let collectionVariables = {};
+  collectionRequestVars.forEach((_var) => {
+    if (_var.enabled) {
+      reqVars.set(_var.name, _var.value);
+      collectionVariables[_var.name] = _var.value;
+    }
+  });
+  let folderVariables = {};
+  let requestVariables = {};
+  for (let i of requestTreePath) {
+    if (i.type === 'folder') {
+      let vars = get(i, 'root.request.vars.req', []);
+      vars.forEach((_var) => {
+        if (_var.enabled) {
+          reqVars.set(_var.name, _var.value);
+          folderVariables[_var.name] = _var.value;
+        }
+      });
+    } else {
+      const vars = i?.draft ? get(i, 'draft.request.vars.req', []) : get(i, 'request.vars.req', []);
+      vars.forEach((_var) => {
+        if (_var.enabled) {
+          reqVars.set(_var.name, _var.value);
+          requestVariables[_var.name] = _var.value;
+        }
+      });
+    }
+  }
+
+  request.collectionVariables = collectionVariables;
+  request.folderVariables = folderVariables;
+  request.requestVariables = requestVariables;
+
+  if(request?.vars) {
+    request.vars.req = Array.from(reqVars, ([name, value]) => ({
+      name,
+      value,
+      enabled: true,
+      type: 'request'
+    }));
+  }
+
+  let resVars = new Map();
+  let collectionResponseVars = get(collection, 'root.request.vars.res', []);
+  collectionResponseVars.forEach((_var) => {
+    if (_var.enabled) {
+      resVars.set(_var.name, _var.value);
+    }
+  });
+  for (let i of requestTreePath) {
+    if (i.type === 'folder') {
+      let vars = get(i, 'root.request.vars.res', []);
+      vars.forEach((_var) => {
+        if (_var.enabled) {
+          resVars.set(_var.name, _var.value);
+        }
+      });
+    } else {
+      const vars = i?.draft ? get(i, 'draft.request.vars.res', []) : get(i, 'request.vars.res', []);
+      vars.forEach((_var) => {
+        if (_var.enabled) {
+          resVars.set(_var.name, _var.value);
+        }
+      });
+    }
+  }
+
+  if(request?.vars) {
+    request.vars.res = Array.from(resVars, ([name, value]) => ({
+      name,
+      value,
+      enabled: true,
+      type: 'response'
+    }));
+  }
+};
+
+const mergeScripts = (collection, request, requestTreePath, scriptFlow) => {
+  let collectionPreReqScript = get(collection, 'root.request.script.req', '');
+  let collectionPostResScript = get(collection, 'root.request.script.res', '');
+  let collectionTests = get(collection, 'root.request.tests', '');
+
+  let combinedPreReqScript = [];
+  let combinedPostResScript = [];
+  let combinedTests = [];
+  for (let i of requestTreePath) {
+    if (i.type === 'folder') {
+      let preReqScript = get(i, 'root.request.script.req', '');
+      if (preReqScript && preReqScript.trim() !== '') {
+        combinedPreReqScript.push(preReqScript);
+      }
+
+      let postResScript = get(i, 'root.request.script.res', '');
+      if (postResScript && postResScript.trim() !== '') {
+        combinedPostResScript.push(postResScript);
+      }
+
+      let tests = get(i, 'root.request.tests', '');
+      if (tests && tests?.trim?.() !== '') {
+        combinedTests.push(tests);
+      }
+    }
+  }
+
+  request.script.req = compact([collectionPreReqScript, ...combinedPreReqScript, request?.script?.req || '']).join(os.EOL);
+
+  if (scriptFlow === 'sequential') {
+    request.script.res = compact([collectionPostResScript, ...combinedPostResScript, request?.script?.res || '']).join(os.EOL);
+  } else {
+    request.script.res = compact([request?.script?.res || '', ...combinedPostResScript.reverse(), collectionPostResScript]).join(os.EOL);
+  }
+
+  if (scriptFlow === 'sequential') {
+    request.tests = compact([collectionTests, ...combinedTests, request?.tests || '']).join(os.EOL);
+  } else {
+    request.tests = compact([request?.tests || '', ...combinedTests.reverse(), collectionTests]).join(os.EOL);
+  }
+};
 
 const flattenItems = (items = []) => {
   const flattenedItems = [];
@@ -44,14 +200,12 @@ const getTreePathFromCollectionToItem = (collection, _item) => {
     path.unshift(item);
     item = findParentItemInCollection(collection, item.uid);
   }
-
   return path;
 };
 
 module.exports = {
-  flattenItems,
-  findItem,
-  findItemInCollection,
-  findParentItemInCollection,
+  mergeHeaders,
+  mergeVars,
+  mergeScripts,
   getTreePathFromCollectionToItem
-};
+}

packages/bruno-electron/src/utils/common.js

@@ -85,24 +85,6 @@ const flattenDataForDotNotation = (data) => {
   return result;
 };
 
-/**
- * @param {Array.<object>} params The request body Array
- * @returns {object} Returns an obj with repeating key as a array of values
- * {item: 2, item: 3, item1: 4} becomes {item: [2,3], item1: 4}
- */
-const buildFormUrlEncodedPayload = (params) => {
-  return params.reduce((acc, p) => {
-    if (!acc[p.name]) {
-      acc[p.name] = p.value;
-    } else if (Array.isArray(acc[p.name])) {
-      acc[p.name].push(p.value);
-    } else {
-      acc[p.name] = [acc[p.name], p.value];
-    }
-    return acc;
-  }, {});
-};
-
 module.exports = {
   uuid,
   stringifyJson,
@@ -111,6 +93,5 @@ module.exports = {
   safeParseJSON,
   simpleHash,
   generateUidBasedOnHash,
-  flattenDataForDotNotation,
-  buildFormUrlEncodedPayload
+  flattenDataForDotNotation
 };

packages/bruno-electron/src/utils/encryption.js

@@ -6,10 +6,34 @@ const { safeStorage } = require('electron');
 const ELECTRONSAFESTORAGE_ALGO = '00';
 const AES256_ALGO = '01';
 
-// AES-256 encryption and decryption functions
+function deriveKeyAndIv(password, keyLength, ivLength) {
+  const key = Buffer.alloc(keyLength);
+  const iv = Buffer.alloc(ivLength);
+  const derivedBytes = [];
+  let lastHash = null;
+
+  while (Buffer.concat(derivedBytes).length < keyLength + ivLength) {
+    const hash = crypto.createHash('md5');
+    if (lastHash) {
+      hash.update(lastHash);
+    }
+    hash.update(Buffer.from(password, 'utf8'));
+    lastHash = hash.digest();
+    derivedBytes.push(lastHash);
+  }
+
+  const concatenatedBytes = Buffer.concat(derivedBytes);
+  concatenatedBytes.copy(key, 0, 0, keyLength);
+  concatenatedBytes.copy(iv, 0, keyLength, keyLength + ivLength);
+
+  return { key, iv };
+}
+
 function aes256Encrypt(data) {
-  const key = machineIdSync();
-  const cipher = crypto.createCipher('aes-256-cbc', key);
+  const rawKey = machineIdSync();
+  const iv = Buffer.alloc(16, 0); // Default IV for new encryption
+  const key = crypto.createHash('sha256').update(rawKey).digest(); // Derive a 32-byte key
+  const cipher = crypto.createCipheriv('aes-256-cbc', key, iv);
   let encrypted = cipher.update(data, 'utf8', 'hex');
   encrypted += cipher.final('hex');
 
@@ -17,14 +41,28 @@ function aes256Encrypt(data) {
 }
 
 function aes256Decrypt(data) {
-  const key = machineIdSync();
-  const decipher = crypto.createDecipher('aes-256-cbc', key);
-  let decrypted = decipher.update(data, 'hex', 'utf8');
-  decrypted += decipher.final('utf8');
+  const rawKey = machineIdSync();
 
-  return decrypted;
+  // Attempt to decrypt using new method first
+  const iv = Buffer.alloc(16, 0); // Default IV for new encryption
+  const key = crypto.createHash('sha256').update(rawKey).digest(); // Derive a 32-byte key
+
+  try {
+    const decipher = crypto.createDecipheriv('aes-256-cbc', key, iv);
+    let decrypted = decipher.update(data, 'hex', 'utf8');
+    decrypted += decipher.final('utf8');
+    return decrypted;
+  } catch (err) {
+    // If decryption fails, fall back to old key derivation
+    const { key: oldKey, iv: oldIv } = deriveKeyAndIv(rawKey, 32, 16);
+    const decipher = crypto.createDecipheriv('aes-256-cbc', oldKey, oldIv);
+    let decrypted = decipher.update(data, 'hex', 'utf8');
+    decrypted += decipher.final('utf8');
+    return decrypted;
+  }
 }
 
+
 // electron safe storage encryption and decryption functions
 function safeStorageEncrypt(str) {
   let encryptedStringBuffer = safeStorage.encryptString(str);

packages/bruno-electron/src/utils/filesystem.js

@@ -38,6 +38,11 @@ const isDirectory = (dirPath) => {
   }
 };
 
+const hasSubDirectories = (dir) => {
+  const files = fs.readdirSync(dir);
+  return files.some(file => fs.statSync(path.join(dir, file)).isDirectory());
+};
+
 const normalizeAndResolvePath = (pathname) => {
   if (isSymbolicLink(pathname)) {
     const absPath = path.dirname(pathname);
@@ -156,8 +161,30 @@ const searchForBruFiles = (dir) => {
   return searchForFiles(dir, '.bru');
 };
 
+const sanitizeCollectionName = (name) => {
+  return name.trim();
+}
+
 const sanitizeDirectoryName = (name) => {
-  return name.replace(/[<>:"/\\|?*\x00-\x1F]+/g, '-');
+  return name.replace(/[<>:"/\\|?*\x00-\x1F]+/g, '-').trim();
+};
+
+const isWindowsOS = () => {
+  return os.platform() === 'win32';
+}
+
+const isValidFilename = (fileName) => {
+  const inValidChars = /[\\/:*?"<>|]/;
+
+  if (!fileName || inValidChars.test(fileName)) {
+    return false;
+  }
+
+  if (fileName.endsWith(' ') || fileName.endsWith('.') || fileName.startsWith('.')) {
+    return false;
+  }
+
+  return true;
 };
 
 const safeToRename = (oldPath, newPath) => {
@@ -170,7 +197,7 @@ const safeToRename = (oldPath, newPath) => {
     const oldStat = fs.statSync(oldPath);
     const newStat = fs.statSync(newPath);
 
-    if (os.platform() === 'win32') {
+    if (isWindowsOS()) {
       // Windows-specific comparison:
       // Check if both files have the same birth time, size (Since, Win FAT-32 doesn't use inodes)
 
@@ -204,5 +231,9 @@ module.exports = {
   searchForFiles,
   searchForBruFiles,
   sanitizeDirectoryName,
-  safeToRename
+  sanitizeCollectionName,
+  isWindowsOS,
+  safeToRename,
+  isValidFilename,
+  hasSubDirectories
 };

packages/bruno-electron/src/utils/form-data.js

@@ -0,0 +1,62 @@
+const { forEach } = require('lodash');
+const FormData = require('form-data');
+const fs = require('fs');
+const path = require('path');
+
+/**
+ * @param {Array.<object>} params The request body Array
+ * @returns {object} Returns an obj with repeating key as a array of values
+ * {item: 2, item: 3, item1: 4} becomes {item: [2,3], item1: 4}
+ */
+const buildFormUrlEncodedPayload = (params) => {
+  return params.reduce((acc, p) => {
+    if (!acc[p.name]) {
+      acc[p.name] = p.value;
+    } else if (Array.isArray(acc[p.name])) {
+      acc[p.name].push(p.value);
+    } else {
+      acc[p.name] = [acc[p.name], p.value];
+    }
+    return acc;
+  }, {});
+};
+
+
+const createFormData = (data, collectionPath) => {
+  // make axios work in node using form data
+  // reference: https://github.com/axios/axios/issues/1006#issuecomment-320165427
+  const form = new FormData();
+  forEach(data, (datum) => {
+    const { name, type, value, contentType } = datum;
+    let options = {};
+    if (contentType) {
+      options.contentType = contentType;
+    }
+    if (type === 'text') {
+      if (Array.isArray(value)) {
+        value.forEach((val) => form.append(name, val, options));
+      } else {
+        form.append(name, value, options);
+      }
+      return;
+    }
+
+    if (type === 'file') {
+      const filePaths = value || [];
+      filePaths.forEach((filePath) => {
+        let trimmedFilePath = filePath.trim();
+        if (!path.isAbsolute(trimmedFilePath)) {
+          trimmedFilePath = path.join(collectionPath, trimmedFilePath);
+        }
+        options.filename = path.basename(trimmedFilePath);
+        form.append(name, fs.createReadStream(trimmedFilePath), options);
+      });
+    }
+  });
+  return form;
+};
+
+module.exports = {
+  buildFormUrlEncodedPayload,
+  createFormData
+};

packages/bruno-electron/tests/network/prepare-request.spec.js

@@ -1,7 +1,7 @@
 const { describe, it, expect } = require('@jest/globals');
 
 const prepareRequest = require('../../src/ipc/network/prepare-request');
-const { buildFormUrlEncodedPayload } = require('../../src/utils/common');
+const { buildFormUrlEncodedPayload } = require('../../src/utils/form-data');
 
 describe('prepare-request: prepareRequest', () => {
   describe('Decomments request body', () => {

packages/bruno-electron/tests/utils/encryption.spec.js

@@ -22,6 +22,13 @@ describe('Encryption and Decryption Tests', () => {
     expect(() => decryptString('garbage')).toThrow('Decrypt failed: unrecognized string format');
   });
 
+  it.skip('string encrypted using createCipher (< node 20) should be decrypted properly', () => {
+    const encryptedString = '$01:2738e0e6a38bcde5fd80141ceadc9b67bc7b1fca7e398c552c1ca2bace28eb57';
+    const decryptedValue = decryptString(encryptedString);
+
+    expect(decryptedValue).toBe('bruno is awesome');
+  });
+
   it('decrypt should throw an error for invalid algorithm', () => {
     const invalidAlgo = '$99:abcdefg';
 

packages/bruno-graphql-docs/package.json

@@ -20,7 +20,7 @@
     "graphql": "^16.6.0",
     "markdown-it": "^13.0.1",
     "postcss": "8.4.47",
-    "react": "18.2.0",
+    "react": "19.0.0",
     "react-dom": "18.2.0",
     "rollup":"3.29.5",
     "rollup-plugin-dts": "^5.0.0",

packages/bruno-js/src/bru.js

@@ -65,6 +65,10 @@ class Bru {
     this.envVariables[key] = value;
   }
 
+  deleteEnvVar(key) {
+    delete this.envVariables[key];
+  }
+
   getGlobalEnvVar(key) {
     return this._interpolate(this.globalEnvironmentVariables[key]);
   }