wp-agentic-writer/views/settings-v2/tab-tools.php

<?php
/**
 * Settings V2: Tools.
 *
 * @package WP_Agentic_Writer
 */

if (!defined("ABSPATH")) {
    exit();
} ?>
<div class="section-head">
	<div>
		<p class="eyebrow"><?php esc_html_e("Capabilities", "wp-agentic-writer"); ?></p>
		<h2><?php esc_html_e("Tools", "wp-agentic-writer"); ?></h2>
		<p><?php esc_html_e(
      "Configure external tools and APIs that give your AI agent superpowers like internet access.",
      "wp-agentic-writer",
  ); ?></p>
	</div>
</div>

<div class="panel">
	<div class="panel-head">
		<div class="panel-title">
			<h3><?php esc_html_e("Web Search", "wp-agentic-writer"); ?></h3>
			<p><?php esc_html_e(
       "Allow the agent to search the internet for fresh context. OpenRouter natively supports this, but you can bypass external fees by plugging in your own search API.",
       "wp-agentic-writer",
   ); ?></p>
		</div>
		<label class="switch-row" style="margin:0"><input type="checkbox" name="wp_agentic_writer_settings[web_search_enabled]" value="1" <?php checked(
      $web_search_enabled,
  ); ?>><span class="switch"></span></label>
	</div>
	<div class="panel-body">
		<div class="grid-2">
			<div class="field"><label for="search_engine"><?php esc_html_e(
       "Search engine format",
       "wp-agentic-writer",
   ); ?></label>
				<select class="field-control" id="search_engine" name="wp_agentic_writer_settings[search_engine]">
					<option value="auto" <?php selected(
         $search_engine,
         "auto",
     ); ?>>Auto (OpenRouter if available)</option>
					<option value="openrouter" <?php selected(
         $search_engine,
         "openrouter",
     ); ?>>OpenRouter Native</option>
					<option value="9router" <?php selected(
         $search_engine,
         "9router",
     ); ?>>9Router (Proxy)</option>
					<option value="tavily" <?php selected(
         $search_engine,
         "tavily",
     ); ?>>Tavily API</option>
					<option value="serper" <?php selected(
         $search_engine,
         "serper",
     ); ?>>Serper.dev (Google)</option>
					<option value="brave" <?php selected(
         $search_engine,
         "brave",
     ); ?>>Brave Search API</option>
				</select>
			</div>
			<div class="field"><label for="search_depth"><?php esc_html_e(
       "Search depth",
       "wp-agentic-writer",
   ); ?></label>
				<select class="field-control" id="search_depth" name="wp_agentic_writer_settings[search_depth]">
					<option value="light" <?php selected($search_depth, "light"); ?>>Light</option>
					<option value="medium" <?php selected(
         $search_depth,
         "medium",
     ); ?>>Medium</option>
					<option value="deep" <?php selected($search_depth, "deep"); ?>>Deep</option>
				</select>
			</div>
		</div>

        <!-- Custom Search Wrapper -->
        <div id="wpaw2-custom-search-fields" style="margin-top:20px; <?php echo in_array(
            $search_engine,
            ["auto", "openrouter"],
        )
            ? "display:none;"
            : ""; ?>">
            <div class="field" style="margin-bottom:12px;">
                <label for="custom_search_url"><?php esc_html_e(
                    "Search Base URL",
                    "wp-agentic-writer",
                ); ?></label>
                <input class="field-control" type="url" id="custom_search_url" name="wp_agentic_writer_settings[custom_search_url]" value="<?php echo esc_attr(
                    $custom_search_url ?? "",
                ); ?>" placeholder="e.g. http://localhost:20128/v1/search">
            </div>

            <div class="field">
                <label for="brave_search_api_key"><?php esc_html_e(
                    "Search API key",
                    "wp-agentic-writer",
                ); ?></label>
                <div class="password-row">
                    <input class="field-control" type="password" id="brave_search_api_key" name="wp_agentic_writer_settings[brave_search_api_key]" value="<?php echo esc_attr(
                        $brave_search_api_key,
                    ); ?>" placeholder="sk-...">
                    <button type="button" class="btn" data-aw2-toggle-password="#brave_search_api_key"><?php esc_html_e(
                        "Show",
                        "wp-agentic-writer",
                    ); ?></button>
                </div>
            </div>
        </div>
	</div>
</div>

<script>
document.addEventListener('DOMContentLoaded', function() {
    const searchEngine = document.getElementById('search_engine');
    const searchFields = document.getElementById('wpaw2-custom-search-fields');
    const searchUrl = document.getElementById('custom_search_url');

    if (searchEngine && searchFields) {
        searchEngine.addEventListener('change', function() {
            if (this.value === 'auto' || this.value === 'openrouter') {
                searchFields.style.display = 'none';
            } else {
                searchFields.style.display = 'block';
                // Auto-fill standard endpoints if empty or if currently matching another default
                const defaultUrls = [
                    '',
                    'http://localhost:20128/v1/search',
                    'https://api.tavily.com/search',
                    'https://google.serper.dev/search',
                    'https://api.search.brave.com/res/v1/web/search'
                ];

                if (defaultUrls.includes(searchUrl.value.trim())) {
                    if (this.value === '9router') searchUrl.value = 'http://localhost:20128/v1/search';
                    if (this.value === 'tavily') searchUrl.value = 'https://api.tavily.com/search';
                    if (this.value === 'serper') searchUrl.value = 'https://google.serper.dev/search';
                    if (this.value === 'brave') searchUrl.value = 'https://api.search.brave.com/res/v1/web/search';
                }
            }
        });
    }
});
</script>