From 4c4bd8dec67ca33ffe7d33813fc7f2b2ab6878f0 Mon Sep 17 00:00:00 2001
From: Jannis Braun <151788261+TheZwiss@users.noreply.github.com>
Date: Sun, 22 Mar 2026 01:44:24 +0100
Subject: [PATCH] fix: add editable input alongside slider step presets for
 custom values

---
 .../instanceSettingsPanels/StreamingPanel.tsx | 19 +++++++++++++++++--
 1 file changed, 17 insertions(+), 2 deletions(-)

diff --git a/packages/web/src/components/modals/instanceSettingsPanels/StreamingPanel.tsx b/packages/web/src/components/modals/instanceSettingsPanels/StreamingPanel.tsx
index 9d9dc73b..fc44323c 100644
--- a/packages/web/src/components/modals/instanceSettingsPanels/StreamingPanel.tsx
+++ b/packages/web/src/components/modals/instanceSettingsPanels/StreamingPanel.tsx
@@ -240,9 +240,24 @@ export function StreamingPanel() {
             </div>
           </div>
 
-          {/* Bitrate Step — pill presets */}
+          {/* Bitrate Step — presets + custom input */}
           <div className="pt-2 border-t border-white/[0.04]">
-            <div className="text-[11px] text-txt-tertiary mb-1.5">Slider Step</div>
+            <div className="flex items-center gap-2 mb-1.5">
+              <span className="text-[11px] text-txt-tertiary">Slider Step</span>
+              <input
+                type="number"
+                min={50}
+                max={10000}
+                step={50}
+                value={draft.bitrateStepKbps}
+                onChange={(e) => {
+                  const v = Number(e.target.value);
+                  if (v >= 50 && v <= 10000) setDraft({ ...draft, bitrateStepKbps: v });
+                }}
+                className="input-standard w-14 px-1.5 py-0 text-[11px] text-center"
+              />
+              <span className="text-[11px] text-txt-tertiary">kbps</span>
+            </div>
             <div className="flex flex-wrap gap-1">
               {[100, 250, 500, 1000, 2500, 5000].map((step) => (
                 <button