From 6244679d5b7f0b7637515ef0e6d9792d37cf4e1e Mon Sep 17 00:00:00 2001
From: Bacteria <32611672+bacteriostat@users.noreply.github.com>
Date: Wed, 25 Jun 2025 10:30:22 +0000
Subject: [PATCH] Merge pull request #4956 from
 bacteriostat/feature/single-line-editor-placeholder

feat: Add placeholder for SingleLineEditor
---
 .../src/components/SingleLineEditor/StyledWrapper.js         | 5 +++++
 packages/bruno-app/src/components/SingleLineEditor/index.js  | 1 +
 packages/bruno-app/src/themes/dark.js                        | 4 ++++
 packages/bruno-app/src/themes/light.js                       | 4 ++++
 4 files changed, 14 insertions(+)

diff --git a/packages/bruno-app/src/components/SingleLineEditor/StyledWrapper.js b/packages/bruno-app/src/components/SingleLineEditor/StyledWrapper.js
index 592a75b28..3398cb5ff 100644
--- a/packages/bruno-app/src/components/SingleLineEditor/StyledWrapper.js
+++ b/packages/bruno-app/src/components/SingleLineEditor/StyledWrapper.js
@@ -26,6 +26,11 @@ const StyledWrapper = styled.div`
 
     .CodeMirror-lines {
       padding: 0;
+
+      .CodeMirror-placeholder {
+        color: ${(props) => props.theme.codemirror.placeholder.color} !important;
+        opacity:  ${(props) => props.theme.codemirror.placeholder.opacity} !important
+      }
     }
 
     .CodeMirror-cursor {
diff --git a/packages/bruno-app/src/components/SingleLineEditor/index.js b/packages/bruno-app/src/components/SingleLineEditor/index.js
index a82bfe94a..435a2a5c7 100644
--- a/packages/bruno-app/src/components/SingleLineEditor/index.js
+++ b/packages/bruno-app/src/components/SingleLineEditor/index.js
@@ -46,6 +46,7 @@ class SingleLineEditor extends Component {
     const noopHandler = () => {};
 
     this.editor = CodeMirror(this.editorRef.current, {
+      placeholder: this.props.placeholder ?? '',
       lineWrapping: false,
       lineNumbers: false,
       theme: this.props.theme === 'dark' ? 'monokai' : 'default',
diff --git a/packages/bruno-app/src/themes/dark.js b/packages/bruno-app/src/themes/dark.js
index 04ee6134e..ec2e8d212 100644
--- a/packages/bruno-app/src/themes/dark.js
+++ b/packages/bruno-app/src/themes/dark.js
@@ -248,6 +248,10 @@ const darkTheme = {
   codemirror: {
     bg: '#1e1e1e',
     border: '#373737',
+    placeholder: {
+      color: '#a2a2a2',
+      opacity: 0.50
+    },
     gutter: {
       bg: '#262626'
     },
diff --git a/packages/bruno-app/src/themes/light.js b/packages/bruno-app/src/themes/light.js
index 55b1d0eaf..cdcb8de26 100644
--- a/packages/bruno-app/src/themes/light.js
+++ b/packages/bruno-app/src/themes/light.js
@@ -249,6 +249,10 @@ const lightTheme = {
   codemirror: {
     bg: 'white',
     border: '#efefef',
+    placeholder: {
+      color: '#a2a2a2',
+      opacity: 0.75
+    },
     gutter: {
       bg: '#f3f3f3'
     },