feat/ui: chat adapted tools

package-lock.json

@@ -22,6 +22,7 @@
         "web-vitals": "^2.1.4"
       },
       "devDependencies": {
+        "@types/node": "^25.0.3",
         "@types/react": "^19.2.7",
         "@types/react-dom": "^19.2.3",
         "autoprefixer": "^10.4.22",
@@ -75,6 +76,7 @@
       "resolved": "https://registry.npmjs.org/@babel/core/-/core-7.28.5.tgz",
       "integrity": "sha512-e7jT4DxYvIDLk1ZHmU/m/mB19rex9sv0c2ftBtjSBv+kVM/902eh0fINUzD7UwLLNR+jU585GxUJ8/EBfAM5fw==",
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "@babel/code-frame": "^7.27.1",
         "@babel/generator": "^7.28.5",
@@ -724,6 +726,7 @@
       "resolved": "https://registry.npmjs.org/@babel/plugin-syntax-flow/-/plugin-syntax-flow-7.27.1.tgz",
       "integrity": "sha512-p9OkPbZ5G7UT1MofwYFigGebnrzGJacoBSQM0/6bi/PUMVE+qlWDD/OalvQKbwgQzU6dl0xAv6r4X7Jme0RYxA==",
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "@babel/helper-plugin-utils": "^7.27.1"
       },
@@ -1607,6 +1610,7 @@
       "resolved": "https://registry.npmjs.org/@babel/plugin-transform-react-jsx/-/plugin-transform-react-jsx-7.27.1.tgz",
       "integrity": "sha512-2KH4LWGSrJIkVf5tSiBFYuXDAoWRq2MMwgivCf+93dd0GQi8RXLjKA/0EvRnVV5G0hrHczsquXuD01L8s6dmBw==",
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "@babel/helper-annotate-as-pure": "^7.27.1",
         "@babel/helper-module-imports": "^7.27.1",
@@ -2097,7 +2101,6 @@
       "integrity": "sha512-IchNf6dN4tHoMFIn/7OE8LWZ19Y6q/67Bmf6vnGREv8RSbBVb9LPJxEcnwrcwX6ixSvaiGoomAUvu4YSxXrVgw==",
       "license": "MIT",
       "optional": true,
-      "peer": true,
       "dependencies": {
         "@jridgewell/trace-mapping": "0.3.9"
       },
@@ -2111,7 +2114,6 @@
       "integrity": "sha512-3Belt6tdc8bPgAtbcmdtNJlirVoTmEb5e2gC94PnkwEW9jI6CAHUeoG85tjWP5WquqfavoMtMwiG4P926ZKKuQ==",
       "license": "MIT",
       "optional": true,
-      "peer": true,
       "dependencies": {
         "@jridgewell/resolve-uri": "^3.0.3",
         "@jridgewell/sourcemap-codec": "^1.4.10"
@@ -3410,6 +3412,7 @@
       "resolved": "https://registry.npmjs.org/@testing-library/dom/-/dom-10.4.1.tgz",
       "integrity": "sha512-o4PXJQidqJl82ckFaXUeoAW+XysPLauYI43Abki5hABd853iMhitooc6znOnczgbTYmEP6U6/y1ZyKAIsvMKGg==",
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "@babel/code-frame": "^7.10.4",
         "@babel/runtime": "^7.12.5",
@@ -3515,32 +3518,28 @@
       "resolved": "https://registry.npmjs.org/@tsconfig/node10/-/node10-1.0.12.tgz",
       "integrity": "sha512-UCYBaeFvM11aU2y3YPZ//O5Rhj+xKyzy7mvcIoAjASbigy8mHMryP5cK7dgjlz2hWxh1g5pLw084E0a/wlUSFQ==",
       "license": "MIT",
-      "optional": true,
-      "peer": true
+      "optional": true
     },
     "node_modules/@tsconfig/node12": {
       "version": "1.0.11",
       "resolved": "https://registry.npmjs.org/@tsconfig/node12/-/node12-1.0.11.tgz",
       "integrity": "sha512-cqefuRsh12pWyGsIoBKJA9luFu3mRxCA+ORZvA4ktLSzIuCUtWVxGIuXigEwO5/ywWFMZ2QEGKWvkZG1zDMTag==",
       "license": "MIT",
-      "optional": true,
-      "peer": true
+      "optional": true
     },
     "node_modules/@tsconfig/node14": {
       "version": "1.0.3",
       "resolved": "https://registry.npmjs.org/@tsconfig/node14/-/node14-1.0.3.tgz",
       "integrity": "sha512-ysT8mhdixWK6Hw3i1V2AeRqZ5WfXg1G43mqoYlM2nc6388Fq5jcXyr5mRsqViLx/GJYdoL0bfXD8nmF+Zn/Iow==",
       "license": "MIT",
-      "optional": true,
-      "peer": true
+      "optional": true
     },
     "node_modules/@tsconfig/node16": {
       "version": "1.0.4",
       "resolved": "https://registry.npmjs.org/@tsconfig/node16/-/node16-1.0.4.tgz",
       "integrity": "sha512-vxhUy4J8lyeyinH7Azl1pdd43GJhZH/tP2weN8TntQblOY+A0XbT8DJk1/oCPuOOyg/Ja757rG0CgHcWC8OfMA==",
       "license": "MIT",
-      "optional": true,
-      "peer": true
+      "optional": true
     },
     "node_modules/@types/aria-query": {
       "version": "5.0.4",
@@ -3825,10 +3824,11 @@
       "license": "MIT"
     },
     "node_modules/@types/node": {
-      "version": "24.10.2",
-      "resolved": "https://registry.npmjs.org/@types/node/-/node-24.10.2.tgz",
-      "integrity": "sha512-WOhQTZ4G8xZ1tjJTvKOpyEVSGgOTvJAfDK3FNFgELyaTpzhdgHVHeqW8V+UJvzF5BT+/B54T/1S2K6gd9c7bbA==",
+      "version": "25.0.3",
+      "resolved": "https://registry.npmjs.org/@types/node/-/node-25.0.3.tgz",
+      "integrity": "sha512-W609buLVRVmeW693xKfzHeIV6nJGGz98uCPfeXI1ELMLXVeKYZ9m15fAMSaUPBHYLGFsVRcMmSCksQOrZV9BYA==",
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "undici-types": "~7.16.0"
       }
@@ -3878,6 +3878,7 @@
       "integrity": "sha512-MWtvHrGZLFttgeEj28VXHxpmwYbor/ATPYbBfSFZEIRK0ecCFLl2Qo55z52Hss+UV9CRN7trSeq1zbgx7YDWWg==",
       "devOptional": true,
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "csstype": "^3.2.2"
       }
@@ -3888,6 +3889,7 @@
       "integrity": "sha512-jp2L/eY6fn+KgVVQAOqYItbF0VY/YApe5Mz2F0aykSO8gx31bYCZyvSeYxCHKvzHG5eZjc+zyaS5BrBWya2+kQ==",
       "devOptional": true,
       "license": "MIT",
+      "peer": true,
       "peerDependencies": {
         "@types/react": "^19.2.0"
       }
@@ -4008,6 +4010,7 @@
       "resolved": "https://registry.npmjs.org/@typescript-eslint/eslint-plugin/-/eslint-plugin-5.62.0.tgz",
       "integrity": "sha512-TiZzBSJja/LbhNPvk6yc0JrX9XqhQ0hdh6M2svYfsHGejaKFIAGd9MQ+ERIMzLGlN/kZoYIgdxFV0PuljTKXag==",
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "@eslint-community/regexpp": "^4.4.0",
         "@typescript-eslint/scope-manager": "5.62.0",
@@ -4061,6 +4064,7 @@
       "resolved": "https://registry.npmjs.org/@typescript-eslint/parser/-/parser-5.62.0.tgz",
       "integrity": "sha512-VlJEV0fOQ7BExOsHYAGrgbEiZoi8D+Bl2+f6V2RrXerRSylnp+ZBHmPvaIa8cz0Ajx7WO7Z5RqfgYg7ED1nRhA==",
       "license": "BSD-2-Clause",
+      "peer": true,
       "dependencies": {
         "@typescript-eslint/scope-manager": "5.62.0",
         "@typescript-eslint/types": "5.62.0",
@@ -4430,6 +4434,7 @@
       "resolved": "https://registry.npmjs.org/acorn/-/acorn-8.15.0.tgz",
       "integrity": "sha512-NZyJarBfL7nWwIq+FDL6Zp/yHEhePMNnnJ0y3qfieCrmNvYct8uvtiV41UvlSe6apAfk0fY1FbWx+NwfmpvtTg==",
       "license": "MIT",
+      "peer": true,
       "bin": {
         "acorn": "bin/acorn"
       },
@@ -4528,6 +4533,7 @@
       "resolved": "https://registry.npmjs.org/ajv/-/ajv-6.12.6.tgz",
       "integrity": "sha512-j3fVLgvTo527anyYyJOGTYJbG+vnnQYvE0m5mmkc1TK+nxAppkCLMIL0aZ4dblVCNoGShhm+kzE4ZUykBoMg4g==",
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "fast-deep-equal": "^3.1.1",
         "fast-json-stable-stringify": "^2.0.0",
@@ -5435,6 +5441,7 @@
         }
       ],
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "baseline-browser-mapping": "^2.9.0",
         "caniuse-lite": "^1.0.30001759",
@@ -6103,8 +6110,7 @@
       "resolved": "https://registry.npmjs.org/create-require/-/create-require-1.1.1.tgz",
       "integrity": "sha512-dcKFX3jn0MpIaXjisoRvexIJVEKzaq7z2rZKxf+MSr9TkdmHmsU4m2lcLojrj/FHl8mk5VxMmYA+ftRkP/3oKQ==",
       "license": "MIT",
-      "optional": true,
-      "peer": true
+      "optional": true
     },
     "node_modules/cross-spawn": {
       "version": "7.0.6",
@@ -6904,7 +6910,6 @@
       "integrity": "sha512-58lmxKSA4BNyLz+HHMUzlOEpg09FV+ev6ZMe3vJihgdxzgcwZ8VoEEPmALCZG9LmqfVoNMMKpttIYTVG6uDY7A==",
       "license": "BSD-3-Clause",
       "optional": true,
-      "peer": true,
       "engines": {
         "node": ">=0.3.1"
       }
@@ -7455,6 +7460,7 @@
       "integrity": "sha512-ypowyDxpVSYpkXr9WPv2PAZCtNip1Mv5KTW0SCurXv/9iOpcrH9PaqUElksqEB6pChqHGDRCFTyrZlGhnLNGiA==",
       "deprecated": "This version is no longer supported. Please see https://eslint.org/version-support for other options.",
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "@eslint-community/eslint-utils": "^4.2.0",
         "@eslint-community/regexpp": "^4.6.1",
@@ -10210,6 +10216,7 @@
       "resolved": "https://registry.npmjs.org/jest/-/jest-27.5.1.tgz",
       "integrity": "sha512-Yn0mADZB89zTtjkPJEXwrac3LHudkQMR+Paqa8uxJHCBr9agxztUifWCyiYrjhMPBoUVBjyny0I7XH6ozDr7QQ==",
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "@jest/core": "^27.5.1",
         "import-local": "^3.0.2",
@@ -11095,6 +11102,7 @@
       "resolved": "https://registry.npmjs.org/jiti/-/jiti-1.21.7.tgz",
       "integrity": "sha512-/imKNG4EbWNrVjoNC/1H5/9GFy+tqjGBHCaSsN+P2RnPqjsLmv6UD3Ej+Kj8nBWaRAwyk7kK5ZUc+OEatnTR3A==",
       "license": "MIT",
+      "peer": true,
       "bin": {
         "jiti": "bin/jiti.js"
       }
@@ -11539,8 +11547,7 @@
       "resolved": "https://registry.npmjs.org/make-error/-/make-error-1.3.6.tgz",
       "integrity": "sha512-s8UhlNe7vPKomQhC1qFelMokr/Sc3AgNbso3n74mVPA5LTZwkB9NlXf4XPamLxJE8h0gh73rM94xvwRT2CVInw==",
       "license": "ISC",
-      "optional": true,
-      "peer": true
+      "optional": true
     },
     "node_modules/makeerror": {
       "version": "1.0.12",
@@ -12458,6 +12465,7 @@
         }
       ],
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "nanoid": "^3.3.11",
         "picocolors": "^1.1.1",
@@ -13592,6 +13600,7 @@
       "resolved": "https://registry.npmjs.org/postcss-selector-parser/-/postcss-selector-parser-6.1.2.tgz",
       "integrity": "sha512-Q8qQfPiZ+THO/3ZrOrO0cJJKfpYCagtMUkXbnEfmgUjwXg6z/WBeOyS9APBBPCTSiDV+s4SwQGu8yFsiMRIudg==",
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "cssesc": "^3.0.0",
         "util-deprecate": "^1.0.2"
@@ -13952,6 +13961,7 @@
       "resolved": "https://registry.npmjs.org/react/-/react-19.2.1.tgz",
       "integrity": "sha512-DGrYcCWK7tvYMnWh79yrPHt+vdx9tY+1gPZa7nJQtO/p8bLTDaHp4dzwEhQB7pZ4Xe3ok4XKuEPrVuc+wlpkmw==",
       "license": "MIT",
+      "peer": true,
       "engines": {
         "node": ">=0.10.0"
       }
@@ -14083,6 +14093,7 @@
       "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-19.2.1.tgz",
       "integrity": "sha512-ibrK8llX2a4eOskq1mXKu/TGZj9qzomO+sNfO98M6d9zIPOEhlBkMkBUBLd1vgS0gQsLDBzA+8jJBVXDnfHmJg==",
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "scheduler": "^0.27.0"
       },
@@ -14100,13 +14111,15 @@
       "version": "17.0.2",
       "resolved": "https://registry.npmjs.org/react-is/-/react-is-17.0.2.tgz",
       "integrity": "sha512-w2GsyukL62IJnlaff/nRegPQR94C/XXamvMWmSHRJ4y7Ts/4ocGRmTHvOs8PSE6pB3dWOrD/nueuU5sduBsQ4w==",
-      "license": "MIT"
+      "license": "MIT",
+      "peer": true
     },
     "node_modules/react-redux": {
       "version": "9.2.0",
       "resolved": "https://registry.npmjs.org/react-redux/-/react-redux-9.2.0.tgz",
       "integrity": "sha512-ROY9fvHhwOD9ySfrF0wmvu//bKCQ6AeZZq1nJNtbDC+kk5DuSuNX/n6YWYF/SYy7bSba4D4FSz8DJeKY/S/r+g==",
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "@types/use-sync-external-store": "^0.0.6",
         "use-sync-external-store": "^1.4.0"
@@ -14130,6 +14143,7 @@
       "resolved": "https://registry.npmjs.org/react-refresh/-/react-refresh-0.11.0.tgz",
       "integrity": "sha512-F27qZr8uUqwhWZboondsPx8tnC3Ct3SxZA3V5WyEvujRyyNv0VYPhoBg1gZ8/MV5tubQp76Trw8lTv9hzRBa+A==",
       "license": "MIT",
+      "peer": true,
       "engines": {
         "node": ">=0.10.0"
       }
@@ -14368,7 +14382,8 @@
       "version": "5.0.1",
       "resolved": "https://registry.npmjs.org/redux/-/redux-5.0.1.tgz",
       "integrity": "sha512-M9/ELqF6fy8FwmkpnF0S3YKOqMyoWJ4+CS5Efg2ct3oY9daQvd/Pc71FpGZsVsbl3Cpb+IIcjBDUnnyBdQbq4w==",
-      "license": "MIT"
+      "license": "MIT",
+      "peer": true
     },
     "node_modules/redux-thunk": {
       "version": "3.1.0",
@@ -14694,6 +14709,7 @@
       "resolved": "https://registry.npmjs.org/rollup/-/rollup-2.79.2.tgz",
       "integrity": "sha512-fS6iqSPZDs3dr/y7Od6y5nha8dW1YnbgtsyotCVvoFGKbERG++CVRFv1meyGDE1SNItQA8BrnCw7ScdAhRJ3XQ==",
       "license": "MIT",
+      "peer": true,
       "bin": {
         "rollup": "dist/bin/rollup"
       },
@@ -14936,6 +14952,7 @@
       "resolved": "https://registry.npmjs.org/ajv/-/ajv-8.17.1.tgz",
       "integrity": "sha512-B/gBuNg5SiMTrPkC+A2+cW0RszwxYmn6VYxB/inlBStS5nx6xHIt/ehKRhIMhqusl7a8LjQoZnjCs5vhwxOQ1g==",
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "fast-deep-equal": "^3.1.3",
         "fast-uri": "^3.0.1",
@@ -16286,23 +16303,6 @@
         }
       }
     },
-    "node_modules/tailwindcss/node_modules/yaml": {
-      "version": "2.8.2",
-      "resolved": "https://registry.npmjs.org/yaml/-/yaml-2.8.2.tgz",
-      "integrity": "sha512-mplynKqc1C2hTVYxd0PU2xQAc22TI1vShAYGksCCfxbn/dFwnHTNi1bvYsBTkhdUNtGIf5xNOg938rrSSYvS9A==",
-      "license": "ISC",
-      "optional": true,
-      "peer": true,
-      "bin": {
-        "yaml": "bin.mjs"
-      },
-      "engines": {
-        "node": ">= 14.6"
-      },
-      "funding": {
-        "url": "https://github.com/sponsors/eemeli"
-      }
-    },
     "node_modules/tapable": {
       "version": "2.3.0",
       "resolved": "https://registry.npmjs.org/tapable/-/tapable-2.3.0.tgz",
@@ -16526,6 +16526,7 @@
       "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-4.0.3.tgz",
       "integrity": "sha512-5gTmgEY/sqK6gFXLIsQNH19lWb4ebPDLA4SdLP7dsWkIXHWlG66oPuVvXSGFPppYZz8ZDZq0dYYrbHfBCVUb1Q==",
       "license": "MIT",
+      "peer": true,
       "engines": {
         "node": ">=12"
       },
@@ -16614,7 +16615,6 @@
       "integrity": "sha512-f0FFpIdcHgn8zcPSbf1dRevwt047YMnaiJM3u2w2RewrB+fob/zePZcrOyQoLMMO7aBIddLcQIEK5dYjkLnGrQ==",
       "license": "MIT",
       "optional": true,
-      "peer": true,
       "dependencies": {
         "@cspotcode/source-map-support": "^0.8.0",
         "@tsconfig/node10": "^1.0.7",
@@ -16659,7 +16659,6 @@
       "integrity": "sha512-ueEepnujpqee2o5aIYnvHU6C0A42MNdsIDeqy5BydrkuC5R1ZuUFnm27EeFJGoEHJQgn3uleRvmTXaJgfXbt4g==",
       "license": "MIT",
       "optional": true,
-      "peer": true,
       "dependencies": {
         "acorn": "^8.11.0"
       },
@@ -16672,8 +16671,7 @@
       "resolved": "https://registry.npmjs.org/arg/-/arg-4.1.3.tgz",
       "integrity": "sha512-58S9QDqG0Xx27YwPSt9fJxivjYl432YCwfDMfZ+71RAqUrZef7LrKQZ3LHLOwCS4FLNBplP533Zx895SeOCHvA==",
       "license": "MIT",
-      "optional": true,
-      "peer": true
+      "optional": true
     },
     "node_modules/tsconfig-paths": {
       "version": "3.15.0",
@@ -16761,6 +16759,7 @@
       "resolved": "https://registry.npmjs.org/type-fest/-/type-fest-0.20.2.tgz",
       "integrity": "sha512-Ne+eE4r0/iWnpAxD852z3A+N0Bt5RN//NjJwRd2VFHEmrywxf5vsZlh4R6lixl6B+wz/8d+maTSAkN1FIkI3LQ==",
       "license": "(MIT OR CC0-1.0)",
+      "peer": true,
       "engines": {
         "node": ">=10"
       },
@@ -17102,8 +17101,7 @@
       "resolved": "https://registry.npmjs.org/v8-compile-cache-lib/-/v8-compile-cache-lib-3.0.1.tgz",
       "integrity": "sha512-wa7YjyUGfNZngI/vtK0UHAN+lgDCxBPCylVXGp0zu59Fz5aiGtNXaq3DhIov063MorB+VfufLh3JlF2KdTK3xg==",
       "license": "MIT",
-      "optional": true,
-      "peer": true
+      "optional": true
     },
     "node_modules/v8-to-istanbul": {
       "version": "8.1.1",
@@ -17229,6 +17227,7 @@
       "resolved": "https://registry.npmjs.org/webpack/-/webpack-5.103.0.tgz",
       "integrity": "sha512-HU1JOuV1OavsZ+mfigY0j8d1TgQgbZ6M+J75zDkpEAwYeXjWSqrGJtgnPblJjd/mAyTNQ7ygw0MiKOn6etz8yw==",
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "@types/eslint-scope": "^3.7.7",
         "@types/estree": "^1.0.8",
@@ -17300,6 +17299,7 @@
       "resolved": "https://registry.npmjs.org/webpack-dev-server/-/webpack-dev-server-4.15.2.tgz",
       "integrity": "sha512-0XavAZbNJ5sDrCbkpWL8mia0o5WPOd2YGtxrEiZkBK9FjLppIUK2TgxK6qGD2P3hUXTJNNPVibrerKcx5WkR1g==",
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "@types/bonjour": "^3.5.9",
         "@types/connect-history-api-fallback": "^1.3.5",
@@ -17712,6 +17712,7 @@
       "resolved": "https://registry.npmjs.org/ajv/-/ajv-8.17.1.tgz",
       "integrity": "sha512-B/gBuNg5SiMTrPkC+A2+cW0RszwxYmn6VYxB/inlBStS5nx6xHIt/ehKRhIMhqusl7a8LjQoZnjCs5vhwxOQ1g==",
       "license": "MIT",
+      "peer": true,
       "dependencies": {
         "fast-deep-equal": "^3.1.3",
         "fast-uri": "^3.0.1",
@@ -18087,7 +18088,6 @@
       "integrity": "sha512-Ux4ygGWsu2c7isFWe8Yu1YluJmqVhxqK2cLXNQA5AcC3QfbGNpM7fu0Y8b/z16pXLnFxZYvWhd3fhBY9DLmC6Q==",
       "license": "MIT",
       "optional": true,
-      "peer": true,
       "engines": {
         "node": ">=6"
       }

package.json

@@ -17,6 +17,7 @@
     "web-vitals": "^2.1.4"
   },
   "devDependencies": {
+    "@types/node": "^25.0.3",
     "@types/react": "^19.2.7",
     "@types/react-dom": "^19.2.3",
     "autoprefixer": "^10.4.22",

src/app/components/chat/ChatInput.tsx

@@ -4,8 +4,8 @@ import { useMCPTools } from '../../hooks/useMCPTools.ts';
 import type { MCPTool } from '../../types/index.ts';
 
 type ChatInputProps = {
-  onSubmit?: (message: string, selectedTool?: string | null) => void;
-  onAudioSubmit?: (audioBlob: Blob, selectedTool?: string | null) => void;
+  onSubmit?: (message: string, selectedTool?: string | null, stance?: 'positive' | 'negative') => void;
+  onAudioSubmit?: (audioBlob: Blob, selectedTool?: string | null, stance?: 'positive' | 'negative') => void;
   placeholder?: string;
 };
 
@@ -14,11 +14,39 @@ const isMCPTool = (value: any): value is MCPTool => {
   return value && typeof value === 'object' && typeof value.name === 'string';
 };
 
+// Allowed tools - only these 3 will be shown
+const ALLOWED_TOOLS = ['detect stance', 'generate argument', 'extract topic'];
+
+// Helper function to check if a tool name matches one of the allowed tools
+const isAllowedTool = (toolName: string): boolean => {
+  const toolLower = toolName.toLowerCase();
+  return ALLOWED_TOOLS.some(allowed => 
+    toolLower.includes(allowed.split(' ')[0]) && 
+    toolLower.includes(allowed.split(' ')[1])
+  );
+};
+
+// Helper function to normalize tool name to standard format
+const normalizeToolName = (toolName: string): string => {
+  const toolLower = toolName.toLowerCase();
+  if (toolLower.includes('detect') && toolLower.includes('stance')) {
+    return 'detect stance';
+  }
+  if (toolLower.includes('generate') && toolLower.includes('argument')) {
+    return 'generate argument';
+  }
+  if (toolLower.includes('extract') && toolLower.includes('topic')) {
+    return 'extract topic';
+  }
+  return toolName;
+};
+
 const ChatInput = ({ onSubmit, onAudioSubmit, placeholder = 'Ask a follow-up...' }: ChatInputProps) => {
   const [input, setInput] = useState('');
   const [isRecording, setIsRecording] = useState(false);
   const [showToolsDropdown, setShowToolsDropdown] = useState(false);
   const [selectedTool, setSelectedTool] = useState<string | null>(null);
+  const [selectedStance, setSelectedStance] = useState<'positive' | 'negative' | null>(null);
   const [searchQuery, setSearchQuery] = useState('');
   const [focusedIndex, setFocusedIndex] = useState(-1);
   const [dropdownPosition, setDropdownPosition] = useState<'below' | 'above'>('below');
@@ -36,15 +64,21 @@ const ChatInput = ({ onSubmit, onAudioSubmit, placeholder = 'Ask a follow-up...'
   const recordingTimerRef = useRef<NodeJS.Timeout | null>(null);
   const { tools, loading, error, refetch } = useMCPTools();
 
-  const handleSubmit = (e: any) => {
+  const handleSubmit = (e: React.FormEvent<HTMLFormElement>) => {
     e.preventDefault();
+    e.stopPropagation();
     if (input.trim()) {
       if (onSubmit) {
-        onSubmit(input, selectedTool);
+        onSubmit(input, selectedTool, selectedStance || undefined);
       }
       console.log('Submitted:', input);
       setInput('');
+      // Reset stance after submit if generate argument tool
+      if (selectedTool && normalizeToolName(selectedTool) === 'generate argument') {
+        setSelectedStance(null);
+      }
     }
+    return false;
   };
 
   const handleMicClick = async () => {
@@ -207,7 +241,11 @@ const ChatInput = ({ onSubmit, onAudioSubmit, placeholder = 'Ask a follow-up...'
 
     // Submit the recorded audio if available
     if (audioBlob && onAudioSubmit) {
-      onAudioSubmit(audioBlob, selectedTool);
+      onAudioSubmit(audioBlob, selectedTool, selectedStance || undefined);
+      // Reset stance after submit if generate argument tool
+      if (selectedTool && normalizeToolName(selectedTool) === 'generate argument') {
+        setSelectedStance(null);
+      }
     }
 
     // Clean up and return to normal chat mode
@@ -518,9 +556,13 @@ const ChatInput = ({ onSubmit, onAudioSubmit, placeholder = 'Ask a follow-up...'
                     e.preventDefault();
                     if (input.trim()) {
                       if (onSubmit) {
-                        onSubmit(input, selectedTool);
+                        onSubmit(input, selectedTool, selectedStance || undefined);
                       }
                       setInput('');
+                      // Reset stance after submit if generate argument tool
+                      if (selectedTool && normalizeToolName(selectedTool) === 'generate argument') {
+                        setSelectedStance(null);
+                      }
                     }
                   }
                 }}
@@ -534,6 +576,35 @@ const ChatInput = ({ onSubmit, onAudioSubmit, placeholder = 'Ask a follow-up...'
                 }}
               />
 
+              {/* Stance selection buttons for generate argument tool */}
+              {selectedTool && normalizeToolName(selectedTool) === 'generate argument' && (
+                <div className="mt-3 flex items-center gap-2">
+                  <span className="text-xs font-medium text-zinc-600 dark:text-zinc-400">Select stance:</span>
+                  <button
+                    type="button"
+                    onClick={() => setSelectedStance(selectedStance === 'positive' ? null : 'positive')}
+                    className={`px-3 py-1.5 text-xs rounded-full font-medium transition-all ${
+                      selectedStance === 'positive'
+                        ? 'bg-emerald-500 text-white shadow-md'
+                        : 'bg-emerald-100 text-emerald-800 hover:bg-emerald-200 dark:bg-emerald-900/40 dark:text-emerald-200 dark:hover:bg-emerald-900/60'
+                    }`}
+                  >
+                    Positive
+                  </button>
+                  <button
+                    type="button"
+                    onClick={() => setSelectedStance(selectedStance === 'negative' ? null : 'negative')}
+                    className={`px-3 py-1.5 text-xs rounded-full font-medium transition-all ${
+                      selectedStance === 'negative'
+                        ? 'bg-rose-500 text-white shadow-md'
+                        : 'bg-rose-100 text-rose-800 hover:bg-rose-200 dark:bg-rose-900/40 dark:text-rose-200 dark:hover:bg-rose-900/60'
+                    }`}
+                  >
+                    Negative
+                  </button>
+                </div>
+              )}
+
               <div className="flex items-center justify-between mt-8">
                 <div className="flex items-center gap-2">
                   <button
@@ -619,7 +690,7 @@ const ChatInput = ({ onSubmit, onAudioSubmit, placeholder = 'Ask a follow-up...'
                                   </div>
                                 </div>
                               </div>
-                            ) : tools.filter(isMCPTool).length === 0 ? (
+                            ) : tools.filter(isMCPTool).filter(tool => isAllowedTool(tool.name)).length === 0 ? (
                               <div className="px-4 py-6">
                                 <div className="flex flex-col items-center gap-3 text-center">
                                   <div className="h-12 w-12 rounded-full bg-zinc-100 dark:bg-zinc-800 flex items-center justify-center">
@@ -635,6 +706,7 @@ const ChatInput = ({ onSubmit, onAudioSubmit, placeholder = 'Ask a follow-up...'
                               <div className="p-2">
                                 {tools
                                   .filter(isMCPTool)
+                                  .filter(tool => isAllowedTool(tool.name))
                                   .filter(tool =>
                                     tool.name.toLowerCase().includes(searchQuery.toLowerCase()) ||
                                     (tool.description && tool.description.toLowerCase().includes(searchQuery.toLowerCase()))
@@ -651,7 +723,12 @@ const ChatInput = ({ onSubmit, onAudioSubmit, placeholder = 'Ask a follow-up...'
                                           : 'hover:bg-zinc-50 dark:hover:bg-zinc-800/50 border border-transparent'
                                       }`}
                                       onClick={() => {
-                                        setSelectedTool((current) => (current === tool.name ? null : tool.name));
+                                        const newTool = tool.name === selectedTool ? null : tool.name;
+                                        setSelectedTool(newTool);
+                                        // Reset stance when tool changes
+                                        if (newTool && normalizeToolName(newTool) !== 'generate argument') {
+                                          setSelectedStance(null);
+                                        }
                                         setShowToolsDropdown(false);
                                         setFocusedIndex(-1);
                                       }}
@@ -690,6 +767,7 @@ const ChatInput = ({ onSubmit, onAudioSubmit, placeholder = 'Ask a follow-up...'
                                 type="button"
                                 onClick={() => {
                                   setSelectedTool(null);
+                                  setSelectedStance(null);
                                   setShowToolsDropdown(false);
                                   setFocusedIndex(-1);
                                 }}
@@ -721,14 +799,6 @@ const ChatInput = ({ onSubmit, onAudioSubmit, placeholder = 'Ask a follow-up...'
 
                 <button
                   type="submit"
-                  onClick={() => {
-                    if (input.trim()) {
-                      if (onSubmit) {
-                        onSubmit(input, selectedTool);
-                      }
-                      setInput('');
-                    }
-                  }}
                   disabled={!input.trim()}
                   className="h-8 w-8 p-0 bg-zinc-300 dark:bg-zinc-700 hover:bg-zinc-400 dark:hover:bg-zinc-600 disabled:bg-zinc-200 dark:disabled:bg-zinc-800 disabled:text-zinc-400 dark:disabled:text-zinc-500 text-zinc-800 dark:text-white rounded-lg transition-all duration-200 hover:scale-110 disabled:hover:scale-100 flex items-center justify-center disabled:cursor-not-allowed"
                 >

src/app/components/chat/MessageList.tsx

@@ -28,7 +28,50 @@ const MessageList = ({ messages, isLoading = false, error = null, onRetry }: Mes
     });
   };
 
+  const getToolClasses = (message: ChatMessage) => {
+    if (message.role !== 'assistant' || !message.tool) return '';
+  
+    const toolLower = message.tool.toLowerCase();
+    
+    // Match tool names flexibly (case-insensitive, handles variations)
+    if (toolLower.includes('detect') && toolLower.includes('stance')) {
+      return 'border-l-4 border-blue-400 pl-3 bg-blue-50/30 dark:bg-blue-900/10';
+    }
+    if (toolLower.includes('generate') && toolLower.includes('argument')) {
+      return 'border-l-4 border-purple-400 pl-3 bg-purple-50/30 dark:bg-purple-900/10';
+    }
+    if (toolLower.includes('extract') && toolLower.includes('topic')) {
+      return 'border-l-4 border-emerald-400 pl-3 bg-emerald-50/30 dark:bg-emerald-900/10';
+    }
+    
+    // Default styling for other tools
+    return 'border-l-4 border-teal-400 pl-3 bg-teal-50/30 dark:bg-teal-900/10';
+  };
+
+  const getToolLabel = (tool: string | null | undefined): string => {
+    if (!tool) return '';
+    
+    const toolLower = tool.toLowerCase();
+    
+    if (toolLower.includes('detect') && toolLower.includes('stance')) {
+      return 'Detect Stance';
+    }
+    if (toolLower.includes('generate') && toolLower.includes('argument')) {
+      return 'Generate Argument';
+    }
+    if (toolLower.includes('extract') && toolLower.includes('topic')) {
+      return 'Extract Topic';
+    }
+    
+    // Return formatted tool name (capitalize first letter of each word)
+    return tool.split(/[\s_-]+/).map(word => 
+      word.charAt(0).toUpperCase() + word.slice(1).toLowerCase()
+    ).join(' ');
+  };
+  
   return (
+
+    
     <div className="flex-1 overflow-y-auto px-4 py-6 space-y-4">
       {messages.length === 0 && !isLoading && (
         <div className="flex flex-col items-center justify-center h-full text-center">
@@ -48,7 +91,8 @@ const MessageList = ({ messages, isLoading = false, error = null, onRetry }: Mes
         </div>
       )}
 
-      {messages.map((message) => (
+      {messages.map((message) => {
+        return(
         <div
           key={message.id}
           className={`flex ${message.role === 'user' ? 'justify-end' : 'justify-start'}`}
@@ -58,22 +102,47 @@ const MessageList = ({ messages, isLoading = false, error = null, onRetry }: Mes
               message.role === 'user'
                 ? 'bg-teal-500 text-white ml-12'
                 : 'bg-gray-100 dark:bg-gray-800 text-gray-900 dark:text-gray-100 mr-12'
-            }`}
+            }${getToolClasses(message)}`} // Apply tool-specific classes
           >
             {message.audioUrl ? (
-              // Audio message display - only the player itself
+              // Audio message display
               <div>
-                <AudioPlayer
-                  src={message.audioUrl}
-                />
+                <AudioPlayer src={message.audioUrl} />
               </div>
             ) : (
               // Regular text message
               <div>
-                <div className="whitespace-pre-wrap break-words">{message.content}</div>
+                {message.tool && message.role === 'assistant' && (
+                  <div className="mb-2 text-xs font-semibold uppercase tracking-wide text-gray-500 dark:text-gray-400">
+                    {getToolLabel(message.tool)}
+                  </div>
+                )}
+
+                <div className="whitespace-pre-wrap break-words">
+                  {message.content}
+                </div>
+
+                {message.role === 'assistant' && message.tool && 
+                 message.tool.toLowerCase().includes('generate') && 
+                 message.tool.toLowerCase().includes('argument') && (
+                  <div className="mt-3 flex gap-2">
+                    <button
+                      type="button"
+                      className="px-3 py-1 text-xs rounded-full bg-emerald-100 text-emerald-800 hover:bg-emerald-200 dark:bg-emerald-900/40 dark:text-emerald-200 transition-colors"
+                    >
+                      Positive stance
+                    </button>
+                    <button
+                      type="button"
+                      className="px-3 py-1 text-xs rounded-full bg-rose-100 text-rose-800 hover:bg-rose-200 dark:bg-rose-900/40 dark:text-rose-200 transition-colors"
+                    >
+                      Negative stance
+                    </button>
+                  </div>
+                )}
               </div>
             )}
-            <div
+<div
               className={`text-xs mt-1 ${
                 message.role === 'user'
                   ? 'text-teal-100'
@@ -84,7 +153,7 @@ const MessageList = ({ messages, isLoading = false, error = null, onRetry }: Mes
             </div>
           </div>
         </div>
-      ))}
+      )})}
 
       {isLoading && (
         <div className="flex justify-start">

src/app/hooks/useChat.ts

@@ -28,6 +28,16 @@ export const useChat = () => {
 
 
   const extractTopicAndPosition = useCallback(async (userInput: string): Promise<{ topic: string; position: string }> => {
+    // Default fallback values
+    const fallback = {
+      topic: userInput.trim().slice(0, 100) || 'General Discussion',
+      position: 'positive'
+    };
+
+    if (!userInput || !userInput.trim()) {
+      return fallback;
+    }
+
     const extractionPrompt = `Extract the debate topic and position from the following text. Return ONLY a JSON object with "topic" and "position" keys. The position should be either "positive" (in favor) or "negative" (against).
 
 Text: "${userInput}"
@@ -38,16 +48,33 @@ Example output:
     try {
       const response = await sendChatMessageStream([
         { id: generateId(), role: 'user', content: extractionPrompt, timestamp: new Date() }
-      ], () => {});
-      
-      // Parse the JSON response
-      const jsonMatch = response.match(/\{[^}]+\}/);
+      ], () => { });
+
+      if (!response) {
+        console.warn('Empty response from extraction API');
+        return fallback;
+      }
+
+      // Try to extract JSON from the response (handles markdown blocks and extra text)
+      const jsonMatch = response.match(/\{[\s\S]*?\}/);
       if (jsonMatch) {
-        return JSON.parse(jsonMatch[0]);
+        try {
+          const parsed = JSON.parse(jsonMatch[0]);
+          return {
+            topic: parsed.topic || fallback.topic,
+            position: (parsed.position?.toLowerCase().includes('neg')) ? 'negative' : 'positive'
+          };
+        } catch (parseError) {
+          console.error('Failed to parse extracted JSON:', parseError, 'Raw match:', jsonMatch[0]);
+        }
+      } else {
+        console.warn('No JSON structure found in extraction response:', response);
       }
-      throw new Error('Failed to extract topic and position');
+
+      return fallback;
     } catch (error) {
-      throw new Error('Failed to extract topic and position from input');
+      console.error('Error in extractTopicAndPosition process:', error);
+      return fallback;
     }
   }, []);
 
@@ -57,9 +84,11 @@ Example output:
     // Add user audio message
     const userMessage: Omit<ChatMessage, 'id' | 'timestamp'> = {
       role: 'user',
-      content: 'Audio message sent', // Placeholder text for audio message
-      audioUrl: URL.createObjectURL(audioBlob), // Store the audio URL for playback in UI
+      content: 'Audio message sent',
+      audioUrl: URL.createObjectURL(audioBlob),
+      tool: selectedTool ?? null,
     };
+
     addMessage(userMessage);
 
     // Set loading state
@@ -121,12 +150,14 @@ Example output:
     }
   }, [addMessage]);
 
-  const sendMessage = useCallback(async (content: string, selectedTool?: string | null) => {
+  const sendMessage = useCallback(async (content: string, selectedTool?: string | null, stance?: 'positive' | 'negative') => {
     // Add user message
     const userMessage: Omit<ChatMessage, 'id' | 'timestamp'> = {
       role: 'user',
       content,
+      tool: selectedTool ?? null,
     };
+
     addMessage(userMessage);
 
     // Set loading state
@@ -141,8 +172,20 @@ Example output:
 
       if (isGenerateArgumentTool) {
         console.log('Generate argument tool detected:', selectedTool);
-        // Extract topic and position using LLM
-        const { topic, position } = await extractTopicAndPosition(content);
+        // Extract topic and position from content
+        let topic: string;
+        let position: string;
+
+        try {
+          const extracted = await extractTopicAndPosition(content);
+          topic = extracted.topic;
+          // Use provided stance if available, otherwise use extracted position
+          position = stance || extracted.position;
+        } catch (error) {
+          console.error('Unexpected error in topic extraction:', error);
+          topic = content.slice(0, 100) || 'General Discussion';
+          position = stance || 'positive';
+        }
 
         // Call the external API
         const argumentResponse = await generateEnhancedArgument({ topic, position });
@@ -151,7 +194,9 @@ Example output:
         const assistantMessage: Omit<ChatMessage, 'id' | 'timestamp'> = {
           role: 'assistant',
           content: argumentResponse.enhanced_argument,
+          tool: selectedTool ?? 'generate_argument',
         };
+
         addMessage(assistantMessage);
       } else {
         // Regular chat - use n8n webhook /debate-assistant endpoint
@@ -191,6 +236,7 @@ Example output:
 
         // Extract final_argument from response
         const finalArgument = data?.final_argument || data?.result?.result?.[0]?.text || 'No response received';
+        const assistantTool = data?.tool_name ?? selectedTool ?? 'debate-assistant';
 
         // Parse if final_argument is a JSON string
         let finalContent = finalArgument;
@@ -207,6 +253,7 @@ Example output:
         const assistantMessage: Omit<ChatMessage, 'id' | 'timestamp'> = {
           role: 'assistant',
           content: finalContent,
+          tool: assistantTool,
         };
         addMessage(assistantMessage);
       }
@@ -227,7 +274,7 @@ Example output:
       const lastUserMessage = [...state.messages]
         .reverse()
         .find(msg => msg.role === 'user');
-      
+
       if (lastUserMessage) {
         // Remove the last failed assistant message if exists
         setState(prev => {
@@ -241,7 +288,7 @@ Example output:
           }
           return { ...prev, error: null };
         });
-        
+
         // Resend the user message
         sendMessage(lastUserMessage.content);
       }

src/app/pages/ChatPage.tsx

@@ -6,11 +6,11 @@ import { useChat } from '../hooks/useChat.ts';
 const ChatPage = () => {
   const { messages, isLoading, error, sendMessage, sendAudioMessage, retryLastMessage } = useChat();
 
-  const handleMessageSubmit = (message: string, selectedTool?: string | null) => {
-    sendMessage(message, selectedTool);
+  const handleMessageSubmit = (message: string, selectedTool?: string | null, stance?: 'positive' | 'negative') => {
+    sendMessage(message, selectedTool, stance);
   };
 
-  const handleAudioSubmit = (audioBlob: Blob, selectedTool?: string | null) => {
+  const handleAudioSubmit = (audioBlob: Blob, selectedTool?: string | null, stance?: 'positive' | 'negative') => {
     sendAudioMessage(audioBlob, selectedTool);
   };
 

src/app/types/chat.types.ts

@@ -6,6 +6,7 @@ export type ChatMessage = {
   content: string;
   audioUrl?: string; // URL for audio messages
   timestamp: Date;
+  tool?: string | null;
 };
 
 export type ChatState = {