feat: Add AI Settings admin page with Local LLM support and connection testing

- Add AI Settings page at /settings/ai with provider selection (Claude, OpenAI, Local LLM)
- Add LOCAL_LLM enum to AIProvider
- Add localLlmUrl and localLlmContextSize fields to OrganizationConfiguration
- Add Test Connection button for Local LLM that validates:
  - URL parsing and format
  - DNS resolution with resolved IP display
  - TCP connection to host:port
  - TLS handshake (for HTTPS)
  - HTTP response and endpoint validation
  - Checks if response looks like an LLM API (JSON with expected fields)
  - Shows actual response preview from the server
- Add Test Key button for Claude and OpenAI that:
  - Sends a real test request to verify API key works
  - Shows step-by-step diagnostics
  - Displays the AI response on success
  - Shows detailed error info and suggestions on failure
- Fix GPT component to use styled textarea instead of missing Textarea export
- Fix response interceptor handling in AI Settings page

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>

Author: salevine

app/client/src/ce/api/OrganizationApi.ts

@@ -25,11 +25,15 @@ export interface AIConfigResponse {
   provider: string | null;
   hasClaudeApiKey: boolean;
   hasOpenaiApiKey: boolean;
+  localLlmUrl?: string;
+  localLlmContextSize?: number;
 }
 
 export interface AIConfigRequest {
   claudeApiKey?: string;
   openaiApiKey?: string;
+  localLlmUrl?: string;
+  localLlmContextSize?: number;
   provider: string;
   isAIAssistantEnabled: boolean;
 }
@@ -85,6 +89,24 @@ export class OrganizationApi extends Api {
   ): Promise<AxiosPromise<ApiResponse<AIConfigResponse>>> {
     return Api.put(`${OrganizationApi.tenantsUrl}/ai-config`, request);
   }
+
+  static async testLlmConnection(
+    url: string,
+  ): Promise<AxiosPromise<ApiResponse<Record<string, unknown>>>> {
+    return Api.post(`${OrganizationApi.tenantsUrl}/ai-config/test-connection`, {
+      url,
+    });
+  }
+
+  static async testApiKey(
+    provider: string,
+    apiKey?: string,
+  ): Promise<AxiosPromise<ApiResponse<Record<string, unknown>>>> {
+    return Api.post(`${OrganizationApi.tenantsUrl}/ai-config/test-api-key`, {
+      provider,
+      apiKey,
+    });
+  }
 }
 
 export default OrganizationApi;

app/client/src/ee/components/editorComponents/GPT/index.tsx

@@ -7,7 +7,7 @@ import type { EntityNavigationData } from "entities/DataTree/dataTreeTypes";
 import React, { useState, useEffect } from "react";
 import type CodeMirror from "codemirror";
 import { useDispatch, useSelector } from "react-redux";
-import { Button, Text, Textarea } from "@appsmith/ads";
+import { Button, Text } from "@appsmith/ads";
 import styled from "styled-components";
 import { fetchAIResponse } from "ee/actions/aiAssistantActions";
 import {
@@ -92,16 +92,38 @@ const InputArea = styled.div`
   align-items: flex-end;
 `;
 
+const StyledTextarea = styled.textarea`
+  flex: 1;
+  padding: var(--ads-v2-spaces-3);
+  border: 1px solid var(--ads-v2-color-border);
+  border-radius: var(--ads-v2-border-radius);
+  background: var(--ads-v2-color-bg);
+  color: var(--ads-v2-color-fg);
+  font-family: inherit;
+  font-size: var(--ads-v2-font-size-4);
+  resize: vertical;
+  min-height: 80px;
+
+  &:focus {
+    outline: none;
+    border-color: var(--ads-v2-color-border-emphasis);
+  }
+
+  &::placeholder {
+    color: var(--ads-v2-color-fg-muted);
+  }
+`;
+
 export function AIWindow(props: TAIWrapperProps) {
   const {
     children,
-    isOpen,
     currentValue,
-    update,
+    editor,
     enableAIAssistance,
+    isOpen,
     mode,
-    editor,
     onOpenChanged,
+    update,
   } = props;
 
   const dispatch = useDispatch();
@@ -110,11 +132,14 @@ export function AIWindow(props: TAIWrapperProps) {
   const isLoading = useSelector(getIsAILoading);
   const error = useSelector(getAIError);
 
-  useEffect(function handleResponseChange() {
-    if (lastResponse && update) {
-      setPrompt("");
-    }
-  }, [lastResponse, update]);
+  useEffect(
+    function handleResponseChange() {
+      if (lastResponse && update) {
+        setPrompt("");
+      }
+    },
+    [lastResponse, update],
+  );
 
   if (!enableAIAssistance || !isOpen) {
     return children as React.ReactElement;
@@ -166,29 +191,25 @@ export function AIWindow(props: TAIWrapperProps) {
         <AIWindowContent>
           <ResponseArea>
             {isLoading && <Text>Thinking...</Text>}
-            {error && (
-              <Text color="var(--ads-v2-color-fg-error)">{error}</Text>
-            )}
-            {lastResponse && !isLoading && (
-              <Text>{lastResponse}</Text>
-            )}
+            {error && <Text color="var(--ads-v2-color-fg-error)">{error}</Text>}
+            {lastResponse && !isLoading && <Text>{lastResponse}</Text>}
             {!lastResponse && !isLoading && !error && (
               <Text color="var(--ads-v2-color-fg-muted)">
                 Ask me anything about your code...
               </Text>
             )}
           </ResponseArea>
           <InputArea>
-            <Textarea
-              value={prompt}
-              onChange={(value) => setPrompt(value)}
+            <StyledTextarea
+              onChange={(e) => setPrompt(e.target.value)}
               placeholder="Describe what you want the code to do..."
               rows={3}
+              value={prompt}
             />
             <Button
+              isLoading={isLoading}
               kind="primary"
               onClick={handleSend}
-              isLoading={isLoading}
               size="md"
             >
               Send