From e163aea0e078790ee46cbf4f7a4603bc627cea58 Mon Sep 17 00:00:00 2001
From: Alex Andru <alex007d@gmail.com>
Date: Thu, 19 Jun 2025 15:03:39 +0200
Subject: [PATCH 01/20] feat: add elicitations to useConnection

---
 client/src/lib/hooks/useConnection.ts | 13 +++++++++++++
 1 file changed, 13 insertions(+)

diff --git a/client/src/lib/hooks/useConnection.ts b/client/src/lib/hooks/useConnection.ts
index 9009e698f..01c9a0ac4 100644
--- a/client/src/lib/hooks/useConnection.ts
+++ b/client/src/lib/hooks/useConnection.ts
@@ -28,6 +28,7 @@ import {
   ToolListChangedNotificationSchema,
   PromptListChangedNotificationSchema,
   Progress,
+  ElicitRequestSchema,
 } from "@modelcontextprotocol/sdk/types.js";
 import { RequestOptions } from "@modelcontextprotocol/sdk/shared/protocol.js";
 import { useState } from "react";
@@ -62,6 +63,8 @@ interface UseConnectionOptions {
   // eslint-disable-next-line @typescript-eslint/no-explicit-any
   onPendingRequest?: (request: any, resolve: any, reject: any) => void;
   // eslint-disable-next-line @typescript-eslint/no-explicit-any
+  onElicitationRequest?: (request: any, resolve: any) => void;
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
   getRoots?: () => any[];
 }
 
@@ -77,6 +80,7 @@ export function useConnection({
   onNotification,
   onStdErrNotification,
   onPendingRequest,
+  onElicitationRequest,
   getRoots,
 }: UseConnectionOptions) {
   const [connectionStatus, setConnectionStatus] =
@@ -295,6 +299,7 @@ export function useConnection({
       {
         capabilities: {
           sampling: {},
+          elicitation: {},
           roots: {
             listChanged: true,
           },
@@ -521,6 +526,14 @@ export function useConnection({
         });
       }
 
+      if (onElicitationRequest) {
+        client.setRequestHandler(ElicitRequestSchema, async (request) => {
+          return new Promise((resolve) => {
+            onElicitationRequest(request, resolve);
+          });
+        });
+      }
+
       setMcpClient(client);
       setConnectionStatus("connected");
     } catch (e) {

From e6166a734eccb49f96fba9f0e5cfa7add21b2618 Mon Sep 17 00:00:00 2001
From: Alex Andru <alex007d@gmail.com>
Date: Thu, 19 Jun 2025 15:17:54 +0200
Subject: [PATCH 02/20] feat: add new schema requirements to DynamicJsonForm

---
 client/src/components/DynamicJsonForm.tsx     | 161 +++++++-
 .../__tests__/DynamicJsonForm.test.tsx        | 384 ++++++++++++++++++
 2 files changed, 523 insertions(+), 22 deletions(-)

diff --git a/client/src/components/DynamicJsonForm.tsx b/client/src/components/DynamicJsonForm.tsx
index 6a5993c32..77023b280 100644
--- a/client/src/components/DynamicJsonForm.tsx
+++ b/client/src/components/DynamicJsonForm.tsx
@@ -140,26 +140,136 @@ const DynamicJsonForm = ({
       );
     }
 
+    const isFieldRequired = (fieldPath: string[]): boolean => {
+      if (typeof schema.required === "boolean") {
+        return schema.required;
+      }
+      if (Array.isArray(schema.required) && fieldPath.length > 0) {
+        return schema.required.includes(fieldPath[fieldPath.length - 1]);
+      }
+      return false;
+    };
+
+    if (propSchema.type === "object" && propSchema.properties) {
+      const objectValue = (currentValue as Record<string, JsonValue>) || {};
+
+      return (
+        <div className="space-y-4">
+          {Object.entries(propSchema.properties).map(
+            ([fieldName, fieldSchema]) => {
+              const fieldPath = [...path, fieldName];
+              const fieldValue = objectValue[fieldName];
+              const fieldRequired = isFieldRequired([fieldName]);
+
+              return (
+                <div key={fieldName} className="space-y-2">
+                  <label
+                    htmlFor={fieldName}
+                    className="block text-sm font-medium"
+                  >
+                    {fieldSchema.title || fieldName}
+                    {fieldRequired && (
+                      <span className="text-red-500 ml-1">*</span>
+                    )}
+                  </label>
+                  {fieldSchema.description && (
+                    <p className="text-xs text-gray-500">
+                      {fieldSchema.description}
+                    </p>
+                  )}
+                  <div>
+                    {renderFieldInput(
+                      fieldSchema,
+                      fieldValue,
+                      fieldPath,
+                      fieldRequired,
+                    )}
+                  </div>
+                </div>
+              );
+            },
+          )}
+        </div>
+      );
+    }
+
+    const fieldRequired = isFieldRequired(path);
+    return renderFieldInput(propSchema, currentValue, path, fieldRequired);
+  };
+
+  const renderFieldInput = (
+    propSchema: JsonSchemaType,
+    currentValue: JsonValue,
+    path: string[],
+    fieldRequired: boolean,
+  ) => {
     switch (propSchema.type) {
-      case "string":
+      case "string": {
+        if (propSchema.enum) {
+          return (
+            <select
+              value={(currentValue as string) ?? ""}
+              onChange={(e) => {
+                const val = e.target.value;
+                if (!val && !fieldRequired) {
+                  handleFieldChange(path, undefined);
+                } else {
+                  handleFieldChange(path, val);
+                }
+              }}
+              required={fieldRequired}
+              className="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500 dark:border-gray-600 dark:bg-gray-800"
+            >
+              <option value="">Select an option...</option>
+              {propSchema.enum.map((option, index) => (
+                <option key={option} value={option}>
+                  {propSchema.enumNames?.[index] || option}
+                </option>
+              ))}
+            </select>
+          );
+        }
+
+        let inputType = "text";
+        switch (propSchema.format) {
+          case "email":
+            inputType = "email";
+            break;
+          case "uri":
+            inputType = "url";
+            break;
+          case "date":
+            inputType = "date";
+            break;
+          case "date-time":
+            inputType = "datetime-local";
+            break;
+          default:
+            inputType = "text";
+            break;
+        }
+
         return (
           <Input
-            type="text"
+            type={inputType}
             value={(currentValue as string) ?? ""}
             onChange={(e) => {
               const val = e.target.value;
-              // Allow clearing non-required fields by setting undefined
-              // This preserves the distinction between empty string and unset
-              if (!val && !propSchema.required) {
+              if (!val && !fieldRequired) {
                 handleFieldChange(path, undefined);
               } else {
                 handleFieldChange(path, val);
               }
             }}
             placeholder={propSchema.description}
-            required={propSchema.required}
+            required={fieldRequired}
+            minLength={propSchema.minLength}
+            maxLength={propSchema.maxLength}
+            pattern={propSchema.pattern}
           />
         );
+      }
+
       case "number":
         return (
           <Input
@@ -167,9 +277,7 @@ const DynamicJsonForm = ({
             value={(currentValue as number)?.toString() ?? ""}
             onChange={(e) => {
               const val = e.target.value;
-              // Allow clearing non-required number fields
-              // This preserves the distinction between 0 and unset
-              if (!val && !propSchema.required) {
+              if (!val && !fieldRequired) {
                 handleFieldChange(path, undefined);
               } else {
                 const num = Number(val);
@@ -179,9 +287,12 @@ const DynamicJsonForm = ({
               }
             }}
             placeholder={propSchema.description}
-            required={propSchema.required}
+            required={fieldRequired}
+            min={propSchema.minimum}
+            max={propSchema.maximum}
           />
         );
+
       case "integer":
         return (
           <Input
@@ -190,32 +301,38 @@ const DynamicJsonForm = ({
             value={(currentValue as number)?.toString() ?? ""}
             onChange={(e) => {
               const val = e.target.value;
-              // Allow clearing non-required integer fields
-              // This preserves the distinction between 0 and unset
-              if (!val && !propSchema.required) {
+              if (!val && !fieldRequired) {
                 handleFieldChange(path, undefined);
               } else {
                 const num = Number(val);
-                // Only update if it's a valid integer
                 if (!isNaN(num) && Number.isInteger(num)) {
                   handleFieldChange(path, num);
                 }
               }
             }}
             placeholder={propSchema.description}
-            required={propSchema.required}
+            required={fieldRequired}
+            min={propSchema.minimum}
+            max={propSchema.maximum}
           />
         );
+
       case "boolean":
         return (
-          <Input
-            type="checkbox"
-            checked={(currentValue as boolean) ?? false}
-            onChange={(e) => handleFieldChange(path, e.target.checked)}
-            className="w-4 h-4"
-            required={propSchema.required}
-          />
+          <div className="flex items-center space-x-2">
+            <Input
+              type="checkbox"
+              checked={(currentValue as boolean) ?? false}
+              onChange={(e) => handleFieldChange(path, e.target.checked)}
+              className="w-4 h-4"
+              required={fieldRequired}
+            />
+            <span className="text-sm">
+              {propSchema.description || "Enable this option"}
+            </span>
+          </div>
         );
+
       default:
         return null;
     }
diff --git a/client/src/components/__tests__/DynamicJsonForm.test.tsx b/client/src/components/__tests__/DynamicJsonForm.test.tsx
index afd435d78..2a0da7998 100644
--- a/client/src/components/__tests__/DynamicJsonForm.test.tsx
+++ b/client/src/components/__tests__/DynamicJsonForm.test.tsx
@@ -1,4 +1,5 @@
 import { render, screen, fireEvent, waitFor } from "@testing-library/react";
+import "@testing-library/jest-dom";
 import { describe, it, expect, jest } from "@jest/globals";
 import DynamicJsonForm from "../DynamicJsonForm";
 import type { JsonSchemaType } from "@/utils/jsonUtils";
@@ -35,6 +36,130 @@ describe("DynamicJsonForm String Fields", () => {
       expect(input).toHaveProperty("type", "text");
     });
   });
+
+  describe("Format Support", () => {
+    it("should render email input for email format", () => {
+      const schema: JsonSchemaType = {
+        type: "string",
+        format: "email",
+        description: "Email address",
+      };
+      render(<DynamicJsonForm schema={schema} value="" onChange={jest.fn()} />);
+
+      const input = screen.getByRole("textbox");
+      expect(input).toHaveProperty("type", "email");
+    });
+
+    it("should render url input for uri format", () => {
+      const schema: JsonSchemaType = {
+        type: "string",
+        format: "uri",
+        description: "Website URL",
+      };
+      render(<DynamicJsonForm schema={schema} value="" onChange={jest.fn()} />);
+
+      const input = screen.getByRole("textbox");
+      expect(input).toHaveProperty("type", "url");
+    });
+
+    it("should render date input for date format", () => {
+      const schema: JsonSchemaType = {
+        type: "string",
+        format: "date",
+        description: "Birth date",
+      };
+      render(<DynamicJsonForm schema={schema} value="" onChange={jest.fn()} />);
+
+      const input = screen.getByDisplayValue("");
+      expect(input).toHaveProperty("type", "date");
+    });
+
+    it("should render datetime-local input for date-time format", () => {
+      const schema: JsonSchemaType = {
+        type: "string",
+        format: "date-time",
+        description: "Event datetime",
+      };
+      render(<DynamicJsonForm schema={schema} value="" onChange={jest.fn()} />);
+
+      const input = screen.getByDisplayValue("");
+      expect(input).toHaveProperty("type", "datetime-local");
+    });
+  });
+
+  describe("Enum Support", () => {
+    it("should render select dropdown for enum fields", () => {
+      const schema: JsonSchemaType = {
+        type: "string",
+        enum: ["option1", "option2", "option3"],
+        description: "Select an option",
+      };
+      render(<DynamicJsonForm schema={schema} value="" onChange={jest.fn()} />);
+
+      const select = screen.getByRole("combobox");
+      expect(select.tagName).toBe("SELECT");
+
+      const options = screen.getAllByRole("option");
+      expect(options).toHaveLength(4);
+    });
+
+    it("should use enumNames for option labels", () => {
+      const schema: JsonSchemaType = {
+        type: "string",
+        enum: ["val1", "val2"],
+        enumNames: ["Label 1", "Label 2"],
+        description: "Select with labels",
+      };
+      render(<DynamicJsonForm schema={schema} value="" onChange={jest.fn()} />);
+
+      const options = screen.getAllByRole("option");
+      expect(options[1]).toHaveProperty("textContent", "Label 1");
+      expect(options[2]).toHaveProperty("textContent", "Label 2");
+    });
+
+    it("should call onChange with selected enum value", () => {
+      const onChange = jest.fn();
+      const schema: JsonSchemaType = {
+        type: "string",
+        enum: ["option1", "option2"],
+        description: "Select an option",
+      };
+      render(<DynamicJsonForm schema={schema} value="" onChange={onChange} />);
+
+      const select = screen.getByRole("combobox");
+      fireEvent.change(select, { target: { value: "option1" } });
+
+      expect(onChange).toHaveBeenCalledWith("option1");
+    });
+  });
+
+  describe("Validation Attributes", () => {
+    it("should apply minLength and maxLength", () => {
+      const schema: JsonSchemaType = {
+        type: "string",
+        minLength: 3,
+        maxLength: 10,
+        description: "Username",
+      };
+      render(<DynamicJsonForm schema={schema} value="" onChange={jest.fn()} />);
+
+      const input = screen.getByRole("textbox");
+      expect(input).toHaveProperty("minLength", 3);
+      expect(input).toHaveProperty("maxLength", 10);
+    });
+
+    it("should apply pattern validation", () => {
+      const schema: JsonSchemaType = {
+        type: "string",
+        pattern: "^[A-Za-z]+$",
+        description: "Letters only",
+      };
+      render(<DynamicJsonForm schema={schema} value="" onChange={jest.fn()} />);
+
+      const input = screen.getByRole("textbox");
+      expect(input).toHaveProperty("pattern", "^[A-Za-z]+$");
+    });
+  });
 });
 
 describe("DynamicJsonForm Integer Fields", () => {
@@ -81,6 +206,38 @@ describe("DynamicJsonForm Integer Fields", () => {
     });
   });
 
+  describe("Validation", () => {
+    it("should apply min and max constraints", () => {
+      const schema: JsonSchemaType = {
+        type: "integer",
+        minimum: 0,
+        maximum: 100,
+        description: "Age",
+      };
+      render(
+        <DynamicJsonForm schema={schema} value={0} onChange={jest.fn()} />,
+      );
+
+      const input = screen.getByRole("spinbutton");
+      expect(input).toHaveProperty("min", "0");
+      expect(input).toHaveProperty("max", "100");
+    });
+
+    it("should only accept integer values", () => {
+      const onChange = jest.fn();
+      const schema: JsonSchemaType = {
+        type: "integer",
+        description: "Count",
+      };
+      render(<DynamicJsonForm schema={schema} value={0} onChange={onChange} />);
+
+      const input = screen.getByRole("spinbutton");
+      fireEvent.change(input, { target: { value: "3.14" } });
+
+      expect(onChange).not.toHaveBeenCalled();
+    });
+  });
+
   describe("Edge Cases", () => {
     it("should handle non-numeric input by not calling onChange", () => {
       const onChange = jest.fn();
@@ -94,6 +251,233 @@ describe("DynamicJsonForm Integer Fields", () => {
   });
 });
 
+describe("DynamicJsonForm Number Fields", () => {
+  describe("Validation", () => {
+    it("should apply min and max constraints", () => {
+      const schema: JsonSchemaType = {
+        type: "number",
+        minimum: 0.5,
+        maximum: 99.9,
+        description: "Score",
+      };
+      render(
+        <DynamicJsonForm schema={schema} value={0} onChange={jest.fn()} />,
+      );
+
+      const input = screen.getByRole("spinbutton");
+      expect(input).toHaveProperty("min", "0.5");
+      expect(input).toHaveProperty("max", "99.9");
+    });
+
+    it("should accept decimal values", () => {
+      const onChange = jest.fn();
+      const schema: JsonSchemaType = {
+        type: "number",
+        description: "Temperature",
+      };
+      render(<DynamicJsonForm schema={schema} value={0} onChange={onChange} />);
+
+      const input = screen.getByRole("spinbutton");
+      fireEvent.change(input, { target: { value: "98.6" } });
+
+      expect(onChange).toHaveBeenCalledWith(98.6);
+    });
+  });
+});
+
+describe("DynamicJsonForm Boolean Fields", () => {
+  describe("Basic Operations", () => {
+    it("should render checkbox for boolean type", () => {
+      const schema: JsonSchemaType = {
+        type: "boolean",
+        description: "Enable notifications",
+      };
+      render(
+        <DynamicJsonForm schema={schema} value={false} onChange={jest.fn()} />,
+      );
+
+      const checkbox = screen.getByRole("checkbox");
+      expect(checkbox).toHaveProperty("type", "checkbox");
+    });
+
+    it("should call onChange with boolean value", () => {
+      const onChange = jest.fn();
+      const schema: JsonSchemaType = {
+        type: "boolean",
+        description: "Accept terms",
+      };
+      render(
+        <DynamicJsonForm schema={schema} value={false} onChange={onChange} />,
+      );
+
+      const checkbox = screen.getByRole("checkbox");
+      fireEvent.click(checkbox);
+
+      expect(onChange).toHaveBeenCalledWith(true);
+    });
+
+    it("should render boolean field with description", () => {
+      const schema: JsonSchemaType = {
+        type: "boolean",
+        description: "Enable dark mode",
+      };
+      render(
+        <DynamicJsonForm schema={schema} value={false} onChange={jest.fn()} />,
+      );
+
+      const checkbox = screen.getByRole("checkbox");
+      expect(checkbox).toHaveProperty("checked", false);
+    });
+  });
+});
+
+describe("DynamicJsonForm Object Fields", () => {
+  describe("Property Rendering", () => {
+    it("should render input fields for object properties", () => {
+      const schema: JsonSchemaType = {
+        type: "object",
+        properties: {
+          name: {
+            type: "string",
+            title: "Full Name",
+            description: "Your full name",
+          },
+          age: {
+            type: "integer",
+            title: "Age",
+            description: "Your age in years",
+            minimum: 18,
+          },
+          email: {
+            type: "string",
+            format: "email",
+            title: "Email",
+            description: "Your email address",
+          },
+        },
+      };
+      render(
+        <DynamicJsonForm schema={schema} value={{}} onChange={jest.fn()} />,
+      );
+
+      const textInputs = screen.getAllByRole("textbox");
+      const numberInput = screen.getByRole("spinbutton");
+
+      expect(textInputs).toHaveLength(2);
+      expect(textInputs[0]).toHaveProperty("type", "text");
+      expect(textInputs[1]).toHaveProperty("type", "email");
+      expect(numberInput).toHaveProperty("type", "number");
+      expect(numberInput).toHaveProperty("min", "18");
+    });
+
+    it("should handle object field changes correctly", () => {
+      const onChange = jest.fn();
+      const schema: JsonSchemaType = {
+        type: "object",
+        properties: {
+          username: {
+            type: "string",
+            description: "Your username",
+          },
+        },
+      };
+      render(
+        <DynamicJsonForm schema={schema} value={{}} onChange={onChange} />,
+      );
+
+      const input = screen.getByRole("textbox");
+      fireEvent.change(input, { target: { value: "testuser" } });
+
+      expect(onChange).toHaveBeenCalledWith({ username: "testuser" });
+    });
+
+    it("should handle nested object values correctly", () => {
+      const onChange = jest.fn();
+      const schema: JsonSchemaType = {
+        type: "object",
+        properties: {
+          name: {
+            type: "string",
+            title: "Name",
+          },
+        },
+      };
+      render(
+        <DynamicJsonForm
+          schema={schema}
+          value={{ name: "John" }}
+          onChange={onChange}
+        />,
+      );
+
+      const input = screen.getByDisplayValue("John");
+      fireEvent.change(input, { target: { value: "Jane" } });
+
+      expect(onChange).toHaveBeenCalledWith({ name: "Jane" });
+    });
+  });
+
+  describe("Required Fields", () => {
+    it("should mark required fields with required attribute", () => {
+      const schema: JsonSchemaType = {
+        type: "object",
+        properties: {
+          name: {
+            type: "string",
+            title: "Name",
+          },
+          email: {
+            type: "string",
+            title: "Email",
+          },
+        },
+        required: ["name"],
+      };
+      render(
+        <DynamicJsonForm schema={schema} value={{}} onChange={jest.fn()} />,
+      );
+
+      const inputs = screen.getAllByRole("textbox");
+      const nameInput = inputs[0];
+      const emailInput = inputs[1];
+
+      expect(nameInput).toHaveProperty("required", true);
+      expect(emailInput).toHaveProperty("required", false);
+    });
+
+    it("should mark required fields with required attribute", () => {
+      const schema: JsonSchemaType = {
+        type: "object",
+        properties: {
+          name: {
+            type: "string",
+            title: "Name",
+          },
+          optional: {
+            type: "string",
+            title: "Optional",
+          },
+        },
+        required: ["name"],
+      };
+      render(
+        <DynamicJsonForm schema={schema} value={{}} onChange={jest.fn()} />,
+      );
+
+      const nameLabel = screen.getByText("Name");
+      const optionalLabel = screen.getByText("Optional");
+
+      const nameInput = nameLabel.closest("div")?.querySelector("input");
+      const optionalInput = optionalLabel
+        .closest("div")
+        ?.querySelector("input");
+
+      expect(nameInput).toHaveProperty("required", true);
+      expect(optionalInput).toHaveProperty("required", false);
+    });
+  });
+});
+
 describe("DynamicJsonForm Complex Fields", () => {
   const renderForm = (props = {}) => {
     const defaultProps = {

From a058229fb689c0b8b0abff3f64ed7a90b3671064 Mon Sep 17 00:00:00 2001
From: Alex Andru <alex007d@gmail.com>
Date: Thu, 19 Jun 2025 16:14:57 +0200
Subject: [PATCH 03/20] feat: add ElicitationModal

---
 client/package.json                           |   2 +-
 client/src/components/ElicitationModal.tsx    | 181 ++++++
 .../__tests__/ElicitationModal.test.tsx       | 535 ++++++++++++++++++
 3 files changed, 717 insertions(+), 1 deletion(-)
 create mode 100644 client/src/components/ElicitationModal.tsx
 create mode 100644 client/src/components/__tests__/ElicitationModal.test.tsx

diff --git a/client/package.json b/client/package.json
index 37a0675b9..ffeafcc7e 100644
--- a/client/package.json
+++ b/client/package.json
@@ -25,7 +25,6 @@
   "dependencies": {
     "@modelcontextprotocol/sdk": "^1.12.1",
     "@radix-ui/react-checkbox": "^1.1.4",
-    "ajv": "^6.12.6",
     "@radix-ui/react-dialog": "^1.1.3",
     "@radix-ui/react-icons": "^1.3.0",
     "@radix-ui/react-label": "^2.1.0",
@@ -35,6 +34,7 @@
     "@radix-ui/react-tabs": "^1.1.1",
     "@radix-ui/react-toast": "^1.2.6",
     "@radix-ui/react-tooltip": "^1.1.8",
+    "ajv": "^6.12.6",
     "class-variance-authority": "^0.7.0",
     "clsx": "^2.1.1",
     "cmdk": "^1.0.4",
diff --git a/client/src/components/ElicitationModal.tsx b/client/src/components/ElicitationModal.tsx
new file mode 100644
index 000000000..8a742a313
--- /dev/null
+++ b/client/src/components/ElicitationModal.tsx
@@ -0,0 +1,181 @@
+import { useState, useEffect } from "react";
+import { Button } from "@/components/ui/button";
+import {
+  Dialog,
+  DialogContent,
+  DialogDescription,
+  DialogFooter,
+  DialogHeader,
+  DialogTitle,
+} from "@/components/ui/dialog";
+import DynamicJsonForm from "./DynamicJsonForm";
+import { JsonSchemaType, JsonValue } from "@/utils/jsonUtils";
+import { generateDefaultValue } from "@/utils/schemaUtils";
+import Ajv from "ajv";
+
+export interface ElicitationRequest {
+  id: number;
+  message: string;
+  requestedSchema: JsonSchemaType;
+  resolve: (response: ElicitationResponse) => void;
+}
+
+export interface ElicitationResponse {
+  action: "accept" | "reject" | "cancel";
+  content?: Record<string, unknown>;
+}
+
+interface ElicitationModalProps {
+  request: ElicitationRequest | null;
+  onClose: () => void;
+}
+
+const ElicitationModal = ({ request, onClose }: ElicitationModalProps) => {
+  const [formData, setFormData] = useState<JsonValue>({});
+  const [validationError, setValidationError] = useState<string | null>(null);
+
+  useEffect(() => {
+    if (request) {
+      const defaultValue = generateDefaultValue(request.requestedSchema);
+      setFormData(defaultValue);
+      setValidationError(null);
+    }
+  }, [request]);
+
+  if (!request) return null;
+
+  const validateEmailFormat = (email: string): boolean => {
+    const emailRegex = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
+    return emailRegex.test(email);
+  };
+
+  const validateFormData = (
+    data: JsonValue,
+    schema: JsonSchemaType,
+  ): boolean => {
+    if (
+      schema.type === "object" &&
+      schema.properties &&
+      typeof data === "object" &&
+      data !== null
+    ) {
+      const dataObj = data as Record<string, unknown>;
+
+      if (Array.isArray(schema.required)) {
+        for (const field of schema.required) {
+          const value = dataObj[field];
+          if (value === undefined || value === null || value === "") {
+            setValidationError(`Required field missing: ${field}`);
+            return false;
+          }
+        }
+      }
+
+      for (const [fieldName, fieldValue] of Object.entries(dataObj)) {
+        const fieldSchema = schema.properties[fieldName];
+        if (
+          fieldSchema &&
+          fieldSchema.format === "email" &&
+          typeof fieldValue === "string"
+        ) {
+          if (!validateEmailFormat(fieldValue)) {
+            setValidationError(`Invalid email format: ${fieldName}`);
+            return false;
+          }
+        }
+      }
+    }
+
+    return true;
+  };
+
+  const handleAccept = () => {
+    try {
+      if (!validateFormData(formData, request.requestedSchema)) {
+        return;
+      }
+
+      const ajv = new Ajv();
+      const validate = ajv.compile(request.requestedSchema);
+      const isValid = validate(formData);
+
+      if (!isValid) {
+        const errorMessage = ajv.errorsText(validate.errors);
+        setValidationError(errorMessage);
+        return;
+      }
+
+      request.resolve({
+        action: "accept",
+        content: formData as Record<string, unknown>,
+      });
+      onClose();
+    } catch (error) {
+      setValidationError(
+        error instanceof Error ? error.message : "Validation failed",
+      );
+    }
+  };
+
+  const handleReject = () => {
+    request.resolve({ action: "reject" });
+    onClose();
+  };
+
+  const handleCancel = () => {
+    request.resolve({ action: "cancel" });
+    onClose();
+  };
+
+  const schemaTitle = request.requestedSchema.title || "Information Request";
+  const schemaDescription = request.requestedSchema.description;
+
+  return (
+    <Dialog open={true} onOpenChange={handleCancel}>
+      <DialogContent className="max-w-2xl max-h-[80vh] overflow-y-auto">
+        <DialogHeader>
+          <DialogTitle>{schemaTitle}</DialogTitle>
+          <DialogDescription className="space-y-2">
+            <span className="block">{request.message}</span>
+            {schemaDescription && (
+              <span className="block text-sm text-muted-foreground">
+                {schemaDescription}
+              </span>
+            )}
+          </DialogDescription>
+        </DialogHeader>
+
+        <div className="py-4">
+          <DynamicJsonForm
+            schema={request.requestedSchema}
+            value={formData}
+            onChange={(newValue: JsonValue) => {
+              setFormData(newValue);
+              setValidationError(null);
+            }}
+          />
+
+          {validationError && (
+            <div className="mt-4 p-3 bg-red-50 dark:bg-red-900/20 border border-red-200 dark:border-red-800 rounded-md">
+              <div className="text-sm text-red-600 dark:text-red-400">
+                <strong>Validation Error:</strong> {validationError}
+              </div>
+            </div>
+          )}
+        </div>
+
+        <DialogFooter className="gap-2">
+          <Button variant="outline" onClick={handleCancel}>
+            Cancel
+          </Button>
+          <Button variant="outline" onClick={handleReject}>
+            Decline
+          </Button>
+          <Button onClick={handleAccept}>Submit</Button>
+        </DialogFooter>
+      </DialogContent>
+    </Dialog>
+  );
+};
+
+export default ElicitationModal;
diff --git a/client/src/components/__tests__/ElicitationModal.test.tsx b/client/src/components/__tests__/ElicitationModal.test.tsx
new file mode 100644
index 000000000..31a06815f
--- /dev/null
+++ b/client/src/components/__tests__/ElicitationModal.test.tsx
@@ -0,0 +1,535 @@
+import { render, screen, fireEvent, act } from "@testing-library/react";
+import "@testing-library/jest-dom";
+import { describe, it, jest, beforeEach, afterEach } from "@jest/globals";
+import ElicitationModal, { ElicitationRequest } from "../ElicitationModal";
+import { JsonSchemaType } from "@/utils/jsonUtils";
+import * as schemaUtils from "@/utils/schemaUtils";
+
+jest.mock("../DynamicJsonForm", () => {
+  return function MockDynamicJsonForm({
+    value,
+    onChange,
+  }: {
+    value: unknown;
+    onChange: (value: unknown) => void;
+  }) {
+    return (
+      <div data-testid="dynamic-json-form">
+        <input
+          data-testid="form-input"
+          value={
+            typeof value === "object" && value !== null
+              ? JSON.stringify(value)
+              : String(value || "")
+          }
+          onChange={(e) => {
+            try {
+              const parsed = JSON.parse(e.target.value);
+              onChange(parsed);
+            } catch {
+              onChange(e.target.value);
+            }
+          }}
+        />
+      </div>
+    );
+  };
+});
+
+jest.mock("@/components/ui/dialog", () => ({
+  Dialog: ({
+    children,
+    open,
+    onOpenChange,
+  }: {
+    children: React.ReactNode;
+    open: boolean;
+    onOpenChange: () => void;
+  }) =>
+    open ? (
+      <div data-testid="dialog" onClick={onOpenChange}>
+        {children}
+      </div>
+    ) : null,
+  DialogContent: ({
+    children,
+    className,
+  }: {
+    children: React.ReactNode;
+    className?: string;
+  }) => (
+    <div data-testid="dialog-content" className={className}>
+      {children}
+    </div>
+  ),
+  DialogHeader: ({ children }: { children: React.ReactNode }) => (
+    <div data-testid="dialog-header">{children}</div>
+  ),
+  DialogTitle: ({ children }: { children: React.ReactNode }) => (
+    <h2 data-testid="dialog-title">{children}</h2>
+  ),
+  DialogDescription: ({ children }: { children: React.ReactNode }) => (
+    <div data-testid="dialog-description">{children}</div>
+  ),
+  DialogFooter: ({ children }: { children: React.ReactNode }) => (
+    <div data-testid="dialog-footer">{children}</div>
+  ),
+}));
+
+jest.mock("@/components/ui/button", () => ({
+  Button: ({
+    children,
+    onClick,
+    variant,
+    ...props
+  }: {
+    children: React.ReactNode;
+    onClick?: () => void;
+    variant?: string;
+    [key: string]: unknown;
+  }) => (
+    <button
+      onClick={onClick}
+      data-testid={`button-${children?.toString().toLowerCase()}`}
+      data-variant={variant}
+      {...props}
+    >
+      {children}
+    </button>
+  ),
+}));
+
+jest.mock("@/utils/schemaUtils", () => ({
+  generateDefaultValue: jest.fn((schema: JsonSchemaType) => {
+    if (schema.type === "object" && schema.properties) {
+      const defaults: Record<string, unknown> = {};
+      Object.keys(schema.properties).forEach((key) => {
+        const prop = schema.properties![key];
+        if (prop.type === "string") defaults[key] = "";
+        if (prop.type === "number") defaults[key] = 0;
+        if (prop.type === "boolean") defaults[key] = false;
+      });
+      return defaults;
+    }
+    return {};
+  }),
+}));
+
+describe("ElicitationModal", () => {
+  const mockResolve = jest.fn();
+  const mockOnClose = jest.fn();
+
+  beforeEach(() => {
+    jest.clearAllMocks();
+  });
+
+  afterEach(() => {
+    jest.clearAllMocks();
+  });
+
+  const createMockRequest = (
+    overrides: Partial<ElicitationRequest> = {},
+  ): ElicitationRequest => ({
+    id: 1,
+    message: "Please provide your information",
+    requestedSchema: {
+      type: "object",
+      properties: {
+        name: { type: "string", description: "Your name" },
+        email: { type: "string", format: "email", description: "Your email" },
+      },
+      required: ["name"],
+    },
+    resolve: mockResolve,
+    ...overrides,
+  });
+
+  const renderElicitationModal = (
+    request: ElicitationRequest | null = null,
+  ) => {
+    return render(
+      <ElicitationModal
+        request={request || createMockRequest()}
+        onClose={mockOnClose}
+      />,
+    );
+  };
+
+  describe("Rendering", () => {
+    it("should render null when no request is provided", () => {
+      render(<ElicitationModal request={null} onClose={mockOnClose} />);
+      expect(screen.queryByTestId("dialog")).not.toBeInTheDocument();
+    });
+
+    it("should render dialog when request is provided", () => {
+      renderElicitationModal();
+      expect(screen.getByTestId("dialog")).toBeInTheDocument();
+      expect(screen.getByTestId("dialog-content")).toBeInTheDocument();
+    });
+
+    it("should display request message", () => {
+      const message = "Please provide your GitHub username";
+      renderElicitationModal(createMockRequest({ message }));
+      expect(screen.getByText(message)).toBeInTheDocument();
+    });
+
+    it("should display schema title when provided", () => {
+      const request = createMockRequest({
+        requestedSchema: {
+          type: "object",
+          title: "User Information",
+          properties: { name: { type: "string" } },
+        },
+      });
+      renderElicitationModal(request);
+      expect(screen.getByText("User Information")).toBeInTheDocument();
+    });
+
+    it("should display default title when schema title is not provided", () => {
+      renderElicitationModal();
+      expect(screen.getByText("Information Request")).toBeInTheDocument();
+    });
+
+    it("should display schema description when provided", () => {
+      const description = "Please fill out your contact details";
+      const request = createMockRequest({
+        requestedSchema: {
+          type: "object",
+          description,
+          properties: { name: { type: "string" } },
+        },
+      });
+      renderElicitationModal(request);
+      expect(screen.getByText(description)).toBeInTheDocument();
+    });
+
+    it("should render all three action buttons", () => {
+      renderElicitationModal();
+      expect(screen.getByTestId("button-cancel")).toBeInTheDocument();
+      expect(screen.getByTestId("button-decline")).toBeInTheDocument();
+      expect(screen.getByTestId("button-submit")).toBeInTheDocument();
+    });
+
+    it("should render DynamicJsonForm component", () => {
+      renderElicitationModal();
+      expect(screen.getByTestId("dynamic-json-form")).toBeInTheDocument();
+    });
+  });
+
+  describe("User Interactions", () => {
+    it("should call resolve with accept action when Submit button is clicked", async () => {
+      renderElicitationModal();
+
+      const input = screen.getByTestId("form-input");
+      await act(async () => {
+        fireEvent.change(input, {
+          target: {
+            value: '{"name": "John Doe", "email": "john@example.com"}',
+          },
+        });
+      });
+
+      await act(async () => {
+        fireEvent.click(screen.getByTestId("button-submit"));
+      });
+
+      expect(mockResolve).toHaveBeenCalledWith({
+        action: "accept",
+        content: { name: "John Doe", email: "john@example.com" },
+      });
+      expect(mockOnClose).toHaveBeenCalled();
+    });
+
+    it("should call resolve with reject action when Decline button is clicked", async () => {
+      renderElicitationModal();
+
+      await act(async () => {
+        fireEvent.click(screen.getByTestId("button-decline"));
+      });
+
+      expect(mockResolve).toHaveBeenCalledWith({ action: "reject" });
+      expect(mockOnClose).toHaveBeenCalled();
+    });
+
+    it("should call resolve with cancel action when Cancel button is clicked", async () => {
+      renderElicitationModal();
+
+      await act(async () => {
+        fireEvent.click(screen.getByTestId("button-cancel"));
+      });
+
+      expect(mockResolve).toHaveBeenCalledWith({ action: "cancel" });
+      expect(mockOnClose).toHaveBeenCalled();
+    });
+
+    it("should call resolve with cancel action when dialog is closed", async () => {
+      renderElicitationModal();
+
+      await act(async () => {
+        fireEvent.click(screen.getByTestId("dialog"));
+      });
+
+      expect(mockResolve).toHaveBeenCalledWith({ action: "cancel" });
+      expect(mockOnClose).toHaveBeenCalled();
+    });
+  });
+
+  describe("Form Validation", () => {
+    it("should show validation error for missing required fields", async () => {
+      renderElicitationModal();
+
+      await act(async () => {
+        fireEvent.click(screen.getByTestId("button-submit"));
+      });
+
+      expect(
+        screen.getByText(/Required field missing: name/),
+      ).toBeInTheDocument();
+      expect(mockResolve).not.toHaveBeenCalledWith(
+        expect.objectContaining({ action: "accept" }),
+      );
+    });
+
+    it("should show validation error for invalid email format", async () => {
+      renderElicitationModal();
+
+      const input = screen.getByTestId("form-input");
+      await act(async () => {
+        fireEvent.change(input, {
+          target: { value: '{"name": "John", "email": "invalid-email"}' },
+        });
+      });
+
+      await act(async () => {
+        fireEvent.click(screen.getByTestId("button-submit"));
+      });
+
+      expect(
+        screen.getByText(/Invalid email format: email/),
+      ).toBeInTheDocument();
+      expect(mockResolve).not.toHaveBeenCalledWith(
+        expect.objectContaining({ action: "accept" }),
+      );
+    });
+
+    it("should clear validation error when form data changes", async () => {
+      renderElicitationModal();
+
+      await act(async () => {
+        fireEvent.click(screen.getByTestId("button-submit"));
+      });
+
+      expect(screen.getByText(/Required field missing/)).toBeInTheDocument();
+
+      const input = screen.getByTestId("form-input");
+      await act(async () => {
+        fireEvent.change(input, { target: { value: '{"name": "John"}' } });
+      });
+
+      expect(
+        screen.queryByText(/Required field missing/),
+      ).not.toBeInTheDocument();
+    });
+
+    it("should show AJV validation errors", async () => {
+      const mockAjv = {
+        compile: jest.fn(() => ({
+          errors: [{ instancePath: "/name", message: "should be string" }],
+        })),
+        errorsText: jest.fn(() => "data/name should be string"),
+      };
+
+      jest.doMock("ajv", () => jest.fn(() => mockAjv));
+
+      renderElicitationModal();
+
+      const input = screen.getByTestId("form-input");
+      await act(async () => {
+        fireEvent.change(input, { target: { value: '{"name": "John"}' } });
+      });
+
+      await act(async () => {
+        fireEvent.click(screen.getByTestId("button-submit"));
+      });
+    });
+  });
+
+  describe("Email Validation", () => {
+    it("should accept valid email formats", async () => {
+      const validEmails = [
+        "test@example.com",
+        "user.name@domain.co.uk",
+        "user+tag@example.org",
+      ];
+
+      for (const email of validEmails) {
+        renderElicitationModal();
+
+        const input = screen.getByTestId("form-input");
+        await act(async () => {
+          fireEvent.change(input, {
+            target: { value: `{"name": "John", "email": "${email}"}` },
+          });
+        });
+
+        await act(async () => {
+          fireEvent.click(screen.getByTestId("button-submit"));
+        });
+
+        expect(mockResolve).toHaveBeenCalledWith({
+          action: "accept",
+          content: { name: "John", email },
+        });
+
+        jest.clearAllMocks();
+        document.body.innerHTML = "";
+      }
+    });
+
+    it("should reject invalid email formats", async () => {
+      const invalidEmails = [
+        "invalid-email",
+        "@example.com",
+        "user@",
+        "user.example.com",
+      ];
+
+      for (const email of invalidEmails) {
+        renderElicitationModal();
+
+        const input = screen.getByTestId("form-input");
+        await act(async () => {
+          fireEvent.change(input, {
+            target: { value: `{"name": "John", "email": "${email}"}` },
+          });
+        });
+
+        await act(async () => {
+          fireEvent.click(screen.getByTestId("button-submit"));
+        });
+
+        expect(
+          screen.getByText(/Invalid email format: email/),
+        ).toBeInTheDocument();
+        expect(mockResolve).not.toHaveBeenCalledWith(
+          expect.objectContaining({ action: "accept" }),
+        );
+
+        jest.clearAllMocks();
+        document.body.innerHTML = "";
+      }
+    });
+  });
+
+  describe("Schema Types", () => {
+    it("should handle string schema", () => {
+      const request = createMockRequest({
+        requestedSchema: {
+          type: "object",
+          properties: {
+            username: { type: "string", description: "Username" },
+          },
+        },
+      });
+      renderElicitationModal(request);
+      expect(screen.getByTestId("dynamic-json-form")).toBeInTheDocument();
+    });
+
+    it("should handle number schema", () => {
+      const request = createMockRequest({
+        requestedSchema: {
+          type: "object",
+          properties: {
+            age: { type: "number", minimum: 0, maximum: 120 },
+          },
+        },
+      });
+      renderElicitationModal(request);
+      expect(screen.getByTestId("dynamic-json-form")).toBeInTheDocument();
+    });
+
+    it("should handle boolean schema", () => {
+      const request = createMockRequest({
+        requestedSchema: {
+          type: "object",
+          properties: {
+            subscribe: {
+              type: "boolean",
+              description: "Subscribe to newsletter",
+            },
+          },
+        },
+      });
+      renderElicitationModal(request);
+      expect(screen.getByTestId("dynamic-json-form")).toBeInTheDocument();
+    });
+
+    it("should handle enum schema", () => {
+      const request = createMockRequest({
+        requestedSchema: {
+          type: "object",
+          properties: {
+            country: {
+              type: "string",
+              enum: ["US", "UK", "CA"],
+              enumNames: ["United States", "United Kingdom", "Canada"],
+            },
+          },
+        },
+      });
+      renderElicitationModal(request);
+      expect(screen.getByTestId("dynamic-json-form")).toBeInTheDocument();
+    });
+  });
+
+  describe("Error Handling", () => {
+    it("should handle validation errors gracefully", async () => {
+      renderElicitationModal();
+
+      await act(async () => {
+        fireEvent.click(screen.getByTestId("button-submit"));
+      });
+
+      expect(screen.getByText(/Validation Error/)).toBeInTheDocument();
+    });
+
+    it("should handle JSON parsing errors in form validation", async () => {
+      renderElicitationModal();
+
+      const input = screen.getByTestId("form-input");
+      await act(async () => {
+        fireEvent.change(input, { target: { value: "invalid json" } });
+      });
+
+      await act(async () => {
+        fireEvent.click(screen.getByTestId("button-submit"));
+      });
+
+      expect(mockResolve).not.toHaveBeenCalledWith(
+        expect.objectContaining({ action: "accept" }),
+      );
+    });
+  });
+
+  describe("Default Values", () => {
+    it("should generate default values when request changes", () => {
+      const { rerender } = renderElicitationModal();
+
+      const newRequest = createMockRequest({
+        id: 2,
+        requestedSchema: {
+          type: "object",
+          properties: {
+            newField: { type: "string" },
+          },
+        },
+      });
+
+      rerender(<ElicitationModal request={newRequest} onClose={mockOnClose} />);
+
+      expect(schemaUtils.generateDefaultValue).toHaveBeenCalledWith(
+        newRequest.requestedSchema,
+      );
+    });
+  });
+});

From fc939ebeb06c9b4e6181e8ebaff4e81535dda187 Mon Sep 17 00:00:00 2001
From: Alex Andru <alex007d@gmail.com>
Date: Thu, 19 Jun 2025 16:32:53 +0200
Subject: [PATCH 04/20] feat: add elicitation support to jsonUtils

---
 client/src/utils/jsonUtils.ts | 11 ++++++++++-
 1 file changed, 10 insertions(+), 1 deletion(-)

diff --git a/client/src/utils/jsonUtils.ts b/client/src/utils/jsonUtils.ts
index 28cbf3030..9ba5ceef4 100644
--- a/client/src/utils/jsonUtils.ts
+++ b/client/src/utils/jsonUtils.ts
@@ -16,11 +16,20 @@ export type JsonSchemaType = {
     | "array"
     | "object"
     | "null";
+  title?: string;
   description?: string;
-  required?: boolean;
+  required?: boolean | string[];
   default?: JsonValue;
   properties?: Record<string, JsonSchemaType>;
   items?: JsonSchemaType;
+  minimum?: number;
+  maximum?: number;
+  minLength?: number;
+  maxLength?: number;
+  pattern?: string;
+  format?: string;
+  enum?: string[];
+  enumNames?: string[];
 };
 
 export type JsonObject = { [key: string]: JsonValue };

From 6c809bdab643d00445db8a4d002950640bd0e5aa Mon Sep 17 00:00:00 2001
From: Alex Andru <alex007d@gmail.com>
Date: Thu, 19 Jun 2025 16:33:05 +0200
Subject: [PATCH 05/20] test: new elicitation format for jsonUtils

---
 client/src/utils/__tests__/jsonUtils.test.ts | 111 ++++++++++++++++++-
 1 file changed, 110 insertions(+), 1 deletion(-)

diff --git a/client/src/utils/__tests__/jsonUtils.test.ts b/client/src/utils/__tests__/jsonUtils.test.ts
index 055e1dfd0..92a925a86 100644
--- a/client/src/utils/__tests__/jsonUtils.test.ts
+++ b/client/src/utils/__tests__/jsonUtils.test.ts
@@ -4,7 +4,7 @@ import {
   updateValueAtPath,
   getValueAtPath,
 } from "../jsonUtils";
-import type { JsonValue } from "../jsonUtils";
+import type { JsonValue, JsonSchemaType } from "../jsonUtils";
 
 describe("getDataType", () => {
   test("should return 'string' for string values", () => {
@@ -317,3 +317,112 @@ describe("getValueAtPath", () => {
     expect(getValueAtPath(obj, ["users", "1", "name"])).toBe("Jane");
   });
 });
+
+describe("JsonSchemaType elicitation field support", () => {
+  const sampleSchema: JsonSchemaType = {
+    type: "object",
+    title: "User Info",
+    description: "User information form",
+    properties: {
+      name: {
+        type: "string",
+        title: "Full Name",
+        description: "Your full name",
+        minLength: 2,
+        maxLength: 50,
+        pattern: "^[A-Za-z\\s]+$",
+      },
+      email: {
+        type: "string",
+        format: "email",
+        title: "Email Address",
+      },
+      age: {
+        type: "integer",
+        minimum: 18,
+        maximum: 120,
+        default: 25,
+      },
+      role: {
+        type: "string",
+        enum: ["admin", "user", "guest"],
+        enumNames: ["Administrator", "User", "Guest"],
+      },
+    },
+    required: ["name", "email"],
+  };
+
+  test("should parse JsonSchemaType with elicitation fields", () => {
+    const schemaString = JSON.stringify(sampleSchema);
+    const result = tryParseJson(schemaString);
+
+    expect(result.success).toBe(true);
+    expect(result.data).toEqual(sampleSchema);
+  });
+
+  test("should update schema properties with new validation fields", () => {
+    const updated = updateValueAtPath(
+      sampleSchema,
+      ["properties", "name", "minLength"],
+      5,
+    );
+
+    expect(getValueAtPath(updated, ["properties", "name", "minLength"])).toBe(
+      5,
+    );
+  });
+
+  test("should handle enum and enumNames fields", () => {
+    const schema = {
+      type: "string" as const,
+      enum: ["option1", "option2"],
+      enumNames: ["Option 1", "Option 2"],
+    };
+
+    expect(getValueAtPath(schema, ["enum", "0"])).toBe("option1");
+    expect(getValueAtPath(schema, ["enumNames", "1"])).toBe("Option 2");
+  });
+
+  test("should handle validation constraints", () => {
+    const numberSchema = {
+      type: "number" as const,
+      minimum: 0,
+      maximum: 100,
+      default: 50,
+    };
+
+    expect(getValueAtPath(numberSchema, ["minimum"])).toBe(0);
+    expect(getValueAtPath(numberSchema, ["maximum"])).toBe(100);
+    expect(getValueAtPath(numberSchema, ["default"])).toBe(50);
+  });
+
+  test("should handle string format and pattern fields", () => {
+    const stringSchema = {
+      type: "string" as const,
+      format: "email",
+      pattern: "^[a-z]+@[a-z]+\\.[a-z]+$",
+      minLength: 5,
+      maxLength: 100,
+    };
+
+    expect(getValueAtPath(stringSchema, ["format"])).toBe("email");
+    expect(getValueAtPath(stringSchema, ["pattern"])).toBe(
+      "^[a-z]+@[a-z]+\\.[a-z]+$",
+    );
+    expect(getValueAtPath(stringSchema, ["minLength"])).toBe(5);
+  });
+
+  test("should handle title and description fields", () => {
+    const schema = {
+      type: "boolean" as const,
+      title: "Accept Terms",
+      description: "Do you accept the terms and conditions?",
+      default: false,
+    };
+
+    expect(getValueAtPath(schema, ["title"])).toBe("Accept Terms");
+    expect(getValueAtPath(schema, ["description"])).toBe(
+      "Do you accept the terms and conditions?",
+    );
+  });
+});

From 124c78125365c4a41e5479b08ad307a5b472f45b Mon Sep 17 00:00:00 2001
From: Alex Andru <alex007d@gmail.com>
Date: Thu, 19 Jun 2025 17:22:44 +0200
Subject: [PATCH 06/20] feat: add elicitation handling to App

---
 client/src/App.tsx | 22 ++++++++++++++++++++++
 1 file changed, 22 insertions(+)

diff --git a/client/src/App.tsx b/client/src/App.tsx
index 26eb44c5e..8e5570ae5 100644
--- a/client/src/App.tsx
+++ b/client/src/App.tsx
@@ -71,6 +71,9 @@ import {
   initializeInspectorConfig,
   saveInspectorConfig,
 } from "./utils/configUtils";
+import ElicitationModal, {
+  ElicitationRequest,
+} from "./components/ElicitationModal";
 
 const CONFIG_LOCAL_STORAGE_KEY = "inspectorConfig_v1";
 
@@ -124,6 +127,8 @@ const App = () => {
       }
     >
   >([]);
+  const [pendingElicitationRequest, setPendingElicitationRequest] =
+    useState<ElicitationRequest | null>(null);
   const [isAuthDebuggerVisible, setIsAuthDebuggerVisible] = useState(false);
 
   // Auth debugger state
@@ -200,6 +205,14 @@ const App = () => {
         { id: nextRequestId.current++, request, resolve, reject },
       ]);
     },
+    onElicitationRequest: (request, resolve) => {
+      setPendingElicitationRequest({
+        id: nextRequestId.current++,
+        message: request.params.message,
+        requestedSchema: request.params.requestedSchema,
+        resolve,
+      });
+    },
     getRoots: () => rootsRef.current,
   });
 
@@ -586,6 +599,10 @@ const App = () => {
     setStdErrNotifications([]);
   };
 
+  const handleCloseElicitationModal = () => {
+    setPendingElicitationRequest(null);
+  };
+
   // Helper component for rendering the AuthDebugger
   const AuthDebuggerWrapper = () => (
     <TabsContent value="auth">
@@ -938,6 +955,11 @@ const App = () => {
           </div>
         </div>
       </div>
+
+      <ElicitationModal
+        request={pendingElicitationRequest}
+        onClose={handleCloseElicitationModal}
+      />
     </div>
   );
 };

From dfbf10c575c6ecbf4c8a5226ef06b84acf2dba1b Mon Sep 17 00:00:00 2001
From: Alex Andru <alex007d@gmail.com>
Date: Thu, 19 Jun 2025 17:23:16 +0200
Subject: [PATCH 07/20] test: elicitation handling

---
 .../hooks/__tests__/useConnection.test.tsx    | 250 ++++++++++++++++++
 1 file changed, 250 insertions(+)

diff --git a/client/src/lib/hooks/__tests__/useConnection.test.tsx b/client/src/lib/hooks/__tests__/useConnection.test.tsx
index 676ae87d8..6af4fa3dd 100644
--- a/client/src/lib/hooks/__tests__/useConnection.test.tsx
+++ b/client/src/lib/hooks/__tests__/useConnection.test.tsx
@@ -4,6 +4,10 @@ import { z } from "zod";
 import { ClientRequest } from "@modelcontextprotocol/sdk/types.js";
 import { DEFAULT_INSPECTOR_CONFIG } from "../../constants";
 import { SSEClientTransportOptions } from "@modelcontextprotocol/sdk/client/sse.js";
+import {
+  ElicitResult,
+  ElicitRequest,
+} from "@modelcontextprotocol/sdk/types.js";
 
 // Mock fetch
 global.fetch = jest.fn().mockResolvedValue({
@@ -198,6 +202,252 @@ describe("useConnection", () => {
     ).rejects.toThrow("MCP client not connected");
   });
 
+  describe("Elicitation Support", () => {
+    beforeEach(() => {
+      jest.clearAllMocks();
+    });
+
+    test("declares elicitation capability during client initialization", async () => {
+      const Client = jest.requireMock(
+        "@modelcontextprotocol/sdk/client/index.js",
+      ).Client;
+
+      const { result } = renderHook(() => useConnection(defaultProps));
+
+      await act(async () => {
+        await result.current.connect();
+      });
+
+      expect(Client).toHaveBeenCalledWith(
+        expect.objectContaining({
+          name: "mcp-inspector",
+          version: expect.any(String),
+        }),
+        expect.objectContaining({
+          capabilities: expect.objectContaining({
+            elicitation: {},
+          }),
+        }),
+      );
+    });
+
+    test("sets up elicitation request handler when onElicitationRequest is provided", async () => {
+      const mockOnElicitationRequest = jest.fn();
+      const propsWithElicitation = {
+        ...defaultProps,
+        onElicitationRequest: mockOnElicitationRequest,
+      };
+
+      const { result } = renderHook(() => useConnection(propsWithElicitation));
+
+      await act(async () => {
+        await result.current.connect();
+      });
+
+      const elicitRequestHandlerCall =
+        mockClient.setRequestHandler.mock.calls.find((call) => {
+          try {
+            const schema = call[0];
+            const testRequest = {
+              method: "elicitation/create",
+              params: {
+                message: "test message",
+                requestedSchema: {
+                  type: "object",
+                  properties: {
+                    name: { type: "string" },
+                  },
+                },
+              },
+            };
+            const parseResult =
+              schema.safeParse && schema.safeParse(testRequest);
+            return parseResult?.success;
+          } catch {
+            return false;
+          }
+        });
+
+      expect(elicitRequestHandlerCall).toBeDefined();
+      expect(mockClient.setRequestHandler).toHaveBeenCalledWith(
+        expect.any(Object),
+        expect.any(Function),
+      );
+    });
+
+    test("does not set up elicitation request handler when onElicitationRequest is not provided", async () => {
+      const { result } = renderHook(() => useConnection(defaultProps));
+
+      await act(async () => {
+        await result.current.connect();
+      });
+
+      const elicitRequestHandlerCall =
+        mockClient.setRequestHandler.mock.calls.find((call) => {
+          try {
+            const schema = call[0];
+            const testRequest = {
+              method: "elicitation/create",
+              params: {
+                message: "test message",
+                requestedSchema: {
+                  type: "object",
+                  properties: {
+                    name: { type: "string" },
+                  },
+                },
+              },
+            };
+            const parseResult =
+              schema.safeParse && schema.safeParse(testRequest);
+            return parseResult?.success;
+          } catch {
+            return false;
+          }
+        });
+
+      expect(elicitRequestHandlerCall).toBeUndefined();
+    });
+
+    test("elicitation request handler calls onElicitationRequest callback", async () => {
+      const mockOnElicitationRequest = jest.fn();
+      const propsWithElicitation = {
+        ...defaultProps,
+        onElicitationRequest: mockOnElicitationRequest,
+      };
+
+      const { result } = renderHook(() => useConnection(propsWithElicitation));
+
+      await act(async () => {
+        await result.current.connect();
+      });
+
+      const elicitRequestHandlerCall =
+        mockClient.setRequestHandler.mock.calls.find((call) => {
+          try {
+            const schema = call[0];
+            const testRequest = {
+              method: "elicitation/create",
+              params: {
+                message: "test message",
+                requestedSchema: {
+                  type: "object",
+                  properties: {
+                    name: { type: "string" },
+                  },
+                },
+              },
+            };
+            const parseResult =
+              schema.safeParse && schema.safeParse(testRequest);
+            return parseResult?.success;
+          } catch {
+            return false;
+          }
+        });
+
+      expect(elicitRequestHandlerCall).toBeDefined();
+      const [, handler] = elicitRequestHandlerCall;
+
+      const mockElicitationRequest: ElicitRequest = {
+        method: "elicitation/create",
+        params: {
+          message: "Please provide your name",
+          requestedSchema: {
+            type: "object",
+            properties: {
+              name: { type: "string" },
+            },
+            required: ["name"],
+          },
+        },
+      };
+
+      mockOnElicitationRequest.mockImplementation((_request, resolve) => {
+        resolve({ action: "accept", content: { name: "test" } });
+      });
+
+      await act(async () => {
+        await handler(mockElicitationRequest);
+      });
+
+      expect(mockOnElicitationRequest).toHaveBeenCalledWith(
+        mockElicitationRequest,
+        expect.any(Function),
+      );
+    });
+
+    test("elicitation request handler returns a promise that resolves with the callback result", async () => {
+      const mockOnElicitationRequest = jest.fn();
+      const propsWithElicitation = {
+        ...defaultProps,
+        onElicitationRequest: mockOnElicitationRequest,
+      };
+
+      const { result } = renderHook(() => useConnection(propsWithElicitation));
+
+      await act(async () => {
+        await result.current.connect();
+      });
+
+      const elicitRequestHandlerCall =
+        mockClient.setRequestHandler.mock.calls.find((call) => {
+          try {
+            const schema = call[0];
+            const testRequest = {
+              method: "elicitation/create",
+              params: {
+                message: "test message",
+                requestedSchema: {
+                  type: "object",
+                  properties: {
+                    name: { type: "string" },
+                  },
+                },
+              },
+            };
+            const parseResult =
+              schema.safeParse && schema.safeParse(testRequest);
+            return parseResult?.success;
+          } catch {
+            return false;
+          }
+        });
+
+      const [, handler] = elicitRequestHandlerCall;
+
+      const mockElicitationRequest: ElicitRequest = {
+        method: "elicitation/create",
+        params: {
+          message: "Please provide your name",
+          requestedSchema: {
+            type: "object",
+            properties: {
+              name: { type: "string" },
+            },
+            required: ["name"],
+          },
+        },
+      };
+
+      const mockResponse: ElicitResult = {
+        action: "accept",
+        content: { name: "John Doe" },
+      };
+
+      mockOnElicitationRequest.mockImplementation((_request, resolve) => {
+        resolve(mockResponse);
+      });
+
+      let handlerResult;
+      await act(async () => {
+        handlerResult = await handler(mockElicitationRequest);
+      });
+
+      expect(handlerResult).toEqual(mockResponse);
+    });
+  });
+
   describe("URL Port Handling", () => {
     const SSEClientTransport = jest.requireMock(
       "@modelcontextprotocol/sdk/client/sse.js",

From 8053e692cf747a6d473e358d855acd7cce958ac4 Mon Sep 17 00:00:00 2001
From: Alex Andru <58406316+QuantGeekDev@users.noreply.github.com>
Date: Fri, 4 Jul 2025 09:42:46 +0200
Subject: [PATCH 08/20] Update package-lock.json

Co-authored-by: Cliff Hall <cliff@futurescale.com>
---
 package-lock.json | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/package-lock.json b/package-lock.json
index e557269ad..12663dd5d 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -17,7 +17,7 @@
         "@modelcontextprotocol/inspector-cli": "^0.14.3",
         "@modelcontextprotocol/inspector-client": "^0.14.3",
         "@modelcontextprotocol/inspector-server": "^0.14.3",
-        "@modelcontextprotocol/sdk": "^1.13.0",
+        "@modelcontextprotocol/sdk": "^1.14.0",
         "concurrently": "^9.0.1",
         "open": "^10.1.0",
         "shell-quote": "^1.8.2",

From ea97f37ee874beb85a9bc5300bc6475f318e96ba Mon Sep 17 00:00:00 2001
From: Alex Andru <58406316+QuantGeekDev@users.noreply.github.com>
Date: Fri, 4 Jul 2025 09:59:37 +0200
Subject: [PATCH 09/20] Update client/package.json

Co-authored-by: Cliff Hall <cliff@futurescale.com>
---
 client/package.json | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/client/package.json b/client/package.json
index ffeafcc7e..b25901933 100644
--- a/client/package.json
+++ b/client/package.json
@@ -23,7 +23,7 @@
     "test:watch": "jest --config jest.config.cjs --watch"
   },
   "dependencies": {
-    "@modelcontextprotocol/sdk": "^1.12.1",
+    "@modelcontextprotocol/sdk": "^1.14.0",
     "@radix-ui/react-checkbox": "^1.1.4",
     "@radix-ui/react-dialog": "^1.1.3",
     "@radix-ui/react-icons": "^1.3.0",

From b4a2a6b7f8e278800ab228fcf55cb82c3051808a Mon Sep 17 00:00:00 2001
From: Alex Andru <alex007d@gmail.com>
Date: Fri, 4 Jul 2025 04:48:55 +0200
Subject: [PATCH 10/20] feat: add elicitation request

---
 client/src/components/ElicitationRequest.tsx | 173 +++++++++++++++++++
 1 file changed, 173 insertions(+)
 create mode 100644 client/src/components/ElicitationRequest.tsx

diff --git a/client/src/components/ElicitationRequest.tsx b/client/src/components/ElicitationRequest.tsx
new file mode 100644
index 000000000..dc3f5962e
--- /dev/null
+++ b/client/src/components/ElicitationRequest.tsx
@@ -0,0 +1,173 @@
+import { useState, useEffect } from "react";
+import { Button } from "@/components/ui/button";
+import DynamicJsonForm from "./DynamicJsonForm";
+import JsonView from "./JsonView";
+import { JsonSchemaType, JsonValue } from "@/utils/jsonUtils";
+import { generateDefaultValue } from "@/utils/schemaUtils";
+import {
+  PendingElicitationRequest,
+  ElicitationResponse,
+} from "./ElicitationTab";
+import Ajv from "ajv";
+
+export type ElicitationRequestProps = {
+  request: PendingElicitationRequest;
+  onResolve: (id: number, response: ElicitationResponse) => void;
+};
+
+const ElicitationRequest = ({
+  request,
+  onResolve,
+}: ElicitationRequestProps) => {
+  const [formData, setFormData] = useState<JsonValue>({});
+  const [validationError, setValidationError] = useState<string | null>(null);
+
+  useEffect(() => {
+    const defaultValue = generateDefaultValue(request.request.requestedSchema);
+    setFormData(defaultValue);
+    setValidationError(null);
+  }, [request.request.requestedSchema]);
+
+  const validateEmailFormat = (email: string): boolean => {
+    const emailRegex = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
+    return emailRegex.test(email);
+  };
+
+  const validateFormData = (
+    data: JsonValue,
+    schema: JsonSchemaType,
+  ): boolean => {
+    if (
+      schema.type === "object" &&
+      schema.properties &&
+      typeof data === "object" &&
+      data !== null
+    ) {
+      const dataObj = data as Record<string, unknown>;
+
+      if (Array.isArray(schema.required)) {
+        for (const field of schema.required) {
+          const value = dataObj[field];
+          if (value === undefined || value === null || value === "") {
+            setValidationError(`Required field missing: ${field}`);
+            return false;
+          }
+        }
+      }
+
+      for (const [fieldName, fieldValue] of Object.entries(dataObj)) {
+        const fieldSchema = schema.properties[fieldName];
+        if (
+          fieldSchema &&
+          fieldSchema.format === "email" &&
+          typeof fieldValue === "string"
+        ) {
+          if (!validateEmailFormat(fieldValue)) {
+            setValidationError(`Invalid email format: ${fieldName}`);
+            return false;
+          }
+        }
+      }
+    }
+
+    return true;
+  };
+
+  const handleAccept = () => {
+    try {
+      if (!validateFormData(formData, request.request.requestedSchema)) {
+        return;
+      }
+
+      const ajv = new Ajv();
+      const validate = ajv.compile(request.request.requestedSchema);
+      const isValid = validate(formData);
+
+      if (!isValid) {
+        const errorMessage = ajv.errorsText(validate.errors);
+        setValidationError(errorMessage);
+        return;
+      }
+
+      onResolve(request.id, {
+        action: "accept",
+        content: formData as Record<string, unknown>,
+      });
+    } catch (error) {
+      setValidationError(
+        error instanceof Error ? error.message : "Validation failed",
+      );
+    }
+  };
+
+  const handleReject = () => {
+    onResolve(request.id, { action: "reject" });
+  };
+
+  const handleCancel = () => {
+    onResolve(request.id, { action: "cancel" });
+  };
+
+  const schemaTitle =
+    request.request.requestedSchema.title || "Information Request";
+  const schemaDescription = request.request.requestedSchema.description;
+
+  return (
+    <div
+      data-testid="elicitation-request"
+      className="flex gap-4 p-4 border rounded-lg space-y-4"
+    >
+      <div className="flex-1 bg-gray-50 dark:bg-gray-800 dark:text-gray-100 p-2 rounded">
+        <div className="space-y-2">
+          <h4 className="font-semibold">{schemaTitle}</h4>
+          <p className="text-sm">{request.request.message}</p>
+          {schemaDescription && (
+            <p className="text-xs text-muted-foreground">{schemaDescription}</p>
+          )}
+          <div className="mt-2">
+            <h5 className="text-xs font-medium mb-1">Request Schema:</h5>
+            <JsonView
+              data={JSON.stringify(request.request.requestedSchema, null, 2)}
+            />
+          </div>
+        </div>
+      </div>
+
+      <div className="flex-1 space-y-4">
+        <div className="space-y-2">
+          <h4 className="font-medium">Response Form</h4>
+          <DynamicJsonForm
+            schema={request.request.requestedSchema}
+            value={formData}
+            onChange={(newValue: JsonValue) => {
+              setFormData(newValue);
+              setValidationError(null);
+            }}
+          />
+
+          {validationError && (
+            <div className="mt-4 p-3 bg-red-50 dark:bg-red-900/20 border border-red-200 dark:border-red-800 rounded-md">
+              <div className="text-sm text-red-600 dark:text-red-400">
+                <strong>Validation Error:</strong> {validationError}
+              </div>
+            </div>
+          )}
+        </div>
+
+        <div className="flex space-x-2 mt-1">
+          <Button type="button" onClick={handleAccept}>
+            Submit
+          </Button>
+          <Button type="button" variant="outline" onClick={handleReject}>
+            Decline
+          </Button>
+          <Button type="button" variant="outline" onClick={handleCancel}>
+            Cancel
+          </Button>
+        </div>
+      </div>
+    </div>
+  );
+};
+
+export default ElicitationRequest;

From 0411383d813bfe8cd2f79a8780d0d9d8493a1eef Mon Sep 17 00:00:00 2001
From: Alex Andru <alex007d@gmail.com>
Date: Fri, 4 Jul 2025 04:53:55 +0200
Subject: [PATCH 11/20] test: Elicitation request

---
 .../__tests__/ElicitationRequest.test.tsx     | 202 ++++++++++++++++++
 1 file changed, 202 insertions(+)
 create mode 100644 client/src/components/__tests__/ElicitationRequest.test.tsx

diff --git a/client/src/components/__tests__/ElicitationRequest.test.tsx b/client/src/components/__tests__/ElicitationRequest.test.tsx
new file mode 100644
index 000000000..c18fe3eb4
--- /dev/null
+++ b/client/src/components/__tests__/ElicitationRequest.test.tsx
@@ -0,0 +1,202 @@
+import { render, screen, fireEvent, act } from "@testing-library/react";
+import "@testing-library/jest-dom";
+import { describe, it, jest, beforeEach, afterEach } from "@jest/globals";
+import ElicitationRequest from "../ElicitationRequest";
+import { PendingElicitationRequest } from "../ElicitationTab";
+
+jest.mock("../DynamicJsonForm", () => {
+  return function MockDynamicJsonForm({
+    value,
+    onChange,
+  }: {
+    value: unknown;
+    onChange: (value: unknown) => void;
+  }) {
+    return (
+      <div data-testid="dynamic-json-form">
+        <input
+          data-testid="form-input"
+          value={
+            typeof value === "object" && value !== null
+              ? JSON.stringify(value)
+              : String(value || "")
+          }
+          onChange={(e) => {
+            try {
+              const parsed = JSON.parse(e.target.value);
+              onChange(parsed);
+            } catch {
+              onChange(e.target.value);
+            }
+          }}
+        />
+      </div>
+    );
+  };
+});
+
+describe("ElicitationRequest", () => {
+  const mockOnResolve = jest.fn();
+
+  beforeEach(() => {
+    jest.clearAllMocks();
+  });
+
+  afterEach(() => {
+    jest.clearAllMocks();
+  });
+
+  const createMockRequest = (
+    overrides: Partial<PendingElicitationRequest> = {},
+  ): PendingElicitationRequest => ({
+    id: 1,
+    request: {
+      id: 1,
+      message: "Please provide your information",
+      requestedSchema: {
+        type: "object",
+        properties: {
+          name: { type: "string", description: "Your name" },
+          email: { type: "string", format: "email", description: "Your email" },
+        },
+        required: ["name"],
+      },
+    },
+    ...overrides,
+  });
+
+  const renderElicitationRequest = (
+    request: PendingElicitationRequest = createMockRequest(),
+  ) => {
+    return render(
+      <ElicitationRequest request={request} onResolve={mockOnResolve} />,
+    );
+  };
+
+  describe("Rendering", () => {
+    it("should render the component", () => {
+      renderElicitationRequest();
+      expect(screen.getByTestId("elicitation-request")).toBeInTheDocument();
+    });
+
+    it("should display request message", () => {
+      const message = "Please provide your GitHub username";
+      renderElicitationRequest(
+        createMockRequest({
+          request: {
+            id: 1,
+            message,
+            requestedSchema: {
+              type: "object",
+              properties: { name: { type: "string" } },
+            },
+          },
+        }),
+      );
+      expect(screen.getByText(message)).toBeInTheDocument();
+    });
+
+    it("should render all three action buttons", () => {
+      renderElicitationRequest();
+      expect(
+        screen.getByRole("button", { name: /cancel/i }),
+      ).toBeInTheDocument();
+      expect(
+        screen.getByRole("button", { name: /decline/i }),
+      ).toBeInTheDocument();
+      expect(
+        screen.getByRole("button", { name: /submit/i }),
+      ).toBeInTheDocument();
+    });
+
+    it("should render DynamicJsonForm component", () => {
+      renderElicitationRequest();
+      expect(screen.getByTestId("dynamic-json-form")).toBeInTheDocument();
+    });
+  });
+
+  describe("User Interactions", () => {
+    it("should call onResolve with accept action when Submit button is clicked", async () => {
+      renderElicitationRequest();
+
+      const input = screen.getByTestId("form-input");
+      await act(async () => {
+        fireEvent.change(input, {
+          target: {
+            value: '{"name": "John Doe", "email": "john@example.com"}',
+          },
+        });
+      });
+
+      await act(async () => {
+        fireEvent.click(screen.getByRole("button", { name: /submit/i }));
+      });
+
+      expect(mockOnResolve).toHaveBeenCalledWith(1, {
+        action: "accept",
+        content: { name: "John Doe", email: "john@example.com" },
+      });
+    });
+
+    it("should call onResolve with reject action when Decline button is clicked", async () => {
+      renderElicitationRequest();
+
+      await act(async () => {
+        fireEvent.click(screen.getByRole("button", { name: /decline/i }));
+      });
+
+      expect(mockOnResolve).toHaveBeenCalledWith(1, { action: "reject" });
+    });
+
+    it("should call onResolve with cancel action when Cancel button is clicked", async () => {
+      renderElicitationRequest();
+
+      await act(async () => {
+        fireEvent.click(screen.getByRole("button", { name: /cancel/i }));
+      });
+
+      expect(mockOnResolve).toHaveBeenCalledWith(1, { action: "cancel" });
+    });
+  });
+
+  describe("Form Validation", () => {
+    it("should show validation error for missing required fields", async () => {
+      renderElicitationRequest();
+
+      await act(async () => {
+        fireEvent.click(screen.getByRole("button", { name: /submit/i }));
+      });
+
+      expect(
+        screen.getByText(/Required field missing: name/),
+      ).toBeInTheDocument();
+      expect(mockOnResolve).not.toHaveBeenCalledWith(
+        1,
+        expect.objectContaining({ action: "accept" }),
+      );
+    });
+
+    it("should show validation error for invalid email format", async () => {
+      renderElicitationRequest();
+
+      const input = screen.getByTestId("form-input");
+      await act(async () => {
+        fireEvent.change(input, {
+          target: { value: '{"name": "John", "email": "invalid-email"}' },
+        });
+      });
+
+      await act(async () => {
+        fireEvent.click(screen.getByRole("button", { name: /submit/i }));
+      });
+
+      expect(
+        screen.getByText(/Invalid email format: email/),
+      ).toBeInTheDocument();
+      expect(mockOnResolve).not.toHaveBeenCalledWith(
+        1,
+        expect.objectContaining({ action: "accept" }),
+      );
+    });
+  });
+});

From 9539c16845a0bf960a3935c14fba7ace9f8869e4 Mon Sep 17 00:00:00 2001
From: Alex Andru <alex007d@gmail.com>
Date: Fri, 4 Jul 2025 10:54:11 +0200
Subject: [PATCH 12/20] feat: add elicitations tab

---
 client/src/components/ElicitationTab.tsx | 55 ++++++++++++++++++++++++
 1 file changed, 55 insertions(+)
 create mode 100644 client/src/components/ElicitationTab.tsx

diff --git a/client/src/components/ElicitationTab.tsx b/client/src/components/ElicitationTab.tsx
new file mode 100644
index 000000000..0558d5368
--- /dev/null
+++ b/client/src/components/ElicitationTab.tsx
@@ -0,0 +1,55 @@
+import { Alert, AlertDescription } from "@/components/ui/alert";
+import { TabsContent } from "@/components/ui/tabs";
+import { JsonSchemaType } from "@/utils/jsonUtils";
+import ElicitationRequest from "./ElicitationRequest";
+
+export interface ElicitationRequestData {
+  id: number;
+  message: string;
+  requestedSchema: JsonSchemaType;
+}
+
+export interface ElicitationResponse {
+  action: "accept" | "reject" | "cancel";
+  content?: Record<string, unknown>;
+}
+
+export type PendingElicitationRequest = {
+  id: number;
+  request: ElicitationRequestData;
+};
+
+export type Props = {
+  pendingRequests: PendingElicitationRequest[];
+  onResolve: (id: number, response: ElicitationResponse) => void;
+};
+
+const ElicitationTab = ({ pendingRequests, onResolve }: Props) => {
+  return (
+    <TabsContent value="elicitations">
+      <div className="h-96">
+        <Alert>
+          <AlertDescription>
+            When the server requests information from the user, requests will
+            appear here for response.
+          </AlertDescription>
+        </Alert>
+        <div className="mt-4 space-y-4">
+          <h3 className="text-lg font-semibold">Recent Requests</h3>
+          {pendingRequests.map((request) => (
+            <ElicitationRequest
+              key={request.id}
+              request={request}
+              onResolve={onResolve}
+            />
+          ))}
+          {pendingRequests.length === 0 && (
+            <p className="text-gray-500">No pending requests</p>
+          )}
+        </div>
+      </div>
+    </TabsContent>
+  );
+};
+
+export default ElicitationTab;

From 2baf8bc84b22d9302b150479c0bf7ef70c480d86 Mon Sep 17 00:00:00 2001
From: Alex Andru <alex007d@gmail.com>
Date: Fri, 4 Jul 2025 10:54:25 +0200
Subject: [PATCH 13/20] test: elicitations tab

---
 .../__tests__/ElicitationTab.test.tsx         | 50 +++++++++++++++++++
 1 file changed, 50 insertions(+)
 create mode 100644 client/src/components/__tests__/ElicitationTab.test.tsx

diff --git a/client/src/components/__tests__/ElicitationTab.test.tsx b/client/src/components/__tests__/ElicitationTab.test.tsx
new file mode 100644
index 000000000..ca5194619
--- /dev/null
+++ b/client/src/components/__tests__/ElicitationTab.test.tsx
@@ -0,0 +1,50 @@
+import { render, screen } from "@testing-library/react";
+import { Tabs } from "@/components/ui/tabs";
+import ElicitationTab, { PendingElicitationRequest } from "../ElicitationTab";
+
+describe("Elicitation tab", () => {
+  const mockOnResolve = jest.fn();
+
+  const renderElicitationTab = (pendingRequests: PendingElicitationRequest[]) =>
+    render(
+      <Tabs defaultValue="elicitations">
+        <ElicitationTab
+          pendingRequests={pendingRequests}
+          onResolve={mockOnResolve}
+        />
+      </Tabs>,
+    );
+
+  it("should render 'No pending requests' when there are no pending requests", () => {
+    renderElicitationTab([]);
+    expect(
+      screen.getByText(
+        "When the server requests information from the user, requests will appear here for response.",
+      ),
+    ).toBeTruthy();
+    expect(screen.findByText("No pending requests")).toBeTruthy();
+  });
+
+  it("should render the correct number of requests", () => {
+    renderElicitationTab(
+      Array.from({ length: 3 }, (_, i) => ({
+        id: i,
+        request: {
+          id: i,
+          message: `Please provide information ${i}`,
+          requestedSchema: {
+            type: "object",
+            properties: {
+              name: {
+                type: "string",
+                description: "Your name",
+              },
+            },
+            required: ["name"],
+          },
+        },
+      })),
+    );
+    expect(screen.getAllByTestId("elicitation-request").length).toBe(3);
+  });
+});

From 28c1890117fbcb69c03d2fc9c595ffb8d92145c0 Mon Sep 17 00:00:00 2001
From: Alex Andru <alex007d@gmail.com>
Date: Fri, 4 Jul 2025 10:55:00 +0200
Subject: [PATCH 14/20] feat: replace modal logic with new tab request for
 elicitation

---
 client/src/App.tsx | 71 +++++++++++++++++++++++++++++++++-------------
 1 file changed, 51 insertions(+), 20 deletions(-)

diff --git a/client/src/App.tsx b/client/src/App.tsx
index 8e5570ae5..fac1e92dc 100644
--- a/client/src/App.tsx
+++ b/client/src/App.tsx
@@ -71,9 +71,10 @@ import {
   initializeInspectorConfig,
   saveInspectorConfig,
 } from "./utils/configUtils";
-import ElicitationModal, {
-  ElicitationRequest,
-} from "./components/ElicitationModal";
+import ElicitationTab, {
+  PendingElicitationRequest,
+  ElicitationResponse,
+} from "./components/ElicitationTab";
 
 const CONFIG_LOCAL_STORAGE_KEY = "inspectorConfig_v1";
 
@@ -127,8 +128,14 @@ const App = () => {
       }
     >
   >([]);
-  const [pendingElicitationRequest, setPendingElicitationRequest] =
-    useState<ElicitationRequest | null>(null);
+  const [pendingElicitationRequests, setPendingElicitationRequests] = useState<
+    Array<
+      PendingElicitationRequest & {
+        resolve: (response: ElicitationResponse) => void;
+        reject: (error: Error) => void;
+      }
+    >
+  >([]);
   const [isAuthDebuggerVisible, setIsAuthDebuggerVisible] = useState(false);
 
   // Auth debugger state
@@ -206,12 +213,21 @@ const App = () => {
       ]);
     },
     onElicitationRequest: (request, resolve) => {
-      setPendingElicitationRequest({
-        id: nextRequestId.current++,
-        message: request.params.message,
-        requestedSchema: request.params.requestedSchema,
-        resolve,
-      });
+      setPendingElicitationRequests((prev) => [
+        ...prev,
+        {
+          id: nextRequestId.current++,
+          request: {
+            id: nextRequestId.current,
+            message: request.params.message,
+            requestedSchema: request.params.requestedSchema,
+          },
+          resolve,
+          reject: (error: Error) => {
+            console.error("Elicitation request rejected:", error);
+          },
+        },
+      ]);
     },
     getRoots: () => rootsRef.current,
   });
@@ -408,6 +424,17 @@ const App = () => {
     });
   };
 
+  const handleResolveElicitation = (
+    id: number,
+    response: ElicitationResponse,
+  ) => {
+    setPendingElicitationRequests((prev) => {
+      const request = prev.find((r) => r.id === id);
+      request?.resolve(response);
+      return prev.filter((r) => r.id !== id);
+    });
+  };
+
   const clearError = (tabKey: keyof typeof errors) => {
     setErrors((prev) => ({ ...prev, [tabKey]: null }));
   };
@@ -599,10 +626,6 @@ const App = () => {
     setStdErrNotifications([]);
   };
 
-  const handleCloseElicitationModal = () => {
-    setPendingElicitationRequest(null);
-  };
-
   // Helper component for rendering the AuthDebugger
   const AuthDebuggerWrapper = () => (
     <TabsContent value="auth">
@@ -747,6 +770,15 @@ const App = () => {
                     </span>
                   )}
                 </TabsTrigger>
+                <TabsTrigger value="elicitations" className="relative">
+                  <MessageSquare className="w-4 h-4 mr-2" />
+                  Elicitations
+                  {pendingElicitationRequests.length > 0 && (
+                    <span className="absolute -top-1 -right-1 bg-red-500 text-white text-xs rounded-full h-4 w-4 flex items-center justify-center">
+                      {pendingElicitationRequests.length}
+                    </span>
+                  )}
+                </TabsTrigger>
                 <TabsTrigger value="roots">
                   <FolderTree className="w-4 h-4 mr-2" />
                   Roots
@@ -897,6 +929,10 @@ const App = () => {
                       onApprove={handleApproveSampling}
                       onReject={handleRejectSampling}
                     />
+                    <ElicitationTab
+                      pendingRequests={pendingElicitationRequests}
+                      onResolve={handleResolveElicitation}
+                    />
                     <RootsTab
                       roots={roots}
                       setRoots={setRoots}
@@ -955,11 +991,6 @@ const App = () => {
           </div>
         </div>
       </div>
-
-      <ElicitationModal
-        request={pendingElicitationRequest}
-        onClose={handleCloseElicitationModal}
-      />
     </div>
   );
 };

From f2166c985fa492f92a072fb22b5c4caf22ad651e Mon Sep 17 00:00:00 2001
From: Alex Andru <alex007d@gmail.com>
Date: Fri, 4 Jul 2025 10:59:29 +0200
Subject: [PATCH 15/20] refactor: remove dead code

---
 client/src/components/ElicitationModal.tsx    | 181 ------
 .../__tests__/ElicitationModal.test.tsx       | 535 ------------------
 2 files changed, 716 deletions(-)
 delete mode 100644 client/src/components/ElicitationModal.tsx
 delete mode 100644 client/src/components/__tests__/ElicitationModal.test.tsx

diff --git a/client/src/components/ElicitationModal.tsx b/client/src/components/ElicitationModal.tsx
deleted file mode 100644
index 8a742a313..000000000
--- a/client/src/components/ElicitationModal.tsx
+++ /dev/null
@@ -1,181 +0,0 @@
-import { useState, useEffect } from "react";
-import { Button } from "@/components/ui/button";
-import {
-  Dialog,
-  DialogContent,
-  DialogDescription,
-  DialogFooter,
-  DialogHeader,
-  DialogTitle,
-} from "@/components/ui/dialog";
-import DynamicJsonForm from "./DynamicJsonForm";
-import { JsonSchemaType, JsonValue } from "@/utils/jsonUtils";
-import { generateDefaultValue } from "@/utils/schemaUtils";
-import Ajv from "ajv";
-
-export interface ElicitationRequest {
-  id: number;
-  message: string;
-  requestedSchema: JsonSchemaType;
-  resolve: (response: ElicitationResponse) => void;
-}
-
-export interface ElicitationResponse {
-  action: "accept" | "reject" | "cancel";
-  content?: Record<string, unknown>;
-}
-
-interface ElicitationModalProps {
-  request: ElicitationRequest | null;
-  onClose: () => void;
-}
-
-const ElicitationModal = ({ request, onClose }: ElicitationModalProps) => {
-  const [formData, setFormData] = useState<JsonValue>({});
-  const [validationError, setValidationError] = useState<string | null>(null);
-
-  useEffect(() => {
-    if (request) {
-      const defaultValue = generateDefaultValue(request.requestedSchema);
-      setFormData(defaultValue);
-      setValidationError(null);
-    }
-  }, [request]);
-
-  if (!request) return null;
-
-  const validateEmailFormat = (email: string): boolean => {
-    const emailRegex = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
-    return emailRegex.test(email);
-  };
-
-  const validateFormData = (
-    data: JsonValue,
-    schema: JsonSchemaType,
-  ): boolean => {
-    if (
-      schema.type === "object" &&
-      schema.properties &&
-      typeof data === "object" &&
-      data !== null
-    ) {
-      const dataObj = data as Record<string, unknown>;
-
-      if (Array.isArray(schema.required)) {
-        for (const field of schema.required) {
-          const value = dataObj[field];
-          if (value === undefined || value === null || value === "") {
-            setValidationError(`Required field missing: ${field}`);
-            return false;
-          }
-        }
-      }
-
-      for (const [fieldName, fieldValue] of Object.entries(dataObj)) {
-        const fieldSchema = schema.properties[fieldName];
-        if (
-          fieldSchema &&
-          fieldSchema.format === "email" &&
-          typeof fieldValue === "string"
-        ) {
-          if (!validateEmailFormat(fieldValue)) {
-            setValidationError(`Invalid email format: ${fieldName}`);
-            return false;
-          }
-        }
-      }
-    }
-
-    return true;
-  };
-
-  const handleAccept = () => {
-    try {
-      if (!validateFormData(formData, request.requestedSchema)) {
-        return;
-      }
-
-      const ajv = new Ajv();
-      const validate = ajv.compile(request.requestedSchema);
-      const isValid = validate(formData);
-
-      if (!isValid) {
-        const errorMessage = ajv.errorsText(validate.errors);
-        setValidationError(errorMessage);
-        return;
-      }
-
-      request.resolve({
-        action: "accept",
-        content: formData as Record<string, unknown>,
-      });
-      onClose();
-    } catch (error) {
-      setValidationError(
-        error instanceof Error ? error.message : "Validation failed",
-      );
-    }
-  };
-
-  const handleReject = () => {
-    request.resolve({ action: "reject" });
-    onClose();
-  };
-
-  const handleCancel = () => {
-    request.resolve({ action: "cancel" });
-    onClose();
-  };
-
-  const schemaTitle = request.requestedSchema.title || "Information Request";
-  const schemaDescription = request.requestedSchema.description;
-
-  return (
-    <Dialog open={true} onOpenChange={handleCancel}>
-      <DialogContent className="max-w-2xl max-h-[80vh] overflow-y-auto">
-        <DialogHeader>
-          <DialogTitle>{schemaTitle}</DialogTitle>
-          <DialogDescription className="space-y-2">
-            <span className="block">{request.message}</span>
-            {schemaDescription && (
-              <span className="block text-sm text-muted-foreground">
-                {schemaDescription}
-              </span>
-            )}
-          </DialogDescription>
-        </DialogHeader>
-
-        <div className="py-4">
-          <DynamicJsonForm
-            schema={request.requestedSchema}
-            value={formData}
-            onChange={(newValue: JsonValue) => {
-              setFormData(newValue);
-              setValidationError(null);
-            }}
-          />
-
-          {validationError && (
-            <div className="mt-4 p-3 bg-red-50 dark:bg-red-900/20 border border-red-200 dark:border-red-800 rounded-md">
-              <div className="text-sm text-red-600 dark:text-red-400">
-                <strong>Validation Error:</strong> {validationError}
-              </div>
-            </div>
-          )}
-        </div>
-
-        <DialogFooter className="gap-2">
-          <Button variant="outline" onClick={handleCancel}>
-            Cancel
-          </Button>
-          <Button variant="outline" onClick={handleReject}>
-            Decline
-          </Button>
-          <Button onClick={handleAccept}>Submit</Button>
-        </DialogFooter>
-      </DialogContent>
-    </Dialog>
-  );
-};
-
-export default ElicitationModal;
diff --git a/client/src/components/__tests__/ElicitationModal.test.tsx b/client/src/components/__tests__/ElicitationModal.test.tsx
deleted file mode 100644
index 31a06815f..000000000
--- a/client/src/components/__tests__/ElicitationModal.test.tsx
+++ /dev/null
@@ -1,535 +0,0 @@
-import { render, screen, fireEvent, act } from "@testing-library/react";
-import "@testing-library/jest-dom";
-import { describe, it, jest, beforeEach, afterEach } from "@jest/globals";
-import ElicitationModal, { ElicitationRequest } from "../ElicitationModal";
-import { JsonSchemaType } from "@/utils/jsonUtils";
-import * as schemaUtils from "@/utils/schemaUtils";
-
-jest.mock("../DynamicJsonForm", () => {
-  return function MockDynamicJsonForm({
-    value,
-    onChange,
-  }: {
-    value: unknown;
-    onChange: (value: unknown) => void;
-  }) {
-    return (
-      <div data-testid="dynamic-json-form">
-        <input
-          data-testid="form-input"
-          value={
-            typeof value === "object" && value !== null
-              ? JSON.stringify(value)
-              : String(value || "")
-          }
-          onChange={(e) => {
-            try {
-              const parsed = JSON.parse(e.target.value);
-              onChange(parsed);
-            } catch {
-              onChange(e.target.value);
-            }
-          }}
-        />
-      </div>
-    );
-  };
-});
-
-jest.mock("@/components/ui/dialog", () => ({
-  Dialog: ({
-    children,
-    open,
-    onOpenChange,
-  }: {
-    children: React.ReactNode;
-    open: boolean;
-    onOpenChange: () => void;
-  }) =>
-    open ? (
-      <div data-testid="dialog" onClick={onOpenChange}>
-        {children}
-      </div>
-    ) : null,
-  DialogContent: ({
-    children,
-    className,
-  }: {
-    children: React.ReactNode;
-    className?: string;
-  }) => (
-    <div data-testid="dialog-content" className={className}>
-      {children}
-    </div>
-  ),
-  DialogHeader: ({ children }: { children: React.ReactNode }) => (
-    <div data-testid="dialog-header">{children}</div>
-  ),
-  DialogTitle: ({ children }: { children: React.ReactNode }) => (
-    <h2 data-testid="dialog-title">{children}</h2>
-  ),
-  DialogDescription: ({ children }: { children: React.ReactNode }) => (
-    <div data-testid="dialog-description">{children}</div>
-  ),
-  DialogFooter: ({ children }: { children: React.ReactNode }) => (
-    <div data-testid="dialog-footer">{children}</div>
-  ),
-}));
-
-jest.mock("@/components/ui/button", () => ({
-  Button: ({
-    children,
-    onClick,
-    variant,
-    ...props
-  }: {
-    children: React.ReactNode;
-    onClick?: () => void;
-    variant?: string;
-    [key: string]: unknown;
-  }) => (
-    <button
-      onClick={onClick}
-      data-testid={`button-${children?.toString().toLowerCase()}`}
-      data-variant={variant}
-      {...props}
-    >
-      {children}
-    </button>
-  ),
-}));
-
-jest.mock("@/utils/schemaUtils", () => ({
-  generateDefaultValue: jest.fn((schema: JsonSchemaType) => {
-    if (schema.type === "object" && schema.properties) {
-      const defaults: Record<string, unknown> = {};
-      Object.keys(schema.properties).forEach((key) => {
-        const prop = schema.properties![key];
-        if (prop.type === "string") defaults[key] = "";
-        if (prop.type === "number") defaults[key] = 0;
-        if (prop.type === "boolean") defaults[key] = false;
-      });
-      return defaults;
-    }
-    return {};
-  }),
-}));
-
-describe("ElicitationModal", () => {
-  const mockResolve = jest.fn();
-  const mockOnClose = jest.fn();
-
-  beforeEach(() => {
-    jest.clearAllMocks();
-  });
-
-  afterEach(() => {
-    jest.clearAllMocks();
-  });
-
-  const createMockRequest = (
-    overrides: Partial<ElicitationRequest> = {},
-  ): ElicitationRequest => ({
-    id: 1,
-    message: "Please provide your information",
-    requestedSchema: {
-      type: "object",
-      properties: {
-        name: { type: "string", description: "Your name" },
-        email: { type: "string", format: "email", description: "Your email" },
-      },
-      required: ["name"],
-    },
-    resolve: mockResolve,
-    ...overrides,
-  });
-
-  const renderElicitationModal = (
-    request: ElicitationRequest | null = null,
-  ) => {
-    return render(
-      <ElicitationModal
-        request={request || createMockRequest()}
-        onClose={mockOnClose}
-      />,
-    );
-  };
-
-  describe("Rendering", () => {
-    it("should render null when no request is provided", () => {
-      render(<ElicitationModal request={null} onClose={mockOnClose} />);
-      expect(screen.queryByTestId("dialog")).not.toBeInTheDocument();
-    });
-
-    it("should render dialog when request is provided", () => {
-      renderElicitationModal();
-      expect(screen.getByTestId("dialog")).toBeInTheDocument();
-      expect(screen.getByTestId("dialog-content")).toBeInTheDocument();
-    });
-
-    it("should display request message", () => {
-      const message = "Please provide your GitHub username";
-      renderElicitationModal(createMockRequest({ message }));
-      expect(screen.getByText(message)).toBeInTheDocument();
-    });
-
-    it("should display schema title when provided", () => {
-      const request = createMockRequest({
-        requestedSchema: {
-          type: "object",
-          title: "User Information",
-          properties: { name: { type: "string" } },
-        },
-      });
-      renderElicitationModal(request);
-      expect(screen.getByText("User Information")).toBeInTheDocument();
-    });
-
-    it("should display default title when schema title is not provided", () => {
-      renderElicitationModal();
-      expect(screen.getByText("Information Request")).toBeInTheDocument();
-    });
-
-    it("should display schema description when provided", () => {
-      const description = "Please fill out your contact details";
-      const request = createMockRequest({
-        requestedSchema: {
-          type: "object",
-          description,
-          properties: { name: { type: "string" } },
-        },
-      });
-      renderElicitationModal(request);
-      expect(screen.getByText(description)).toBeInTheDocument();
-    });
-
-    it("should render all three action buttons", () => {
-      renderElicitationModal();
-      expect(screen.getByTestId("button-cancel")).toBeInTheDocument();
-      expect(screen.getByTestId("button-decline")).toBeInTheDocument();
-      expect(screen.getByTestId("button-submit")).toBeInTheDocument();
-    });
-
-    it("should render DynamicJsonForm component", () => {
-      renderElicitationModal();
-      expect(screen.getByTestId("dynamic-json-form")).toBeInTheDocument();
-    });
-  });
-
-  describe("User Interactions", () => {
-    it("should call resolve with accept action when Submit button is clicked", async () => {
-      renderElicitationModal();
-
-      const input = screen.getByTestId("form-input");
-      await act(async () => {
-        fireEvent.change(input, {
-          target: {
-            value: '{"name": "John Doe", "email": "john@example.com"}',
-          },
-        });
-      });
-
-      await act(async () => {
-        fireEvent.click(screen.getByTestId("button-submit"));
-      });
-
-      expect(mockResolve).toHaveBeenCalledWith({
-        action: "accept",
-        content: { name: "John Doe", email: "john@example.com" },
-      });
-      expect(mockOnClose).toHaveBeenCalled();
-    });
-
-    it("should call resolve with reject action when Decline button is clicked", async () => {
-      renderElicitationModal();
-
-      await act(async () => {
-        fireEvent.click(screen.getByTestId("button-decline"));
-      });
-
-      expect(mockResolve).toHaveBeenCalledWith({ action: "reject" });
-      expect(mockOnClose).toHaveBeenCalled();
-    });
-
-    it("should call resolve with cancel action when Cancel button is clicked", async () => {
-      renderElicitationModal();
-
-      await act(async () => {
-        fireEvent.click(screen.getByTestId("button-cancel"));
-      });
-
-      expect(mockResolve).toHaveBeenCalledWith({ action: "cancel" });
-      expect(mockOnClose).toHaveBeenCalled();
-    });
-
-    it("should call resolve with cancel action when dialog is closed", async () => {
-      renderElicitationModal();
-
-      await act(async () => {
-        fireEvent.click(screen.getByTestId("dialog"));
-      });
-
-      expect(mockResolve).toHaveBeenCalledWith({ action: "cancel" });
-      expect(mockOnClose).toHaveBeenCalled();
-    });
-  });
-
-  describe("Form Validation", () => {
-    it("should show validation error for missing required fields", async () => {
-      renderElicitationModal();
-
-      await act(async () => {
-        fireEvent.click(screen.getByTestId("button-submit"));
-      });
-
-      expect(
-        screen.getByText(/Required field missing: name/),
-      ).toBeInTheDocument();
-      expect(mockResolve).not.toHaveBeenCalledWith(
-        expect.objectContaining({ action: "accept" }),
-      );
-    });
-
-    it("should show validation error for invalid email format", async () => {
-      renderElicitationModal();
-
-      const input = screen.getByTestId("form-input");
-      await act(async () => {
-        fireEvent.change(input, {
-          target: { value: '{"name": "John", "email": "invalid-email"}' },
-        });
-      });
-
-      await act(async () => {
-        fireEvent.click(screen.getByTestId("button-submit"));
-      });
-
-      expect(
-        screen.getByText(/Invalid email format: email/),
-      ).toBeInTheDocument();
-      expect(mockResolve).not.toHaveBeenCalledWith(
-        expect.objectContaining({ action: "accept" }),
-      );
-    });
-
-    it("should clear validation error when form data changes", async () => {
-      renderElicitationModal();
-
-      await act(async () => {
-        fireEvent.click(screen.getByTestId("button-submit"));
-      });
-
-      expect(screen.getByText(/Required field missing/)).toBeInTheDocument();
-
-      const input = screen.getByTestId("form-input");
-      await act(async () => {
-        fireEvent.change(input, { target: { value: '{"name": "John"}' } });
-      });
-
-      expect(
-        screen.queryByText(/Required field missing/),
-      ).not.toBeInTheDocument();
-    });
-
-    it("should show AJV validation errors", async () => {
-      const mockAjv = {
-        compile: jest.fn(() => ({
-          errors: [{ instancePath: "/name", message: "should be string" }],
-        })),
-        errorsText: jest.fn(() => "data/name should be string"),
-      };
-
-      jest.doMock("ajv", () => jest.fn(() => mockAjv));
-
-      renderElicitationModal();
-
-      const input = screen.getByTestId("form-input");
-      await act(async () => {
-        fireEvent.change(input, { target: { value: '{"name": "John"}' } });
-      });
-
-      await act(async () => {
-        fireEvent.click(screen.getByTestId("button-submit"));
-      });
-    });
-  });
-
-  describe("Email Validation", () => {
-    it("should accept valid email formats", async () => {
-      const validEmails = [
-        "test@example.com",
-        "user.name@domain.co.uk",
-        "user+tag@example.org",
-      ];
-
-      for (const email of validEmails) {
-        renderElicitationModal();
-
-        const input = screen.getByTestId("form-input");
-        await act(async () => {
-          fireEvent.change(input, {
-            target: { value: `{"name": "John", "email": "${email}"}` },
-          });
-        });
-
-        await act(async () => {
-          fireEvent.click(screen.getByTestId("button-submit"));
-        });
-
-        expect(mockResolve).toHaveBeenCalledWith({
-          action: "accept",
-          content: { name: "John", email },
-        });
-
-        jest.clearAllMocks();
-        document.body.innerHTML = "";
-      }
-    });
-
-    it("should reject invalid email formats", async () => {
-      const invalidEmails = [
-        "invalid-email",
-        "@example.com",
-        "user@",
-        "user.example.com",
-      ];
-
-      for (const email of invalidEmails) {
-        renderElicitationModal();
-
-        const input = screen.getByTestId("form-input");
-        await act(async () => {
-          fireEvent.change(input, {
-            target: { value: `{"name": "John", "email": "${email}"}` },
-          });
-        });
-
-        await act(async () => {
-          fireEvent.click(screen.getByTestId("button-submit"));
-        });
-
-        expect(
-          screen.getByText(/Invalid email format: email/),
-        ).toBeInTheDocument();
-        expect(mockResolve).not.toHaveBeenCalledWith(
-          expect.objectContaining({ action: "accept" }),
-        );
-
-        jest.clearAllMocks();
-        document.body.innerHTML = "";
-      }
-    });
-  });
-
-  describe("Schema Types", () => {
-    it("should handle string schema", () => {
-      const request = createMockRequest({
-        requestedSchema: {
-          type: "object",
-          properties: {
-            username: { type: "string", description: "Username" },
-          },
-        },
-      });
-      renderElicitationModal(request);
-      expect(screen.getByTestId("dynamic-json-form")).toBeInTheDocument();
-    });
-
-    it("should handle number schema", () => {
-      const request = createMockRequest({
-        requestedSchema: {
-          type: "object",
-          properties: {
-            age: { type: "number", minimum: 0, maximum: 120 },
-          },
-        },
-      });
-      renderElicitationModal(request);
-      expect(screen.getByTestId("dynamic-json-form")).toBeInTheDocument();
-    });
-
-    it("should handle boolean schema", () => {
-      const request = createMockRequest({
-        requestedSchema: {
-          type: "object",
-          properties: {
-            subscribe: {
-              type: "boolean",
-              description: "Subscribe to newsletter",
-            },
-          },
-        },
-      });
-      renderElicitationModal(request);
-      expect(screen.getByTestId("dynamic-json-form")).toBeInTheDocument();
-    });
-
-    it("should handle enum schema", () => {
-      const request = createMockRequest({
-        requestedSchema: {
-          type: "object",
-          properties: {
-            country: {
-              type: "string",
-              enum: ["US", "UK", "CA"],
-              enumNames: ["United States", "United Kingdom", "Canada"],
-            },
-          },
-        },
-      });
-      renderElicitationModal(request);
-      expect(screen.getByTestId("dynamic-json-form")).toBeInTheDocument();
-    });
-  });
-
-  describe("Error Handling", () => {
-    it("should handle validation errors gracefully", async () => {
-      renderElicitationModal();
-
-      await act(async () => {
-        fireEvent.click(screen.getByTestId("button-submit"));
-      });
-
-      expect(screen.getByText(/Validation Error/)).toBeInTheDocument();
-    });
-
-    it("should handle JSON parsing errors in form validation", async () => {
-      renderElicitationModal();
-
-      const input = screen.getByTestId("form-input");
-      await act(async () => {
-        fireEvent.change(input, { target: { value: "invalid json" } });
-      });
-
-      await act(async () => {
-        fireEvent.click(screen.getByTestId("button-submit"));
-      });
-
-      expect(mockResolve).not.toHaveBeenCalledWith(
-        expect.objectContaining({ action: "accept" }),
-      );
-    });
-  });
-
-  describe("Default Values", () => {
-    it("should generate default values when request changes", () => {
-      const { rerender } = renderElicitationModal();
-
-      const newRequest = createMockRequest({
-        id: 2,
-        requestedSchema: {
-          type: "object",
-          properties: {
-            newField: { type: "string" },
-          },
-        },
-      });
-
-      rerender(<ElicitationModal request={newRequest} onClose={mockOnClose} />);
-
-      expect(schemaUtils.generateDefaultValue).toHaveBeenCalledWith(
-        newRequest.requestedSchema,
-      );
-    });
-  });
-});

From e6c8b946aa8982d99aec2ebfe172129cccc2255f Mon Sep 17 00:00:00 2001
From: Alex Andru <alex007d@gmail.com>
Date: Fri, 4 Jul 2025 12:09:51 +0200
Subject: [PATCH 16/20] feat: use decline instead of reject

---
 client/src/App.tsx                                          | 4 ++--
 client/src/components/ElicitationRequest.tsx                | 6 +++---
 client/src/components/ElicitationTab.tsx                    | 2 +-
 client/src/components/__tests__/ElicitationRequest.test.tsx | 4 ++--
 4 files changed, 8 insertions(+), 8 deletions(-)

diff --git a/client/src/App.tsx b/client/src/App.tsx
index fac1e92dc..54145d945 100644
--- a/client/src/App.tsx
+++ b/client/src/App.tsx
@@ -132,7 +132,7 @@ const App = () => {
     Array<
       PendingElicitationRequest & {
         resolve: (response: ElicitationResponse) => void;
-        reject: (error: Error) => void;
+        decline: (error: Error) => void;
       }
     >
   >([]);
@@ -223,7 +223,7 @@ const App = () => {
             requestedSchema: request.params.requestedSchema,
           },
           resolve,
-          reject: (error: Error) => {
+          decline: (error: Error) => {
             console.error("Elicitation request rejected:", error);
           },
         },
diff --git a/client/src/components/ElicitationRequest.tsx b/client/src/components/ElicitationRequest.tsx
index dc3f5962e..4488a9620 100644
--- a/client/src/components/ElicitationRequest.tsx
+++ b/client/src/components/ElicitationRequest.tsx
@@ -100,8 +100,8 @@ const ElicitationRequest = ({
     }
   };
 
-  const handleReject = () => {
-    onResolve(request.id, { action: "reject" });
+  const handleDecline = () => {
+    onResolve(request.id, { action: "decline" });
   };
 
   const handleCancel = () => {
@@ -158,7 +158,7 @@ const ElicitationRequest = ({
           <Button type="button" onClick={handleAccept}>
             Submit
           </Button>
-          <Button type="button" variant="outline" onClick={handleReject}>
+          <Button type="button" variant="outline" onClick={handleDecline}>
             Decline
           </Button>
           <Button type="button" variant="outline" onClick={handleCancel}>
diff --git a/client/src/components/ElicitationTab.tsx b/client/src/components/ElicitationTab.tsx
index 0558d5368..c8c88fa8b 100644
--- a/client/src/components/ElicitationTab.tsx
+++ b/client/src/components/ElicitationTab.tsx
@@ -10,7 +10,7 @@ export interface ElicitationRequestData {
 }
 
 export interface ElicitationResponse {
-  action: "accept" | "reject" | "cancel";
+  action: "accept" | "decline" | "cancel";
   content?: Record<string, unknown>;
 }
 
diff --git a/client/src/components/__tests__/ElicitationRequest.test.tsx b/client/src/components/__tests__/ElicitationRequest.test.tsx
index c18fe3eb4..f2af25936 100644
--- a/client/src/components/__tests__/ElicitationRequest.test.tsx
+++ b/client/src/components/__tests__/ElicitationRequest.test.tsx
@@ -138,14 +138,14 @@ describe("ElicitationRequest", () => {
       });
     });
 
-    it("should call onResolve with reject action when Decline button is clicked", async () => {
+    it("should call onResolve with decline action when Decline button is clicked", async () => {
       renderElicitationRequest();
 
       await act(async () => {
         fireEvent.click(screen.getByRole("button", { name: /decline/i }));
       });
 
-      expect(mockOnResolve).toHaveBeenCalledWith(1, { action: "reject" });
+      expect(mockOnResolve).toHaveBeenCalledWith(1, { action: "decline" });
     });
 
     it("should call onResolve with cancel action when Cancel button is clicked", async () => {

From 3a121bc8fcc9bb010ef0e478bdabdf8f3d69b831 Mon Sep 17 00:00:00 2001
From: Alex Andru <alex007d@gmail.com>
Date: Fri, 4 Jul 2025 19:39:03 +0200
Subject: [PATCH 17/20] fix: support JSON Schema spec compliant oneOf with
 const for labeled enums

- Make JsonSchemaType.type optional to support const-only schemas
- Add JsonSchemaConst type for schema objects using const values
- Update oneOf/anyOf to accept both full schemas and const schemas
- Add comprehensive tests for oneOf with const and title patterns

This fixes TypeScript compilation errors when using the JSON Schema
specification's recommended approach for labeled enums:
{ "type": "string", "oneOf": [{ "const": "red", "title": "Stop" }] }

Replaces deprecated enumNames pattern with spec-compliant implementation.
---
 client/src/utils/__tests__/jsonUtils.test.ts | 114 +++++++++++++++++--
 client/src/utils/jsonUtils.ts                |  12 +-
 2 files changed, 116 insertions(+), 10 deletions(-)

diff --git a/client/src/utils/__tests__/jsonUtils.test.ts b/client/src/utils/__tests__/jsonUtils.test.ts
index 92a925a86..42938eb55 100644
--- a/client/src/utils/__tests__/jsonUtils.test.ts
+++ b/client/src/utils/__tests__/jsonUtils.test.ts
@@ -345,8 +345,11 @@ describe("JsonSchemaType elicitation field support", () => {
       },
       role: {
         type: "string",
-        enum: ["admin", "user", "guest"],
-        enumNames: ["Administrator", "User", "Guest"],
+        oneOf: [
+          { const: "admin", title: "Administrator" },
+          { const: "user", title: "User" },
+          { const: "guest", title: "Guest" },
+        ],
       },
     },
     required: ["name", "email"],
@@ -372,15 +375,17 @@ describe("JsonSchemaType elicitation field support", () => {
     );
   });
 
-  test("should handle enum and enumNames fields", () => {
+  test("should handle oneOf with const and title fields", () => {
     const schema = {
-      type: "string" as const,
-      enum: ["option1", "option2"],
-      enumNames: ["Option 1", "Option 2"],
+      type: "string",
+      oneOf: [
+        { const: "option1", title: "Option 1" },
+        { const: "option2", title: "Option 2" },
+      ],
     };
 
-    expect(getValueAtPath(schema, ["enum", "0"])).toBe("option1");
-    expect(getValueAtPath(schema, ["enumNames", "1"])).toBe("Option 2");
+    expect(getValueAtPath(schema, ["oneOf", "0", "const"])).toBe("option1");
+    expect(getValueAtPath(schema, ["oneOf", "1", "title"])).toBe("Option 2");
   });
 
   test("should handle validation constraints", () => {
@@ -425,4 +430,97 @@ describe("JsonSchemaType elicitation field support", () => {
       "Do you accept the terms and conditions?",
     );
   });
+
+  test("should handle JSON Schema spec compliant oneOf with const for labeled enums", () => {
+    // Example from JSON Schema spec: labeled enums using oneOf with const
+    const trafficLightSchema = {
+      type: "string" as const,
+      title: "Traffic Light",
+      description: "Select a traffic light color",
+      oneOf: [
+        { const: "red", title: "Stop" },
+        { const: "amber", title: "Caution" },
+        { const: "green", title: "Go" },
+      ],
+    };
+
+    // Verify the schema structure
+    expect(trafficLightSchema.type).toBe("string");
+    expect(trafficLightSchema.oneOf).toHaveLength(3);
+
+    // Verify each oneOf option has const and title
+    expect(trafficLightSchema.oneOf[0].const).toBe("red");
+    expect(trafficLightSchema.oneOf[0].title).toBe("Stop");
+
+    expect(trafficLightSchema.oneOf[1].const).toBe("amber");
+    expect(trafficLightSchema.oneOf[1].title).toBe("Caution");
+
+    expect(trafficLightSchema.oneOf[2].const).toBe("green");
+    expect(trafficLightSchema.oneOf[2].title).toBe("Go");
+
+    // Test with JsonValue operations
+    const schemaAsJsonValue = trafficLightSchema as JsonValue;
+    expect(getValueAtPath(schemaAsJsonValue, ["oneOf", "0", "const"])).toBe(
+      "red",
+    );
+    expect(getValueAtPath(schemaAsJsonValue, ["oneOf", "1", "title"])).toBe(
+      "Caution",
+    );
+    expect(getValueAtPath(schemaAsJsonValue, ["oneOf", "2", "const"])).toBe(
+      "green",
+    );
+  });
+
+  test("should handle complex oneOf scenarios with mixed schema types", () => {
+    const complexSchema = {
+      type: "object" as const,
+      title: "User Preference",
+      properties: {
+        theme: {
+          type: "string" as const,
+          oneOf: [
+            { const: "light", title: "Light Mode" },
+            { const: "dark", title: "Dark Mode" },
+            { const: "auto", title: "Auto (System)" },
+          ],
+        },
+        notifications: {
+          type: "string" as const,
+          oneOf: [
+            { const: "all", title: "All Notifications" },
+            { const: "important", title: "Important Only" },
+            { const: "none", title: "None" },
+          ],
+        },
+      },
+    };
+
+    expect(
+      getValueAtPath(complexSchema, [
+        "properties",
+        "theme",
+        "oneOf",
+        "0",
+        "const",
+      ]),
+    ).toBe("light");
+    expect(
+      getValueAtPath(complexSchema, [
+        "properties",
+        "theme",
+        "oneOf",
+        "1",
+        "title",
+      ]),
+    ).toBe("Dark Mode");
+    expect(
+      getValueAtPath(complexSchema, [
+        "properties",
+        "notifications",
+        "oneOf",
+        "2",
+        "const",
+      ]),
+    ).toBe("none");
+  });
 });
diff --git a/client/src/utils/jsonUtils.ts b/client/src/utils/jsonUtils.ts
index 110dd8dc9..338b642ac 100644
--- a/client/src/utils/jsonUtils.ts
+++ b/client/src/utils/jsonUtils.ts
@@ -7,8 +7,14 @@ export type JsonValue =
   | JsonValue[]
   | { [key: string]: JsonValue };
 
+export type JsonSchemaConst = {
+  const: JsonValue;
+  title?: string;
+  description?: string;
+};
+
 export type JsonSchemaType = {
-  type:
+  type?:
     | "string"
     | "number"
     | "integer"
@@ -29,7 +35,9 @@ export type JsonSchemaType = {
   pattern?: string;
   format?: string;
   enum?: string[];
-  enumNames?: string[];
+  const?: JsonValue;
+  oneOf?: (JsonSchemaType | JsonSchemaConst)[];
+  anyOf?: (JsonSchemaType | JsonSchemaConst)[];
 };
 
 export type JsonObject = { [key: string]: JsonValue };

From efd5f8a17c2890cd88238226d99fae84e1bfcb1a Mon Sep 17 00:00:00 2001
From: Alex Andru <alex007d@gmail.com>
Date: Fri, 4 Jul 2025 19:45:55 +0200
Subject: [PATCH 18/20] feat: enum support in dynamic json form

---
 client/src/components/DynamicJsonForm.tsx     | 52 ++++++++++++--
 .../__tests__/DynamicJsonForm.test.tsx        | 68 +++++++++++++++++--
 2 files changed, 110 insertions(+), 10 deletions(-)

diff --git a/client/src/components/DynamicJsonForm.tsx b/client/src/components/DynamicJsonForm.tsx
index b988b4576..775fefcfe 100644
--- a/client/src/components/DynamicJsonForm.tsx
+++ b/client/src/components/DynamicJsonForm.tsx
@@ -15,10 +15,10 @@ interface DynamicJsonFormProps {
 
 const isSimpleObject = (schema: JsonSchemaType): boolean => {
   const supportedTypes = ["string", "number", "integer", "boolean", "null"];
-  if (supportedTypes.includes(schema.type)) return true;
+  if (schema.type && supportedTypes.includes(schema.type)) return true;
   if (schema.type === "object") {
-    return Object.values(schema.properties ?? {}).every((prop) =>
-      supportedTypes.includes(prop.type),
+    return Object.values(schema.properties ?? {}).every(
+      (prop) => prop.type && supportedTypes.includes(prop.type),
     );
   }
   if (schema.type === "array") {
@@ -178,6 +178,41 @@ const DynamicJsonForm = ({
 
     switch (propSchema.type) {
       case "string": {
+        if (
+          propSchema.oneOf &&
+          propSchema.oneOf.every(
+            (option) =>
+              typeof option.const === "string" &&
+              typeof option.title === "string",
+          )
+        ) {
+          return (
+            <select
+              value={(currentValue as string) ?? ""}
+              onChange={(e) => {
+                const val = e.target.value;
+                if (!val && !isRequired) {
+                  handleFieldChange(path, undefined);
+                } else {
+                  handleFieldChange(path, val);
+                }
+              }}
+              required={isRequired}
+              className="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500 dark:border-gray-600 dark:bg-gray-800"
+            >
+              <option value="">Select an option...</option>
+              {propSchema.oneOf.map((option) => (
+                <option
+                  key={option.const as string}
+                  value={option.const as string}
+                >
+                  {option.title as string}
+                </option>
+              ))}
+            </select>
+          );
+        }
+
         if (propSchema.enum) {
           return (
             <select
@@ -194,9 +229,9 @@ const DynamicJsonForm = ({
               className="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500 dark:border-gray-600 dark:bg-gray-800"
             >
               <option value="">Select an option...</option>
-              {propSchema.enum.map((option, index) => (
+              {propSchema.enum.map((option) => (
                 <option key={option} value={option}>
-                  {propSchema.enumNames?.[index] || option}
+                  {option}
                 </option>
               ))}
             </select>
@@ -233,6 +268,9 @@ const DynamicJsonForm = ({
             }}
             placeholder={propSchema.description}
             required={isRequired}
+            minLength={propSchema.minLength}
+            maxLength={propSchema.maxLength}
+            pattern={propSchema.pattern}
           />
         );
       }
@@ -255,6 +293,8 @@ const DynamicJsonForm = ({
             }}
             placeholder={propSchema.description}
             required={isRequired}
+            min={propSchema.minimum}
+            max={propSchema.maximum}
           />
         );
 
@@ -277,6 +317,8 @@ const DynamicJsonForm = ({
             }}
             placeholder={propSchema.description}
             required={isRequired}
+            min={propSchema.minimum}
+            max={propSchema.maximum}
           />
         );
 
diff --git a/client/src/components/__tests__/DynamicJsonForm.test.tsx b/client/src/components/__tests__/DynamicJsonForm.test.tsx
index 2a0da7998..848861576 100644
--- a/client/src/components/__tests__/DynamicJsonForm.test.tsx
+++ b/client/src/components/__tests__/DynamicJsonForm.test.tsx
@@ -103,11 +103,13 @@ describe("DynamicJsonForm String Fields", () => {
       expect(options).toHaveLength(4);
     });
 
-    it("should use enumNames for option labels", () => {
+    it("should use oneOf with const and title for labeled options", () => {
       const schema: JsonSchemaType = {
         type: "string",
-        enum: ["val1", "val2"],
-        enumNames: ["Label 1", "Label 2"],
+        oneOf: [
+          { const: "val1", title: "Label 1" },
+          { const: "val2", title: "Label 2" },
+        ],
         description: "Select with labels",
       };
       render(<DynamicJsonForm schema={schema} value="" onChange={jest.fn()} />);
@@ -117,6 +119,24 @@ describe("DynamicJsonForm String Fields", () => {
       expect(options[2]).toHaveProperty("textContent", "Label 2");
     });
 
+    it("should call onChange with selected oneOf value", () => {
+      const onChange = jest.fn();
+      const schema: JsonSchemaType = {
+        type: "string",
+        oneOf: [
+          { const: "option1", title: "Option 1" },
+          { const: "option2", title: "Option 2" },
+        ],
+        description: "Select an option",
+      };
+      render(<DynamicJsonForm schema={schema} value="" onChange={onChange} />);
+
+      const select = screen.getByRole("combobox");
+      fireEvent.change(select, { target: { value: "option1" } });
+
+      expect(onChange).toHaveBeenCalledWith("option1");
+    });
+
     it("should call onChange with selected enum value", () => {
       const onChange = jest.fn();
       const schema: JsonSchemaType = {
@@ -131,6 +151,44 @@ describe("DynamicJsonForm String Fields", () => {
 
       expect(onChange).toHaveBeenCalledWith("option1");
     });
+
+    it("should render JSON Schema spec compliant oneOf with const for labeled enums", () => {
+      // Example from JSON Schema spec: labeled enums using oneOf with const
+      const onChange = jest.fn();
+      const schema: JsonSchemaType = {
+        type: "string",
+        title: "Traffic Light",
+        description: "Select a traffic light color",
+        oneOf: [
+          { const: "red", title: "Stop" },
+          { const: "amber", title: "Caution" },
+          { const: "green", title: "Go" },
+        ],
+      };
+      render(<DynamicJsonForm schema={schema} value="" onChange={onChange} />);
+
+      // Should render as a select dropdown
+      const select = screen.getByRole("combobox");
+      expect(select.tagName).toBe("SELECT");
+
+      // Should have options with proper labels
+      const options = screen.getAllByRole("option");
+      expect(options).toHaveLength(4); // 3 options + 1 default "Select an option..."
+
+      expect(options[0]).toHaveProperty("textContent", "Select an option...");
+      expect(options[1]).toHaveProperty("textContent", "Stop");
+      expect(options[2]).toHaveProperty("textContent", "Caution");
+      expect(options[3]).toHaveProperty("textContent", "Go");
+
+      // Should have proper values
+      expect(options[1]).toHaveProperty("value", "red");
+      expect(options[2]).toHaveProperty("value", "amber");
+      expect(options[3]).toHaveProperty("value", "green");
+
+      // Test onChange behavior
+      fireEvent.change(select, { target: { value: "amber" } });
+      expect(onChange).toHaveBeenCalledWith("amber");
+    });
   });
 
   describe("Validation Attributes", () => {
@@ -464,8 +522,8 @@ describe("DynamicJsonForm Object Fields", () => {
         <DynamicJsonForm schema={schema} value={{}} onChange={jest.fn()} />,
       );
 
-      const nameLabel = screen.getByText("Name");
-      const optionalLabel = screen.getByText("Optional");
+      const nameLabel = screen.getByText("name");
+      const optionalLabel = screen.getByText("optional");
 
       const nameInput = nameLabel.closest("div")?.querySelector("input");
       const optionalInput = optionalLabel

From 484b5b895999f4bbdd9bf6329f527040aef6498d Mon Sep 17 00:00:00 2001
From: Alex Andru <alex007d@gmail.com>
Date: Fri, 4 Jul 2025 19:57:45 +0200
Subject: [PATCH 19/20] chore: bump sdk version

---
 package-lock.json | 19 ++++++++++++-------
 package.json      |  2 +-
 2 files changed, 13 insertions(+), 8 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index 68c8103bf..6efc5401d 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -14,9 +14,9 @@
         "cli"
       ],
       "dependencies": {
-        "@modelcontextprotocol/inspector-cli": "^0.14.3",
-        "@modelcontextprotocol/inspector-client": "^0.14.3",
-        "@modelcontextprotocol/inspector-server": "^0.14.3",
+        "@modelcontextprotocol/inspector-cli": "^0.15.0",
+        "@modelcontextprotocol/inspector-client": "^0.15.0",
+        "@modelcontextprotocol/inspector-server": "^0.15.0",
         "@modelcontextprotocol/sdk": "^1.14.0",
         "concurrently": "^9.0.1",
         "open": "^10.1.0",
@@ -37,6 +37,9 @@
         "prettier": "3.3.3",
         "rimraf": "^6.0.1",
         "typescript": "^5.4.2"
+      },
+      "engines": {
+        "node": ">=22.7.5"
       }
     },
     "cli": {
@@ -67,7 +70,7 @@
       "version": "0.15.0",
       "license": "MIT",
       "dependencies": {
-        "@modelcontextprotocol/sdk": "^1.13.1",
+        "@modelcontextprotocol/sdk": "^1.14.0",
         "@radix-ui/react-checkbox": "^1.1.4",
         "@radix-ui/react-dialog": "^1.1.3",
         "@radix-ui/react-icons": "^1.3.0",
@@ -2006,15 +2009,17 @@
       "link": true
     },
     "node_modules/@modelcontextprotocol/sdk": {
-      "version": "1.13.1",
-      "resolved": "https://registry.npmjs.org/@modelcontextprotocol/sdk/-/sdk-1.13.1.tgz",
-      "integrity": "sha512-8q6+9aF0yA39/qWT/uaIj6zTpC+Qu07DnN/lb9mjoquCJsAh6l3HyYqc9O3t2j7GilseOQOQimLg7W3By6jqvg==",
+      "version": "1.15.0",
+      "resolved": "https://registry.npmjs.org/@modelcontextprotocol/sdk/-/sdk-1.15.0.tgz",
+      "integrity": "sha512-67hnl/ROKdb03Vuu0YOr+baKTvf1/5YBHBm9KnZdjdAh8hjt4FRCPD5ucwxGB237sBpzlqQsLy1PFu7z/ekZ9Q==",
+      "license": "MIT",
       "dependencies": {
         "ajv": "^6.12.6",
         "content-type": "^1.0.5",
         "cors": "^2.8.5",
         "cross-spawn": "^7.0.5",
         "eventsource": "^3.0.2",
+        "eventsource-parser": "^3.0.0",
         "express": "^5.0.1",
         "express-rate-limit": "^7.5.0",
         "pkce-challenge": "^5.0.0",
diff --git a/package.json b/package.json
index 5d5fe52fc..01f829578 100644
--- a/package.json
+++ b/package.json
@@ -47,7 +47,7 @@
     "@modelcontextprotocol/inspector-cli": "^0.15.0",
     "@modelcontextprotocol/inspector-client": "^0.15.0",
     "@modelcontextprotocol/inspector-server": "^0.15.0",
-    "@modelcontextprotocol/sdk": "^1.13.1",
+    "@modelcontextprotocol/sdk": "^1.14.0",
     "concurrently": "^9.0.1",
     "open": "^10.1.0",
     "shell-quote": "^1.8.2",

From 6b204b5d29aaedfbec3ad84a15a34bd428b04e09 Mon Sep 17 00:00:00 2001
From: Alex Andru <alex007d@gmail.com>
Date: Fri, 18 Jul 2025 18:21:40 +0200
Subject: [PATCH 20/20] feat: add active tab system

---
 client/src/App.tsx                       | 157 +++++++++++++++++------
 client/src/components/ElicitationTab.tsx |   1 +
 2 files changed, 116 insertions(+), 42 deletions(-)

diff --git a/client/src/App.tsx b/client/src/App.tsx
index 54145d945..96352dd16 100644
--- a/client/src/App.tsx
+++ b/client/src/App.tsx
@@ -138,11 +138,9 @@ const App = () => {
   >([]);
   const [isAuthDebuggerVisible, setIsAuthDebuggerVisible] = useState(false);
 
-  // Auth debugger state
   const [authState, setAuthState] =
     useState<AuthDebuggerState>(EMPTY_DEBUGGER_STATE);
 
-  // Helper function to update specific auth state properties
   const updateAuthState = (updates: Partial<AuthDebuggerState>) => {
     setAuthState((prev) => ({ ...prev, ...updates }));
   };
@@ -170,6 +168,19 @@ const App = () => {
   const [nextToolCursor, setNextToolCursor] = useState<string | undefined>();
   const progressTokenRef = useRef(0);
 
+  const [activeTab, setActiveTab] = useState<string>(() => {
+    const hash = window.location.hash.slice(1);
+    const initialTab = hash || "resources";
+    return initialTab;
+  });
+
+  const currentTabRef = useRef<string>(activeTab);
+  const lastToolCallOriginTabRef = useRef<string>(activeTab);
+
+  useEffect(() => {
+    currentTabRef.current = activeTab;
+  }, [activeTab]);
+
   const { height: historyPaneHeight, handleDragStart } = useDraggablePane(300);
   const {
     width: sidebarWidth,
@@ -213,6 +224,8 @@ const App = () => {
       ]);
     },
     onElicitationRequest: (request, resolve) => {
+      const currentTab = lastToolCallOriginTabRef.current;
+
       setPendingElicitationRequests((prev) => [
         ...prev,
         {
@@ -222,16 +235,52 @@ const App = () => {
             message: request.params.message,
             requestedSchema: request.params.requestedSchema,
           },
+          originatingTab: currentTab,
           resolve,
           decline: (error: Error) => {
             console.error("Elicitation request rejected:", error);
           },
         },
       ]);
+
+      setActiveTab("elicitations");
+      window.location.hash = "elicitations";
     },
     getRoots: () => rootsRef.current,
   });
 
+  useEffect(() => {
+    if (serverCapabilities) {
+      const hash = window.location.hash.slice(1);
+
+      const validTabs = [
+        ...(serverCapabilities?.resources ? ["resources"] : []),
+        ...(serverCapabilities?.prompts ? ["prompts"] : []),
+        ...(serverCapabilities?.tools ? ["tools"] : []),
+        "ping",
+        "sampling",
+        "elicitations",
+        "roots",
+        "auth",
+      ];
+
+      const isValidTab = validTabs.includes(hash);
+
+      if (!isValidTab) {
+        const defaultTab = serverCapabilities?.resources
+          ? "resources"
+          : serverCapabilities?.prompts
+            ? "prompts"
+            : serverCapabilities?.tools
+              ? "tools"
+              : "ping";
+
+        setActiveTab(defaultTab);
+        window.location.hash = defaultTab;
+      }
+    }
+  }, [serverCapabilities]);
+
   useEffect(() => {
     localStorage.setItem("lastCommand", command);
   }, [command]);
@@ -260,7 +309,6 @@ const App = () => {
     saveInspectorConfig(CONFIG_LOCAL_STORAGE_KEY, config);
   }, [config]);
 
-  // Auto-connect to previously saved serverURL after OAuth callback
   const onOAuthConnect = useCallback(
     (serverUrl: string) => {
       setSseUrl(serverUrl);
@@ -270,7 +318,6 @@ const App = () => {
     [connectMcpServer],
   );
 
-  // Update OAuth debug state during debug callback
   const onOAuthDebugConnect = useCallback(
     async ({
       authorizationCode,
@@ -291,7 +338,6 @@ const App = () => {
       }
 
       if (restoredState && authorizationCode) {
-        // Restore the previous auth state and continue the OAuth flow
         let currentState: AuthDebuggerState = {
           ...restoredState,
           authorizationCode,
@@ -302,12 +348,10 @@ const App = () => {
         };
 
         try {
-          // Create a new state machine instance to continue the flow
           const stateMachine = new OAuthStateMachine(sseUrl, (updates) => {
             currentState = { ...currentState, ...updates };
           });
 
-          // Continue stepping through the OAuth flow from where we left off
           while (
             currentState.oauthStep !== "complete" &&
             currentState.oauthStep !== "authorization_code"
@@ -316,7 +360,6 @@ const App = () => {
           }
 
           if (currentState.oauthStep === "complete") {
-            // After the flow completes or reaches a user-input step, update the app state
             updateAuthState({
               ...currentState,
               statusMessage: {
@@ -339,7 +382,6 @@ const App = () => {
           });
         }
       } else if (authorizationCode) {
-        // Fallback to the original behavior if no state was restored
         updateAuthState({
           authorizationCode,
           oauthStep: "token_request",
@@ -349,7 +391,6 @@ const App = () => {
     [sseUrl],
   );
 
-  // Load OAuth tokens when sseUrl changes
   useEffect(() => {
     const loadOAuthTokens = async () => {
       try {
@@ -408,6 +449,18 @@ const App = () => {
     }
   }, []);
 
+  useEffect(() => {
+    const handleHashChange = () => {
+      const hash = window.location.hash.slice(1);
+      if (hash && hash !== activeTab) {
+        setActiveTab(hash);
+      }
+    };
+
+    window.addEventListener("hashchange", handleHashChange);
+    return () => window.removeEventListener("hashchange", handleHashChange);
+  }, [activeTab]);
+
   const handleApproveSampling = (id: number, result: CreateMessageResult) => {
     setPendingSampleRequests((prev) => {
       const request = prev.find((r) => r.id === id);
@@ -430,7 +483,34 @@ const App = () => {
   ) => {
     setPendingElicitationRequests((prev) => {
       const request = prev.find((r) => r.id === id);
-      request?.resolve(response);
+      if (request) {
+        request.resolve(response);
+
+        if (request.originatingTab) {
+          const originatingTab = request.originatingTab;
+
+          const validTabs = [
+            ...(serverCapabilities?.resources ? ["resources"] : []),
+            ...(serverCapabilities?.prompts ? ["prompts"] : []),
+            ...(serverCapabilities?.tools ? ["tools"] : []),
+            "ping",
+            "sampling",
+            "elicitations",
+            "roots",
+            "auth",
+          ];
+
+          if (validTabs.includes(originatingTab)) {
+            setActiveTab(originatingTab);
+            window.location.hash = originatingTab;
+
+            setTimeout(() => {
+              setActiveTab(originatingTab);
+              window.location.hash = originatingTab;
+            }, 100);
+          }
+        }
+      }
       return prev.filter((r) => r.id !== id);
     });
   };
@@ -492,7 +572,23 @@ const App = () => {
     setNextResourceTemplateCursor(response.nextCursor);
   };
 
+  const getPrompt = async (name: string, args: Record<string, string> = {}) => {
+    lastToolCallOriginTabRef.current = currentTabRef.current;
+
+    const response = await sendMCPRequest(
+      {
+        method: "prompts/get" as const,
+        params: { name, arguments: args },
+      },
+      GetPromptResultSchema,
+      "prompts",
+    );
+    setPromptContent(JSON.stringify(response, null, 2));
+  };
+
   const readResource = async (uri: string) => {
+    lastToolCallOriginTabRef.current = currentTabRef.current;
+
     const response = await sendMCPRequest(
       {
         method: "resources/read" as const,
@@ -549,18 +645,6 @@ const App = () => {
     setNextPromptCursor(response.nextCursor);
   };
 
-  const getPrompt = async (name: string, args: Record<string, string> = {}) => {
-    const response = await sendMCPRequest(
-      {
-        method: "prompts/get" as const,
-        params: { name, arguments: args },
-      },
-      GetPromptResultSchema,
-      "prompts",
-    );
-    setPromptContent(JSON.stringify(response, null, 2));
-  };
-
   const listTools = async () => {
     const response = await sendMCPRequest(
       {
@@ -572,11 +656,12 @@ const App = () => {
     );
     setTools(response.tools);
     setNextToolCursor(response.nextCursor);
-    // Cache output schemas for validation
     cacheToolOutputSchemas(response.tools);
   };
 
   const callTool = async (name: string, params: Record<string, unknown>) => {
+    lastToolCallOriginTabRef.current = currentTabRef.current;
+
     try {
       const response = await sendMCPRequest(
         {
@@ -592,6 +677,7 @@ const App = () => {
         CompatibilityCallToolResultSchema,
         "tools",
       );
+
       setToolResult(response);
     } catch (e) {
       const toolResult: CompatibilityCallToolResult = {
@@ -626,7 +712,6 @@ const App = () => {
     setStdErrNotifications([]);
   };
 
-  // Helper component for rendering the AuthDebugger
   const AuthDebuggerWrapper = () => (
     <TabsContent value="auth">
       <AuthDebugger
@@ -638,7 +723,6 @@ const App = () => {
     </TabsContent>
   );
 
-  // Helper function to render OAuth callback components
   if (window.location.pathname === "/oauth/callback") {
     const OAuthCallback = React.lazy(
       () => import("./components/OAuthCallback"),
@@ -698,7 +782,6 @@ const App = () => {
           loggingSupported={!!serverCapabilities?.logging || false}
           clearStdErrNotifications={clearStdErrNotifications}
         />
-        {/* Drag handle for resizing sidebar */}
         <div
           onMouseDown={handleSidebarDragStart}
           style={{
@@ -719,21 +802,12 @@ const App = () => {
         <div className="flex-1 overflow-auto">
           {mcpClient ? (
             <Tabs
-              defaultValue={
-                Object.keys(serverCapabilities ?? {}).includes(
-                  window.location.hash.slice(1),
-                )
-                  ? window.location.hash.slice(1)
-                  : serverCapabilities?.resources
-                    ? "resources"
-                    : serverCapabilities?.prompts
-                      ? "prompts"
-                      : serverCapabilities?.tools
-                        ? "tools"
-                        : "ping"
-              }
+              value={activeTab}
               className="w-full p-4"
-              onValueChange={(value) => (window.location.hash = value)}
+              onValueChange={(value) => {
+                setActiveTab(value);
+                window.location.hash = value;
+              }}
             >
               <TabsList className="mb-4 py-0">
                 <TabsTrigger
@@ -895,7 +969,6 @@ const App = () => {
                       clearTools={() => {
                         setTools([]);
                         setNextToolCursor(undefined);
-                        // Clear cached output schemas
                         cacheToolOutputSchemas([]);
                       }}
                       callTool={async (name, params) => {
diff --git a/client/src/components/ElicitationTab.tsx b/client/src/components/ElicitationTab.tsx
index c8c88fa8b..cf3be2b5c 100644
--- a/client/src/components/ElicitationTab.tsx
+++ b/client/src/components/ElicitationTab.tsx
@@ -17,6 +17,7 @@ export interface ElicitationResponse {
 export type PendingElicitationRequest = {
   id: number;
   request: ElicitationRequestData;
+  originatingTab?: string;
 };
 
 export type Props = {