mirror of
https://github.com/browser-use/web-ui.git
synced 2026-03-22 11:17:17 +08:00
feat: now reads configs from config.pkl file and show in the UI
This commit is contained in:
meshkatshb
53
webui.py
53
webui.py
@@ -39,6 +39,7 @@ from src.browser.config import BrowserPersistenceConfig
|
||||
from src.browser.custom_context import BrowserContextConfig, CustomBrowserContext
|
||||
from src.controller.custom_controller import CustomController
|
||||
from gradio.themes import Citrus, Default, Glass, Monochrome, Ocean, Origin, Soft, Base
|
||||
from src.utils.default_config_settings import load_config_from_file, save_config_to_file
|
||||
from src.utils.utils import update_model_dropdown, get_latest_files, capture_screenshot
|
||||
|
||||
from dotenv import load_dotenv
|
||||
@@ -422,6 +423,7 @@ async def run_with_stream(
|
||||
max_actions_per_step,
|
||||
tool_call_in_content
|
||||
):
|
||||
save_config_to_file(locals())
|
||||
global _global_agent_state
|
||||
stream_vw = 80
|
||||
stream_vh = int(80 * window_h // window_w)
|
||||
@@ -588,7 +590,7 @@ async def close_global_browser():
|
||||
await _global_browser.close()
|
||||
_global_browser = None
|
||||
|
||||
def create_ui(theme_name="Ocean"):
|
||||
def create_ui(config, theme_name="Ocean"):
|
||||
css = """
|
||||
.gradio-container {
|
||||
max-width: 1200px !important;
|
||||
@@ -634,13 +636,13 @@ def create_ui(theme_name="Ocean"):
|
||||
agent_type = gr.Radio(
|
||||
["org", "custom"],
|
||||
label="Agent Type",
|
||||
value="custom",
|
||||
value=config['agent_type'],
|
||||
info="Select the type of agent to use",
|
||||
)
|
||||
max_steps = gr.Slider(
|
||||
minimum=1,
|
||||
maximum=200,
|
||||
value=100,
|
||||
value=config['max_steps'],
|
||||
step=1,
|
||||
label="Max Run Steps",
|
||||
info="Maximum number of steps the agent will take",
|
||||
@@ -648,19 +650,19 @@ def create_ui(theme_name="Ocean"):
|
||||
max_actions_per_step = gr.Slider(
|
||||
minimum=1,
|
||||
maximum=20,
|
||||
value=10,
|
||||
value=config['max_actions_per_step'],
|
||||
step=1,
|
||||
label="Max Actions per Step",
|
||||
info="Maximum number of actions the agent will take per step",
|
||||
)
|
||||
use_vision = gr.Checkbox(
|
||||
label="Use Vision",
|
||||
value=True,
|
||||
value=config['use_vision'],
|
||||
info="Enable visual processing capabilities",
|
||||
)
|
||||
tool_call_in_content = gr.Checkbox(
|
||||
label="Use Tool Calls in Content",
|
||||
value=True,
|
||||
value=config['tool_call_in_content'],
|
||||
info="Enable Tool Calls in content",
|
||||
)
|
||||
|
||||
@@ -669,13 +671,13 @@ def create_ui(theme_name="Ocean"):
|
||||
llm_provider = gr.Dropdown(
|
||||
choices=[provider for provider,model in utils.model_names.items()],
|
||||
label="LLM Provider",
|
||||
value="openai",
|
||||
value=config['llm_provider'],
|
||||
info="Select your preferred language model provider"
|
||||
)
|
||||
llm_model_name = gr.Dropdown(
|
||||
label="Model Name",
|
||||
choices=utils.model_names['openai'],
|
||||
value="gpt-4o",
|
||||
value=config['llm_model_name'],
|
||||
interactive=True,
|
||||
allow_custom_value=True, # Allow users to input custom model names
|
||||
info="Select a model from the dropdown or type a custom model name"
|
||||
@@ -683,7 +685,7 @@ def create_ui(theme_name="Ocean"):
|
||||
llm_temperature = gr.Slider(
|
||||
minimum=0.0,
|
||||
maximum=2.0,
|
||||
value=1.0,
|
||||
value=config['llm_temperature'],
|
||||
step=0.1,
|
||||
label="Temperature",
|
||||
info="Controls randomness in model outputs"
|
||||
@@ -691,13 +693,13 @@ def create_ui(theme_name="Ocean"):
|
||||
with gr.Row():
|
||||
llm_base_url = gr.Textbox(
|
||||
label="Base URL",
|
||||
value='',
|
||||
value=config['llm_base_url'],
|
||||
info="API endpoint URL (if required)"
|
||||
)
|
||||
llm_api_key = gr.Textbox(
|
||||
label="API Key",
|
||||
type="password",
|
||||
value='',
|
||||
value=config['llm_api_key'],
|
||||
info="Your API key (leave blank to use .env)"
|
||||
)
|
||||
|
||||
@@ -706,46 +708,46 @@ def create_ui(theme_name="Ocean"):
|
||||
with gr.Row():
|
||||
use_own_browser = gr.Checkbox(
|
||||
label="Use Own Browser",
|
||||
value=False,
|
||||
value=config['use_own_browser'],
|
||||
info="Use your existing browser instance",
|
||||
)
|
||||
keep_browser_open = gr.Checkbox(
|
||||
label="Keep Browser Open",
|
||||
value=os.getenv("CHROME_PERSISTENT_SESSION", "False").lower() == "true",
|
||||
value=config['keep_browser_open'],
|
||||
info="Keep Browser Open between Tasks",
|
||||
)
|
||||
headless = gr.Checkbox(
|
||||
label="Headless Mode",
|
||||
value=False,
|
||||
value=config['headless'],
|
||||
info="Run browser without GUI",
|
||||
)
|
||||
disable_security = gr.Checkbox(
|
||||
label="Disable Security",
|
||||
value=True,
|
||||
value=config['disable_security'],
|
||||
info="Disable browser security features",
|
||||
)
|
||||
enable_recording = gr.Checkbox(
|
||||
label="Enable Recording",
|
||||
value=True,
|
||||
value=config['enable_recording'],
|
||||
info="Enable saving browser recordings",
|
||||
)
|
||||
|
||||
with gr.Row():
|
||||
window_w = gr.Number(
|
||||
label="Window Width",
|
||||
value=1280,
|
||||
value=config['window_w'],
|
||||
info="Browser window width",
|
||||
)
|
||||
window_h = gr.Number(
|
||||
label="Window Height",
|
||||
value=1100,
|
||||
value=config['window_h'],
|
||||
info="Browser window height",
|
||||
)
|
||||
|
||||
save_recording_path = gr.Textbox(
|
||||
label="Recording Path",
|
||||
placeholder="e.g. ./tmp/record_videos",
|
||||
value="./tmp/record_videos",
|
||||
value=config['save_recording_path'],
|
||||
info="Path to save browser recordings",
|
||||
interactive=True, # Allow editing only if recording is enabled
|
||||
)
|
||||
@@ -753,7 +755,7 @@ def create_ui(theme_name="Ocean"):
|
||||
save_trace_path = gr.Textbox(
|
||||
label="Trace Path",
|
||||
placeholder="e.g. ./tmp/traces",
|
||||
value="./tmp/traces",
|
||||
value=config['save_recording_path'],
|
||||
info="Path to save Agent traces",
|
||||
interactive=True,
|
||||
)
|
||||
@@ -761,7 +763,7 @@ def create_ui(theme_name="Ocean"):
|
||||
save_agent_history_path = gr.Textbox(
|
||||
label="Agent History Save Path",
|
||||
placeholder="e.g., ./tmp/agent_history",
|
||||
value="./tmp/agent_history",
|
||||
value=config['save_agent_history_path'],
|
||||
info="Specify the directory where agent history should be saved.",
|
||||
interactive=True,
|
||||
)
|
||||
@@ -771,7 +773,7 @@ def create_ui(theme_name="Ocean"):
|
||||
label="Task Description",
|
||||
lines=4,
|
||||
placeholder="Enter your task here...",
|
||||
value="go to google.com and type 'OpenAI' click search and give me the first url",
|
||||
value=config['task'],
|
||||
info="Describe what you want the agent to do",
|
||||
)
|
||||
add_infos = gr.Textbox(
|
||||
@@ -871,7 +873,7 @@ def create_ui(theme_name="Ocean"):
|
||||
|
||||
recordings_gallery = gr.Gallery(
|
||||
label="Recordings",
|
||||
value=list_recordings("./tmp/record_videos"),
|
||||
value=list_recordings(config['save_recording_path']),
|
||||
columns=3,
|
||||
height="auto",
|
||||
object_fit="contain"
|
||||
@@ -911,7 +913,10 @@ def main():
|
||||
parser.add_argument("--dark-mode", action="store_true", help="Enable dark mode")
|
||||
args = parser.parse_args()
|
||||
|
||||
demo = create_ui(theme_name=args.theme)
|
||||
# Ensure that the config file exists
|
||||
config_dict = load_config_from_file()
|
||||
|
||||
demo = create_ui(config_dict, theme_name=args.theme)
|
||||
demo.launch(server_name=args.ip, server_port=args.port)
|
||||
|
||||
if __name__ == '__main__':
|
||||
|
||||
Reference in New Issue
Block a user