From 96759eb34c4859b4e64eee843e3f44c6e094ea74 Mon Sep 17 00:00:00 2001
From: Nezumi-2711 <phanhuuloi15@gmail.com>
Date: Sat, 15 Aug 2026 12:08:10 +0700
Subject: [PATCH] feat: add setup script for models

---
 .gitignore                                    |   2 +
 README.md                                     | 142 +++++------
 ...297c-ae5b-4ac7-8e4d-2422896a7203.omp.cache | Bin 0 -> 2790 bytes
 bun.lock                                      |   8 +
 omp.cache                                     | Bin 0 -> 216 bytes
 package.json                                  |   6 +-
 src/components/ConfigPreview.tsx              | 174 ++++++++++++-
 src/data/mockModels.ts                        |   2 +
 src/data/tools.ts                             |  68 +++--
 src/services/installEndpoint.test.ts          |  91 +++++++
 src/services/installEndpoint.ts               |  76 ++++++
 src/services/installLink.ts                   | 110 ++++++++
 src/services/installScript.ts                 | 236 ++++++++++++++++++
 src/services/modelService.ts                  |  47 +---
 src/types.ts                                  |   7 +
 tsconfig.app.json                             |   2 +-
 tsconfig.json                                 |   3 +-
 vite.config.ts                                |  19 ++
 worker/index.ts                               |  35 +++
 worker/modelProxy.test.ts                     |  91 +++++++
 worker/modelProxy.ts                          | 147 +++++++++++
 worker/tsconfig.json                          |  14 ++
 wrangler.jsonc                                |   5 +-
 23 files changed, 1140 insertions(+), 145 deletions(-)
 create mode 100644 bash.cb00297c-ae5b-4ac7-8e4d-2422896a7203.omp.cache
 create mode 100644 omp.cache
 create mode 100644 src/services/installEndpoint.test.ts
 create mode 100644 src/services/installEndpoint.ts
 create mode 100644 src/services/installLink.ts
 create mode 100644 src/services/installScript.ts
 create mode 100644 worker/index.ts
 create mode 100644 worker/modelProxy.test.ts
 create mode 100644 worker/modelProxy.ts
 create mode 100644 worker/tsconfig.json

diff --git a/.gitignore b/.gitignore
index 2442cd4..ceb4ea0 100644
--- a/.gitignore
+++ b/.gitignore
@@ -14,6 +14,8 @@ dist-ssr
 
 # Cloudflare Workers local dev/deploy state
 .wrangler
+*.tsbuildinfo
+worker/env.d.ts
 
 # Editor directories and files
 .vscode/*
diff --git a/README.md b/README.md
index a00d0dd..36ed67d 100644
--- a/README.md
+++ b/README.md
@@ -1,77 +1,65 @@
-# React + TypeScript + Vite
-
-This template provides a minimal setup to get React working in Vite with HMR and some ESLint rules.
-
-Currently, two official plugins are available:
-
-- [@vitejs/plugin-react](https://github.com/vitejs/vite-plugin-react/blob/main/packages/plugin-react) uses [Oxc](https://oxc.rs)
-- [@vitejs/plugin-react-swc](https://github.com/vitejs/vite-plugin-react/blob/main/packages/plugin-react-swc) uses [SWC](https://swc.rs/)
-
-## React Compiler
-
-The React Compiler is enabled on this template. See [this documentation](https://react.dev/learn/react-compiler) for more information.
-
-Note: This will impact Vite dev & build performances.
-
-## Expanding the ESLint configuration
-
-If you are developing a production application, we recommend updating the configuration to enable type-aware lint rules:
-
-```js
-export default defineConfig([
-  globalIgnores(['dist']),
-  {
-    files: ['**/*.{ts,tsx}'],
-    extends: [
-      // Other configs...
-
-      // Remove tseslint.configs.recommended and replace with this
-      tseslint.configs.recommendedTypeChecked,
-      // Alternatively, use this for stricter rules
-      tseslint.configs.strictTypeChecked,
-      // Optionally, add this for stylistic rules
-      tseslint.configs.stylisticTypeChecked,
-
-      // Other configs...
-    ],
-    languageOptions: {
-      parserOptions: {
-        project: ['./tsconfig.node.json', './tsconfig.app.json'],
-        tsconfigRootDir: import.meta.dirname,
-      },
-      // other options...
-    },
-  },
-])
-
-```
-
-You can also install [eslint-plugin-react-x](https://github.com/Rel1cx/eslint-react/tree/main/packages/plugins/eslint-plugin-react-x) and [eslint-plugin-react-dom](https://github.com/Rel1cx/eslint-react/tree/main/packages/plugins/eslint-plugin-react-dom) for React-specific lint rules:
-
-```js
-// eslint.config.js
-import reactX from 'eslint-plugin-react-x'
-import reactDom from 'eslint-plugin-react-dom'
-
-export default defineConfig([
-  globalIgnores(['dist']),
-  {
-    files: ['**/*.{ts,tsx}'],
-    extends: [
-      // Other configs...
-      // Enable lint rules for React
-      reactX.configs['recommended-typescript'],
-      // Enable lint rules for React DOM
-      reactDom.configs.recommended,
-    ],
-    languageOptions: {
-      parserOptions: {
-        project: ['./tsconfig.node.json', './tsconfig.app.json'],
-        tsconfigRootDir: import.meta.dirname,
-      },
-      // other options...
-    },
-  },
-])
-
-```
+# 9router Config Generator
+
+Generate configuration files and one-command installers for 9router-compatible model gateways.
+
+## Local development
+
+```sh
+bun install
+bun run dev
+```
+
+## Quality checks
+
+```sh
+bun run verify
+```
+
+`verify` runs the production build, all tests, and ESLint. `bun run deploy` runs this validation before publishing the Worker.
+
+## Deploy to Cloudflare Workers
+
+This project deploys a Cloudflare Worker together with the Vite `dist/` assets. It is not a Cloudflare Pages project.
+
+1. Enable **Workers** for the target Cloudflare account and configure its `workers.dev` subdomain.
+2. Authenticate Wrangler locally, or create a least-privilege Cloudflare API token for CI with the **Edit Cloudflare Workers** template, restricted to the deployment account.
+3. Run:
+
+   ```sh
+   bun run deploy
+   ```
+
+4. Open the deployed `https://9router-config-generate.<your-workers-subdomain>.workers.dev` URL and test both `/` and a generated `/i/<token>.sh` install link.
+
+### Optional custom domain
+
+After the first deployment, add a hostname in **Workers & Pages → 9router-config-generate → Settings → Domains & Routes → Add Custom Domain**. The Cloudflare zone must be active and the chosen hostname cannot already have a CNAME record. Cloudflare creates the DNS record and TLS certificate.
+
+Do not protect the app or `/i/*` with Cloudflare Access if users must download install scripts via `curl` or PowerShell without signing in.
+
+## Production model proxy
+
+The browser first requests `<gateway>/models` directly. If that gateway does not allow CORS, the app falls back to `/api/fetch-models` on the Worker.
+
+The Worker proxy is disabled by default and only accepts HTTPS gateway origins explicitly allowlisted through `MODEL_PROXY_ALLOWED_ORIGINS`. This prevents the public endpoint from becoming an open proxy.
+
+Configure it in **Workers & Pages → 9router-config-generate → Settings → Variables and Secrets** as a plaintext variable:
+
+```txt
+MODEL_PROXY_ALLOWED_ORIGINS=https://router.example.com,https://backup-router.example.com
+```
+
+Each value must be an HTTPS origin only: no path, query string, credentials, or wildcard. Deploy again after changing the variable.
+
+> A Cloudflare Worker cannot reach `localhost` on a visitor's computer. For a local 9router gateway, configure that gateway's CORS policy to allow the deployed app origin instead. Use the Worker proxy only for publicly reachable HTTPS gateways.
+
+The proxy forwards the API key supplied by the user for the single `/models` request. It does not store, log, or cache the key. Do not configure a shared 9router API key as a Worker variable or secret.
+
+## Cloudflare resources used
+
+- Cloudflare Workers
+- Workers Static Assets (`ASSETS` binding)
+- Optional custom domain
+- Optional plaintext variable: `MODEL_PROXY_ALLOWED_ORIGINS`
+
+No KV, D1, R2, Queue, Durable Object, or Worker secret is required.
diff --git a/bash.cb00297c-ae5b-4ac7-8e4d-2422896a7203.omp.cache b/bash.cb00297c-ae5b-4ac7-8e4d-2422896a7203.omp.cache
new file mode 100644
index 0000000000000000000000000000000000000000..ad0920a1425027c84cf9bd4d4717b23816712a17
GIT binary patch
literal 2790
zcmb_e-ESL35Z|%SA4%NwLsdb%U?f1L$ab7I4K1ONIBAnMX``HzAeE|GpVz)??ryEU
zb7??8zkn7>`TlN8Ti$r#f8a0Rfxmzk-dgbvS!Vanu~R7$kt$ib+1c6InfcBB#&5_=
z2EYl^@melBy|3wncDq)zxK}zy{W`1jT8+7ki4wO9-fE%61G^Lmt7K8jX2mH#6sxBl
zKV+goEtY@#oik@ZUM7$Od6AG8-%COQ1xP|_iMnkDI|%eu9ghVe^;%%yPPICVUqaU4
zWjvS|3>ij3Lv~i*0IzH@q9~DS>_lEk0t{}{fxJp!7i=?G(_?-ZR8%G)KfqX)sECC5
z<w?j9NFU{Hoe3ox^Jb*WE(T1Tq#je+>@*L;&LU^p%ypNT2psOK-IP`+X<)n-aJL<@
z*m2^NsnnSs<AHg>y;fM^Z9i0nNtx5LOR6+r9Otz_3l&~xN=Po7vyi}@1<peh2zge%
zk1+0zVcY<S&M1eKCu`Zi<<;Y0WK0&Q7<cXq;u;iVjr<Vn)!7DljX(m72^wI1J|fU>
zn$xkNzVvB%9nHJ@`lv1{$Qu~cUioq4Ze6F`RoR75S7!$M>jI{uuy^FO?EsL?`|Pc@
z=j2hDJm!Skx)I_^euD0l8stp^PeNvyixtOjg8U3?X@<1fS)><OO-KC=7D)jH@;mH2
z)8-<arh%>QH#$OYLQvnb@qE}0qMfO6jel;j6@-FOZ^nuc9q1?)7iN`Za)C9}cW{Be
z`RJBuc_4p4AjfS+>k78M`F3Ehulm($g4vF*H`86Qe<o0wRRv=T<<uM#O)d3TY$n9&
zyko7X4b1X96RH6qJIO-T$91ir2_~q}C)P7K#(kwA<azliR<RGO7$>ZXhYAe0qxb^N
z<Zb!6vfH4B0mvNX!lPjT@+-V`(f3qrI)Th25=9uvsqs2;hsrrS$LmhRiPdxbd?fW(
zxZiLcE4J@jL?WTqN^Dkf8THla%$$RriU=!trs;E`EeLr=eu@3Q)1$4^h!9$wi9R~4
z9700I<kuMghDJchV_=O_e#jMYnMzv-WC3+Ss>(y^qD07Z@>@LI?Hp{|&MQw%dDL;$
z4Wur=N2_E9=ycChNKQJMHnIz>#XCo{ofc6yZ%2>=*R&C+`aBJ71>9hTdmhqmCu@b*
zT4F-pT!Y^bBVs(293%=Y)T4Q(JZ#YhcHrJv7&+J&rmS3VSTC`Wq0ym+HC!IG4h$cx
z9VpkRHF5xwe_p=_nFp8eViG<iAAWWXDs~vQg2Sa!Q*(czg#^ZZ>K3SFDKaXZ)K9W7
zJX$W74hfDdCJOi-8cws&WIhu})?jFV6?F01CT<S@4>v_Ti`l_yer$H;<cTAXA+oXR
z)a%tFnCDnYOJgPNIUkoGkM+nuymU4H>S+Gm^8UO+ABrWLd#n^uQE8G}Z9OP9P5z0^
zsxrWZgPc@S#UaE{Fb{SaO)ce*s?Rk3@)jc6(?Z!<ZqYCvC6S40*k~l-`@5?M86W-1
z`pC#G3n!#CSHJv>nhmN8RTJ%zKP8Zzd(X-{gzS^I)quW(MAmKa?p2dcfTMU-dsu^C
z<*hX^5uJ1S2ftj25o$OtJG`}WMTl%tvPV!-S3f>D3@{Y1kkSDoe?|yHt~UXs>2<_m
zPw!5*69{Yy`4)SJB!HwN-rdpdj7TBxDFW+|@_n3GJ>7wNMSGgV=8!F8IW;8&k1&_N
z%lo?#u2lZv#T$7@E8-Z!AA!eL(nP0(o$rp3;{M{Hz2z4Q0;ho*!3GXud&?N6+cl(~
xHe`km70biLAwY5^@XsIeuQB*H@iQU2TKezOSxr&#f5jyJ?=cc2-D?+F{|6XXMV$Zu

literal 0
HcmV?d00001

diff --git a/bun.lock b/bun.lock
index 507bb5d..f92e7e8 100644
--- a/bun.lock
+++ b/bun.lock
@@ -10,10 +10,12 @@
       },
       "devDependencies": {
         "@babel/core": "^7.29.7",
+        "@cloudflare/workers-types": "^5.20260815.1",
         "@eslint/js": "^10.0.1",
         "@rolldown/plugin-babel": "^0.2.3",
         "@tailwindcss/vite": "^4",
         "@types/babel__core": "^7.20.5",
+        "@types/bun": "^1.3.14",
         "@types/node": "^24.13.3",
         "@types/react": "^19.2.17",
         "@types/react-dom": "^19.2.3",
@@ -79,6 +81,8 @@
 
     "@cloudflare/workerd-windows-64": ["@cloudflare/workerd-windows-64@1.20260811.1", "", { "os": "win32", "cpu": "x64" }, "sha512-g6VquwjASlYAibcNW/0E6Zszht4qLkmnXOGwIjjRHl2A0Qz48kVeMcGvyH6eA0G9U3OzZojjYFpP+YeyQmmdjw=="],
 
+    "@cloudflare/workers-types": ["@cloudflare/workers-types@5.20260815.1", "", {}, "sha512-btpW8rEgeJKcxDlBWKxzjLLUHxzUWqXZY8O+DmM6NcSHadUQN5I71z6Q/yAKCTJyGS7adBpXzlsZSFbosLnECQ=="],
+
     "@cspotcode/source-map-support": ["@cspotcode/source-map-support@0.8.1", "", { "dependencies": { "@jridgewell/trace-mapping": "0.3.9" } }, "sha512-IchNf6dN4tHoMFIn/7OE8LWZ19Y6q/67Bmf6vnGREv8RSbBVb9LPJxEcnwrcwX6ixSvaiGoomAUvu4YSxXrVgw=="],
 
     "@emnapi/runtime": ["@emnapi/runtime@1.11.3", "", { "dependencies": { "tslib": "^2.4.0" } }, "sha512-Xz4Tpyki7XyrpbUK1jR1AhdAdaXyhhY4lZ3neLodmhpuWfy2PAQN5B46sAiU4liOXGLkHypn/qU+jvfWSCYYLA=="],
@@ -307,6 +311,8 @@
 
     "@types/babel__traverse": ["@types/babel__traverse@7.28.0", "", { "dependencies": { "@babel/types": "^7.28.2" } }, "sha512-8PvcXf70gTDZBgt9ptxJ8elBeBjcLOAcOtoO/mPJjtji1+CdGbHgm77om1GrsPxsiE+uXIpNSK64UYaIwQXd4Q=="],
 
+    "@types/bun": ["@types/bun@1.3.14", "", { "dependencies": { "bun-types": "1.3.14" } }, "sha512-h1hFqFVcvAvD9j9K7ZW7vd82aSA+rTdznZa+5bwvCwqSB1jmmfLcbIWhOLx1/+boy/xmjgCs/OMUL8hRJSmnPw=="],
+
     "@types/esrecurse": ["@types/esrecurse@4.3.1", "", {}, "sha512-xJBAbDifo5hpffDBuHl0Y8ywswbiAp/Wi7Y/GtAgSlZyIABppyurxVueOPE8LUQOxdlgi6Zqce7uoEpqNTeiUw=="],
 
     "@types/estree": ["@types/estree@1.0.9", "", {}, "sha512-GhdPgy1el4/ImP05X05Uw4cw2/M93BCUmnEvWZNStlCzEKME4Fkk+YpoA5OiHNQmoS7Cafb8Xa3Pya8m1Qrzeg=="],
@@ -359,6 +365,8 @@
 
     "browserslist": ["browserslist@4.28.8", "", { "dependencies": { "baseline-browser-mapping": "^2.11.12", "caniuse-lite": "^1.0.30001809", "electron-to-chromium": "^1.5.402", "node-releases": "^2.0.53", "update-browserslist-db": "^1.3.0" }, "bin": { "browserslist": "cli.js" } }, "sha512-V2NpofLblG64mfOtSgDhOJESZEGogzDMBv/q+W6oc4LXWP/q75eOXoOaaOu1EOadB9U4Bwx/e0yzbvwKH8zalA=="],
 
+    "bun-types": ["bun-types@1.3.14", "", { "dependencies": { "@types/node": "*" } }, "sha512-4N0ig0fEomHt5R0KCFWjovxow98rIoRwKolrYdCcknNwMekCXRnWEUvgu5soYV8QXtVsrUD8B95MBOZGPvr6KQ=="],
+
     "caniuse-lite": ["caniuse-lite@1.0.30001809", "", {}, "sha512-xxWVywk6a6Arlk+hymeycyn/VgqEfLDxupvhH/xiY5SJ/18kmi9o6MiO320DCUzypORHLtvh0I4i04tUhCNHNQ=="],
 
     "convert-source-map": ["convert-source-map@2.0.0", "", {}, "sha512-Kvp459HrV2FEJ1CAsi1Ku+MY3kasH19TFykTz2xWmMeq6bk2NU3XXvfJ+Q61m0xktWwt+1HSYf3JZsTms3aRJg=="],
diff --git a/omp.cache b/omp.cache
new file mode 100644
index 0000000000000000000000000000000000000000..9700e13a6d44f906b6fde9a97e83f7429eb87e7d
GIT binary patch
literal 216
zcmX|&ONzok6h+@lVo-44pcmlSMzab>iW5UmRHUkWCMER=^--j0x^<0i!CeUHj2ztq
z=iF_3%Mcf9sT)O`NhL!a`Ak?{oR~S#!E#QD$Q8Dp>g%+zzAn5Ig<ztl+1vzo-AEJ2
z9hso<_s?#J?HzE4?H|DBZ;D9=m}2jXsYo~i9F$U%4@@_hb*3zr-2$w-Tart^zj%ci
rw^k(y0KOjW^Mwc>WX{rAqsfGQqgXgvr!n`zNmC8`kVhU(i0}R%i84qV

literal 0
HcmV?d00001

diff --git a/package.json b/package.json
index 6b124c6..901cca7 100644
--- a/package.json
+++ b/package.json
@@ -6,9 +6,11 @@
   "scripts": {
     "dev": "vite",
     "build": "tsc -b && vite build",
+    "test": "bun test",
     "lint": "eslint .",
     "preview": "vite preview",
-    "deploy": "vite build && wrangler deploy",
+    "verify": "bun run build && bun run test && bun run lint",
+    "deploy": "bun run verify && wrangler deploy",
     "preview:cf": "vite build && wrangler dev"
   },
   "dependencies": {
@@ -17,10 +19,12 @@
   },
   "devDependencies": {
     "@babel/core": "^7.29.7",
+    "@cloudflare/workers-types": "^5.20260815.1",
     "@eslint/js": "^10.0.1",
     "@rolldown/plugin-babel": "^0.2.3",
     "@tailwindcss/vite": "^4",
     "@types/babel__core": "^7.20.5",
+    "@types/bun": "^1.3.14",
     "@types/node": "^24.13.3",
     "@types/react": "^19.2.17",
     "@types/react-dom": "^19.2.3",
diff --git a/src/components/ConfigPreview.tsx b/src/components/ConfigPreview.tsx
index 60d68f4..1ca4499 100644
--- a/src/components/ConfigPreview.tsx
+++ b/src/components/ConfigPreview.tsx
@@ -4,7 +4,9 @@ import { Card } from './ui/Card'
 import { Button } from './ui/Button'
 import { Badge } from './ui/Badge'
 import { CodeBlock } from './ui/CodeBlock'
-import { Download, Copy, Check, FileCode, Info } from 'lucide-react'
+import { buildInstallScript, type ScriptOS } from '../services/installScript'
+import { buildOneClickCommand } from '../services/installLink'
+import { Download, Copy, Check, FileCode, Info, Terminal, Key, Sparkles, ShieldAlert } from 'lucide-react'
 
 interface ConfigPreviewProps {
   tool: ToolMeta
@@ -17,21 +19,39 @@ export const ConfigPreview: React.FC<ConfigPreviewProps> = ({
   connection,
   selectedModels,
 }) => {
-  const [copied, setCopied] = useState(false)
+  const [copiedConfig, setCopiedConfig] = useState(false)
+  const [copiedCommand, setCopiedCommand] = useState(false)
+  const [selectedOS, setSelectedOS] = useState<ScriptOS>('unix')
+
+  const origin = typeof window !== 'undefined' ? window.location.origin : 'http://localhost:5173'
+  const oneClickCommand = buildOneClickCommand(tool, connection, selectedModels, selectedOS, origin)
 
   const configContent = tool.sampleTemplate(connection, selectedModels)
+  const installScript = buildInstallScript(tool, connection, selectedModels, selectedOS, {
+    keySource: 'runtime-env',
+  })
 
-  const handleCopy = async () => {
+  const handleCopyConfig = async () => {
     try {
       await navigator.clipboard.writeText(configContent)
-      setCopied(true)
-      setTimeout(() => setCopied(false), 2000)
+      setCopiedConfig(true)
+      setTimeout(() => setCopiedConfig(false), 2000)
     } catch {
       // ignore
     }
   }
 
-  const handleDownload = () => {
+  const handleCopyCommand = async (cmd: string) => {
+    try {
+      await navigator.clipboard.writeText(cmd)
+      setCopiedCommand(true)
+      setTimeout(() => setCopiedCommand(false), 2000)
+    } catch {
+      // ignore
+    }
+  }
+
+  const handleDownloadConfig = () => {
     const blob = new Blob([configContent], { type: 'text/plain;charset=utf-8' })
     const url = URL.createObjectURL(blob)
     const link = document.createElement('a')
@@ -43,8 +63,138 @@ export const ConfigPreview: React.FC<ConfigPreviewProps> = ({
     URL.revokeObjectURL(url)
   }
 
+  const handleDownloadScript = () => {
+    if (!installScript) return
+    const blob = new Blob([installScript.content], { type: 'text/plain;charset=utf-8' })
+    const url = URL.createObjectURL(blob)
+    const link = document.createElement('a')
+    link.href = url
+    link.download = installScript.filename
+    document.body.appendChild(link)
+    link.click()
+    document.body.removeChild(link)
+    URL.revokeObjectURL(url)
+  }
+
   return (
     <div className="lg:sticky lg:top-20 flex flex-col gap-4 min-w-0 w-full">
+      {/* 1. Install Script Section (if supported by tool) */}
+      {installScript && (
+        <Card className="flex flex-col gap-3.5 shadow-md border-amber-500/20 bg-amber-500/5 dark:bg-amber-500/5 min-w-0">
+          <div className="flex flex-wrap items-center justify-between gap-2.5 border-b border-zinc-200 dark:border-[#22232c] pb-3">
+            <div className="flex items-center gap-2.5 min-w-0">
+              <div className="w-7 h-7 shrink-0 rounded-md bg-amber-500/15 text-amber-600 dark:text-amber-400 flex items-center justify-center">
+                <Terminal className="w-4 h-4" />
+              </div>
+              <div className="min-w-0">
+                <div className="flex items-center gap-2 flex-wrap">
+                  <span className="font-mono text-xs sm:text-sm font-bold text-zinc-900 dark:text-zinc-100">
+                    1-Command Auto Install
+                  </span>
+                  <Badge variant="brand" size="sm">
+                    <Sparkles className="w-3 h-3 mr-1" />
+                    Automated
+                  </Badge>
+                </div>
+                <span className="text-xs text-zinc-500 dark:text-zinc-400 block text-left truncate">
+                  Copy &amp; run — script downloads &amp; writes config
+                </span>
+              </div>
+            </div>
+
+            {/* OS selector tabs */}
+            <div className="flex items-center bg-zinc-200/70 dark:bg-zinc-800/80 p-0.5 rounded-lg text-xs">
+              <button
+                type="button"
+                onClick={() => setSelectedOS('unix')}
+                className={`px-2.5 py-1 rounded-md font-medium transition-all ${
+                  selectedOS === 'unix'
+                    ? 'bg-white dark:bg-zinc-900 text-zinc-900 dark:text-zinc-100 shadow-sm'
+                    : 'text-zinc-600 dark:text-zinc-400 hover:text-zinc-900 dark:hover:text-zinc-200'
+                }`}
+              >
+                macOS / Linux (.sh)
+              </button>
+              <button
+                type="button"
+                onClick={() => setSelectedOS('windows')}
+                className={`px-2.5 py-1 rounded-md font-medium transition-all ${
+                  selectedOS === 'windows'
+                    ? 'bg-white dark:bg-zinc-900 text-zinc-900 dark:text-zinc-100 shadow-sm'
+                    : 'text-zinc-600 dark:text-zinc-400 hover:text-zinc-900 dark:hover:text-zinc-200'
+                }`}
+              >
+                Windows (.ps1)
+              </button>
+            </div>
+          </div>
+
+          {/* Run Command snippet */}
+          <div className="flex flex-col gap-1.5 text-left">
+            <span className="text-xs font-semibold text-zinc-700 dark:text-zinc-300">
+              Run this command in your terminal:
+            </span>
+            <div className="flex items-center justify-between gap-2 p-2.5 rounded-lg bg-zinc-900 text-zinc-200 font-mono text-xs overflow-x-auto border border-zinc-800">
+              <span className="break-all selection:bg-amber-500/30">
+                {oneClickCommand}
+              </span>
+              <button
+                type="button"
+                onClick={() => handleCopyCommand(oneClickCommand)}
+                className="shrink-0 p-1.5 rounded hover:bg-zinc-800 text-zinc-400 hover:text-zinc-200 transition-colors"
+                title="Copy command"
+              >
+                {copiedCommand ? (
+                  <Check className="w-4 h-4 text-emerald-400" />
+                ) : (
+                  <Copy className="w-4 h-4" />
+                )}
+              </button>
+            </div>
+          </div>
+
+          {/* Security / Notice */}
+          <div className="flex items-start gap-2 p-2 rounded-md bg-amber-500/10 border border-amber-500/20 text-[11px] text-zinc-600 dark:text-zinc-400 text-left">
+            <ShieldAlert className="w-3.5 h-3.5 text-amber-500 shrink-0 mt-0.5" />
+            <span>
+              The URL and command contain no API key. The installer prompts locally for it, then writes it directly into VS Code configuration.
+            </span>
+          </div>
+
+          <div className="flex items-center justify-between pt-0.5">
+            <span className="text-xs text-zinc-500 dark:text-zinc-400">
+              Need offline installer?
+            </span>
+            <Button
+              variant="outline"
+              size="sm"
+              onClick={handleDownloadScript}
+              icon={<Download className="w-3.5 h-3.5" />}
+            >
+              Download Script ({installScript.filename})
+            </Button>
+          </div>
+        </Card>
+      )}
+
+      {/* 2. API Key Helper Note for GitHub Copilot (when no key in form) */}
+      {tool.id === 'copilot' && !connection.apiKey && (
+        <div className="flex flex-col gap-2 p-3 rounded-lg bg-amber-500/10 border border-amber-500/20 text-xs text-left">
+          <div className="flex items-center gap-2 font-semibold text-amber-800 dark:text-amber-300">
+            <Key className="w-4 h-4 text-amber-600 dark:text-amber-400 shrink-0" />
+            <span>Secure API Key Storage in VS Code</span>
+          </div>
+          <p className="text-zinc-600 dark:text-zinc-300 leading-relaxed">
+            No API key entered above. The generated config uses{' '}
+            <code className="px-1 py-0.5 rounded bg-amber-500/15 font-mono text-[11px] text-amber-700 dark:text-amber-300">
+              ${'{input:9router-api-key}'}
+            </code>
+            . When VS Code prompts you for <strong className="font-semibold text-zinc-900 dark:text-zinc-100">9router-api-key</strong>, paste your key.
+          </p>
+        </div>
+      )}
+
+      {/* 3. Raw Config Preview */}
       <Card className="flex flex-col gap-3.5 shadow-md min-w-0">
         <div className="flex flex-wrap items-center justify-between gap-2.5 border-b border-zinc-200 dark:border-[#22232c] pb-3">
           <div className="flex items-center gap-2.5 min-w-0">
@@ -61,7 +211,7 @@ export const ConfigPreview: React.FC<ConfigPreviewProps> = ({
                 </Badge>
               </div>
               <span className="text-xs text-zinc-500 dark:text-zinc-400 block text-left truncate">
-                Target for {tool.name}
+                Manual config for {tool.name}
               </span>
             </div>
           </div>
@@ -70,15 +220,15 @@ export const ConfigPreview: React.FC<ConfigPreviewProps> = ({
             <Button
               variant="outline"
               size="sm"
-              onClick={handleCopy}
-              icon={copied ? <Check className="w-3.5 h-3.5 text-emerald-500" /> : <Copy className="w-3.5 h-3.5" />}
+              onClick={handleCopyConfig}
+              icon={copiedConfig ? <Check className="w-3.5 h-3.5 text-emerald-500" /> : <Copy className="w-3.5 h-3.5" />}
             >
-              {copied ? 'Copied' : 'Copy'}
+              {copiedConfig ? 'Copied' : 'Copy'}
             </Button>
             <Button
               variant="primary"
               size="sm"
-              onClick={handleDownload}
+              onClick={handleDownloadConfig}
               icon={<Download className="w-3.5 h-3.5" />}
             >
               Download
@@ -99,7 +249,7 @@ export const ConfigPreview: React.FC<ConfigPreviewProps> = ({
         <CodeBlock
           code={configContent}
           language={tool.language}
-          className="max-h-[500px]"
+          className="max-h-96"
         />
 
         <div className="flex items-center justify-between text-xs text-zinc-500 dark:text-zinc-400 pt-1">
diff --git a/src/data/mockModels.ts b/src/data/mockModels.ts
index b7997db..167e094 100644
--- a/src/data/mockModels.ts
+++ b/src/data/mockModels.ts
@@ -49,6 +49,7 @@ export const mockModels: Model[] = [
     contextWindow: 200000,
     vision: false,
     toolCalling: true,
+    reasoning: true,
     description: 'Deep mathematical and algorithmic reasoning specialist',
   },
   {
@@ -69,6 +70,7 @@ export const mockModels: Model[] = [
     contextWindow: 64000,
     vision: false,
     toolCalling: true,
+    reasoning: true,
     description: 'Open-weights reasoning model with high performance on coding tasks',
   },
 ]
diff --git a/src/data/tools.ts b/src/data/tools.ts
index 0ade750..4452de0 100644
--- a/src/data/tools.ts
+++ b/src/data/tools.ts
@@ -1,42 +1,74 @@
-import type { ToolId, ToolMeta, ConnectionConfig, Model } from '../types'
+import type { ToolId, ToolMeta, ConnectionConfig, Model } from '../types.ts'
 
 export const tools: Record<ToolId, ToolMeta> = {
   copilot: {
     id: 'copilot',
     name: 'GitHub Copilot',
-    tagline: 'VS Code chatLanguageModels.json configuration',
+    tagline: 'VS Code chatLanguageModels.json customendpoint configuration',
     targetFilename: 'chatLanguageModels.json',
-    locationDescription: 'VS Code User settings or global profile directory',
+    locationDescription: 'VS Code Command Palette → "Chat: Manage Language Models" → Add Models → Custom Endpoint',
     language: 'json',
     iconName: 'bot',
+    installTargets: {
+      unixPath: '$HOME/.config/Code/User/chatLanguageModels.json',
+      windowsPath: '$env:APPDATA\\Code\\User\\chatLanguageModels.json',
+    },
     sampleTemplate: (connection: ConnectionConfig, selectedModels: Model[]) => {
       const activeModels = selectedModels.length > 0 ? selectedModels : [
         {
           id: 'cc/claude-sonnet-4.5',
           name: 'Claude Sonnet 4.5',
           family: 'claude-sonnet-4-5',
+          provider: 'Anthropic',
           contextWindow: 200000,
           vision: true,
           toolCalling: true,
         }
       ]
 
-      const entries = activeModels.map((m) => ({
-        id: `9router-${m.id.replace(/[^a-zA-Z0-9_-]/g, '-')}`,
-        name: `${m.name || m.id} (9router)`,
-        vendor: 'customoai',
-        family: m.family || m.id.split('/').pop() || 'custom',
-        version: '1.0.0',
-        maxInputTokens: m.contextWindow || 128000,
-        maxOutputTokens: 8192,
-        endpoint: connection.baseUrl.replace(/\/+$/, '') + '/chat/completions',
-        apiKey: connection.apiKey ? connection.apiKey : '${input:9router-api-key}',
-        model: m.id,
-        toolCalling: m.toolCalling ?? true,
-        vision: m.vision ?? true,
-      }))
+      // Group models by provider
+      const groupsMap = new Map<string, Model[]>()
+      for (const m of activeModels) {
+        const provider = m.provider || (m.id.includes('/') ? m.id.split('/')[0] : '9router')
+        if (!groupsMap.has(provider)) {
+          groupsMap.set(provider, [])
+        }
+        groupsMap.get(provider)!.push(m)
+      }
 
-      return JSON.stringify(entries, null, 2)
+      const endpointUrl = connection.baseUrl.replace(/\/+$/, '') + '/chat/completions'
+      const apiKeyVal = connection.apiKey ? connection.apiKey : '${input:9router-api-key}'
+
+      const groups = Array.from(groupsMap.entries()).map(([provider, models]) => {
+        return {
+          name: `9router · ${provider}`,
+          vendor: 'customendpoint',
+          apiKey: apiKeyVal,
+          apiType: 'chat-completions',
+          models: models.map((m) => {
+            const modelObj: Record<string, unknown> = {
+              id: m.id,
+              name: m.name || m.id,
+              url: endpointUrl,
+              toolCalling: m.toolCalling ?? true,
+              vision: m.vision ?? true,
+              maxInputTokens: m.contextWindow || 128000,
+              // Guidance: maxInputTokens + maxOutputTokens <= context window
+              maxOutputTokens: 16384,
+            }
+
+            if (m.reasoning) {
+              modelObj.thinking = true
+              modelObj.supportsReasoningEffort = ['low', 'medium', 'high']
+              modelObj.reasoningEffortFormat = 'chat-completions'
+            }
+
+            return modelObj
+          }),
+        }
+      })
+
+      return JSON.stringify(groups, null, 2)
     },
   },
   'claude-code': {
diff --git a/src/services/installEndpoint.test.ts b/src/services/installEndpoint.test.ts
new file mode 100644
index 0000000..8d281b4
--- /dev/null
+++ b/src/services/installEndpoint.test.ts
@@ -0,0 +1,91 @@
+import { describe, it, expect } from 'bun:test'
+import { encodeInstallToken, decodeInstallToken, buildOneClickCommand } from './installLink'
+import { renderInstallScript } from './installEndpoint'
+import { tools } from '../data/tools'
+
+describe('Install Link & Endpoint', () => {
+  it('encodes and decodes install token correctly', () => {
+    const payload = {
+      v: 1 as const,
+      t: 'copilot' as const,
+      b: 'http://localhost:20128/v1',
+      m: [
+        { id: 'cc/claude-sonnet-4.5', name: 'Claude Sonnet 4.5' },
+        { id: 'gemini/gemini-2.5-pro', name: 'Gemini 2.5 Pro' },
+      ],
+    }
+
+    const token = encodeInstallToken(payload)
+    expect(typeof token).toBe('string')
+    expect(token.length).toBeGreaterThan(10)
+
+    const decoded = decodeInstallToken(token)
+    expect(decoded).toEqual(payload)
+  })
+
+  it('builds one-click commands without exposing an API key', () => {
+    const cmdUnix = buildOneClickCommand(
+      tools.copilot,
+      { baseUrl: 'http://localhost:20128/v1', apiKey: 'sk-test-key-123' },
+      [{ id: 'cc/claude-sonnet-4.5', name: 'Claude Sonnet 4.5' }],
+      'unix',
+      'https://9router.example.com'
+    )
+
+    expect(cmdUnix).toContain('curl -fsSL "https://9router.example.com/i/')
+    expect(cmdUnix).toContain('.sh" | bash')
+    expect(cmdUnix).not.toContain('sk-test-key-123')
+
+    const cmdWin = buildOneClickCommand(
+      tools.copilot,
+      { baseUrl: 'http://localhost:20128/v1', apiKey: 'sk-test-key-123' },
+      [{ id: 'cc/claude-sonnet-4.5', name: 'Claude Sonnet 4.5' }],
+      'windows',
+      'https://9router.example.com'
+    )
+
+    expect(cmdWin).toContain('irm "https://9router.example.com/i/')
+    expect(cmdWin).toContain('.ps1" | iex')
+    expect(cmdWin).not.toContain('sk-test-key-123')
+  })
+
+  it('renders install script endpoint output', () => {
+    const token = encodeInstallToken({
+      v: 1,
+      t: 'copilot',
+      b: 'http://localhost:20128/v1',
+      m: [{ id: 'cc/claude-sonnet-4.5', name: 'Claude Sonnet 4.5' }],
+    })
+
+    const shRes = renderInstallScript(token, 'sh')
+    expect(shRes.status).toBe(200)
+    expect(shRes.contentType).toContain('text/x-shellscript')
+    expect(shRes.body).toContain('__NINEROUTER_API_KEY__')
+    expect(shRes.body).toContain('NINEROUTER_API_KEY')
+
+    const ps1Res = renderInstallScript(token, 'ps1')
+    expect(ps1Res.status).toBe(200)
+    expect(ps1Res.contentType).toContain('text/plain')
+    expect(ps1Res.body).toContain('__NINEROUTER_API_KEY__')
+  })
+
+  it('replaces every API key placeholder in generated runtime scripts', () => {
+    const token = encodeInstallToken({
+      v: 1,
+      t: 'copilot',
+      b: 'http://localhost:20128/v1',
+      m: [{ id: 'cc/claude-sonnet-4.5', name: 'Claude Sonnet 4.5' }],
+    })
+
+    const res = renderInstallScript(token, 'sh')
+    expect(res.status).toBe(200)
+    expect(res.body).toContain('replace_api_key_placeholder')
+    expect(res.body).toContain('while [[ "$CONFIG" == *"$API_KEY_PLACEHOLDER"* ]]')
+  })
+
+  it('handles invalid token gracefully', () => {
+    const res = renderInstallScript('invalid-token', 'sh')
+    expect(res.status).toBe(400)
+    expect(res.body).toContain('# Invalid install link')
+  })
+})
diff --git a/src/services/installEndpoint.ts b/src/services/installEndpoint.ts
new file mode 100644
index 0000000..c9ee8b8
--- /dev/null
+++ b/src/services/installEndpoint.ts
@@ -0,0 +1,76 @@
+import { tools } from '../data/tools.ts'
+import type { ConnectionConfig, Model } from '../types.ts'
+import { decodeInstallToken, type MinimalModel } from './installLink.ts'
+import { buildInstallScript } from './installScript.ts'
+
+export interface RenderInstallScriptResult {
+  status: number
+  contentType: string
+  body: string
+}
+
+export function renderInstallScript(
+  token: string,
+  ext: 'sh' | 'ps1'
+): RenderInstallScriptResult {
+  const isUnix = ext === 'sh'
+  const contentType = isUnix
+    ? 'text/x-shellscript; charset=utf-8'
+    : 'text/plain; charset=utf-8'
+
+  const payload = decodeInstallToken(token)
+  if (!payload) {
+    return {
+      status: 400,
+      contentType,
+      body: '# Invalid install link\n',
+    }
+  }
+
+  const tool = tools[payload.t]
+  if (!tool || !tool.installTargets) {
+    return {
+      status: 400,
+      contentType,
+      body: '# Tool not found or install script not supported\n',
+    }
+  }
+
+  const connection: ConnectionConfig = {
+    baseUrl: payload.b,
+    apiKey: '__NINEROUTER_API_KEY__',
+  }
+
+  const models: Model[] = (payload.m || []).map((m: MinimalModel) => ({
+    id: m.id,
+    name: m.name || m.id,
+    provider: m.provider,
+    contextWindow: m.contextWindow,
+    vision: m.vision,
+    toolCalling: m.toolCalling,
+    reasoning: m.reasoning,
+    family: m.family,
+  }))
+
+  const script = buildInstallScript(
+    tool,
+    connection,
+    models,
+    isUnix ? 'unix' : 'windows',
+    { keySource: 'runtime-env' }
+  )
+
+  if (!script) {
+    return {
+      status: 500,
+      contentType,
+      body: '# Failed to generate install script\n',
+    }
+  }
+
+  return {
+    status: 200,
+    contentType,
+    body: script.content,
+  }
+}
diff --git a/src/services/installLink.ts b/src/services/installLink.ts
new file mode 100644
index 0000000..757256b
--- /dev/null
+++ b/src/services/installLink.ts
@@ -0,0 +1,110 @@
+import type { ToolId, ToolMeta, ConnectionConfig, Model } from '../types.ts'
+import { type ScriptOS } from './installScript.ts'
+
+export interface MinimalModel {
+  id: string
+  name?: string
+  provider?: string
+  contextWindow?: number
+  vision?: boolean
+  toolCalling?: boolean
+  reasoning?: boolean
+  family?: string
+}
+
+export interface InstallTokenPayload {
+  v: 1
+  t: ToolId
+  b: string
+  m: MinimalModel[]
+}
+
+/**
+ * Base64URL encode a string (UTF-8 safe)
+ */
+function bytesToBase64Url(bytes: Uint8Array): string {
+  let binary = ''
+  const len = bytes.byteLength
+  for (let i = 0; i < len; i++) {
+    binary += String.fromCharCode(bytes[i])
+  }
+  return btoa(binary)
+    .replace(/\+/g, '-')
+    .replace(/\//g, '_')
+    .replace(/=+$/, '')
+}
+
+/**
+ * Base64URL decode a string to Uint8Array (UTF-8 safe)
+ */
+function base64UrlToBytes(base64url: string): Uint8Array {
+  let base64 = base64url.replace(/-/g, '+').replace(/_/g, '/')
+  while (base64.length % 4) {
+    base64 += '='
+  }
+  const binary = atob(base64)
+  const bytes = new Uint8Array(binary.length)
+  for (let i = 0; i < binary.length; i++) {
+    bytes[i] = binary.charCodeAt(i)
+  }
+  return bytes
+}
+
+export function encodeInstallToken(payload: InstallTokenPayload): string {
+  const jsonStr = JSON.stringify(payload)
+  const encoder = new TextEncoder()
+  const bytes = encoder.encode(jsonStr)
+  return bytesToBase64Url(bytes)
+}
+
+export function decodeInstallToken(token: string): InstallTokenPayload | null {
+  try {
+    const bytes = base64UrlToBytes(token)
+    const decoder = new TextDecoder()
+    const jsonStr = decoder.decode(bytes)
+    const payload = JSON.parse(jsonStr) as InstallTokenPayload
+    if (payload && payload.v === 1 && payload.t && payload.b) {
+      return payload
+    }
+    return null
+  } catch {
+    return null
+  }
+}
+
+export function buildOneClickCommand(
+  tool: ToolMeta,
+  connection: ConnectionConfig,
+  models: Model[],
+  os: ScriptOS,
+  origin: string
+): string {
+  const minimalModels: MinimalModel[] = models.map((m) => ({
+    id: m.id,
+    ...(m.name ? { name: m.name } : {}),
+    ...(m.provider ? { provider: m.provider } : {}),
+    ...(m.contextWindow ? { contextWindow: m.contextWindow } : {}),
+    ...(m.vision !== undefined ? { vision: m.vision } : {}),
+    ...(m.toolCalling !== undefined ? { toolCalling: m.toolCalling } : {}),
+    ...(m.reasoning !== undefined ? { reasoning: m.reasoning } : {}),
+    ...(m.family ? { family: m.family } : {}),
+  }))
+
+  const token = encodeInstallToken({
+    v: 1,
+    t: tool.id,
+    b: connection.baseUrl,
+    m: minimalModels,
+  })
+
+  const baseUrl = origin.replace(/\/+$/, '')
+
+  if (os === 'unix') {
+    const scriptUrl = `${baseUrl}/i/${token}.sh`
+    return `curl -fsSL "${scriptUrl}" | bash`
+  }
+
+  // Windows PowerShell
+  const scriptUrl = `${baseUrl}/i/${token}.ps1`
+  return `irm "${scriptUrl}" | iex`
+}
diff --git a/src/services/installScript.ts b/src/services/installScript.ts
new file mode 100644
index 0000000..5abba24
--- /dev/null
+++ b/src/services/installScript.ts
@@ -0,0 +1,236 @@
+import type { ToolMeta, ConnectionConfig, Model } from '../types.ts'
+
+export type ScriptOS = 'unix' | 'windows'
+
+export interface BuildInstallScriptOptions {
+  keySource?: 'embedded' | 'runtime-env'
+}
+
+export interface GeneratedScript {
+  filename: string
+  language: 'bash' | 'powershell'
+  content: string
+  runCommand: string
+}
+
+export function buildInstallScript(
+  tool: ToolMeta,
+  connection: ConnectionConfig,
+  selectedModels: Model[],
+  os: ScriptOS,
+  options?: BuildInstallScriptOptions
+): GeneratedScript | null {
+  if (!tool.installTargets) {
+    return null
+  }
+
+  const keySource = options?.keySource || 'embedded'
+  const effectiveConnection: ConnectionConfig =
+    keySource === 'runtime-env'
+      ? { ...connection, apiKey: '__NINEROUTER_API_KEY__' }
+      : connection
+
+  const configContent = tool.sampleTemplate(effectiveConnection, selectedModels)
+  const apiKeyHint = connection.apiKey || 'YOUR_API_KEY'
+
+  if (os === 'unix') {
+    const filename = `install-9router-${tool.id}.sh`
+    const { writeConfigSection, postInstallNotes } =
+      keySource === 'runtime-env'
+        ? {
+            writeConfigSection: `API_KEY="\${NINEROUTER_API_KEY:-}"
+if [[ -z "$API_KEY" ]]; then
+  read -rsp "Enter your 9router API key: " API_KEY
+  echo
+fi
+
+CONFIG=$(cat <<'EOF'
+${configContent}
+EOF
+)
+
+API_KEY_PLACEHOLDER='__NINEROUTER_API_KEY__'
+json_escape() {
+  local string="$1"
+  local output=""
+  local char
+  local i
+
+  for ((i = 0; i < \${#string}; i++)); do
+    char="\${string:i:1}"
+    case "$char" in
+      '"') output+='\\"' ;;
+      '\\') output+='\\\\' ;;
+      $'\b') output+='\\b' ;;
+      $'\f') output+='\\f' ;;
+      $'\n') output+='\\n' ;;
+      $'\r') output+='\\r' ;;
+      $'\t') output+='\\t' ;;
+      *) output+="$char" ;;
+    esac
+  done
+
+  printf '%s' "$output"
+}
+
+replace_api_key_placeholder() {
+  local replacement="$1"
+  local prefix
+  local suffix
+
+  while [[ "$CONFIG" == *"$API_KEY_PLACEHOLDER"* ]]; do
+    prefix="\${CONFIG%%"$API_KEY_PLACEHOLDER"*}"
+    suffix="\${CONFIG#*"$API_KEY_PLACEHOLDER"}"
+    CONFIG="\${prefix}\${replacement}\${suffix}"
+  done
+}
+
+if [[ -n "$API_KEY" ]]; then
+  replace_api_key_placeholder "$(json_escape "$API_KEY")"
+else
+  replace_api_key_placeholder '\${input:9router-api-key}'
+fi
+
+printf '%s\\n' "$CONFIG" > "$TARGET_FILE"`
+            ,
+            postInstallNotes: `echo ""
+echo "✅ Configuration successfully written to $TARGET_FILE"
+echo ""
+echo "👉 Next step in VS Code:"
+echo "   1. Reload VS Code (Ctrl+Shift+P or Cmd+Shift+P → Developer: Reload Window)."
+echo "   2. Open GitHub Copilot Chat and start coding!"`
+          }
+        : {
+            writeConfigSection: `cat <<'EOF' > "$TARGET_FILE"
+${configContent}
+EOF`,
+            postInstallNotes: `echo ""
+echo "✅ Configuration successfully written to $TARGET_FILE"
+echo ""
+echo "👉 Next step in VS Code:"
+echo "   1. Reload VS Code or open GitHub Copilot Chat."
+echo "   2. When prompted for '9router-api-key', paste your key:"
+echo "      ${apiKeyHint}"`
+          }
+
+    const content = `#!/usr/bin/env bash
+# 9router Install Script for ${tool.name}
+# Automatically generates and installs ${tool.targetFilename}
+
+set -euo pipefail
+
+# Determine configuration directory based on OS (macOS vs Linux)
+if [[ "$(uname)" == "Darwin" ]]; then
+  TARGET_DIR="$HOME/Library/Application Support/Code/User"
+else
+  TARGET_DIR="\${XDG_CONFIG_HOME:-$HOME/.config}/Code/User"
+fi
+
+TARGET_FILE="$TARGET_DIR/${tool.targetFilename}"
+
+echo "🔧 Installing 9router config for ${tool.name}..."
+echo "📍 Target: $TARGET_FILE"
+
+# Create destination folder if not present
+mkdir -p "$TARGET_DIR"
+
+# Backup existing configuration if present
+if [[ -f "$TARGET_FILE" ]]; then
+  BACKUP_FILE="$TARGET_FILE.backup.$(date +%Y%m%d%H%M%S)"
+  echo "⚠️  Existing configuration found. Backing up to:"
+  echo "   $BACKUP_FILE"
+  cp "$TARGET_FILE" "$BACKUP_FILE"
+fi
+
+# Write configuration
+${writeConfigSection}
+${postInstallNotes}
+`
+    return {
+      filename,
+      language: 'bash',
+      content,
+      runCommand: `bash ${filename}`,
+    }
+  }
+
+  // Windows PowerShell
+  const filename = `install-9router-${tool.id}.ps1`
+  const { psWriteConfigSection, psPostInstallNotes } =
+    keySource === 'runtime-env'
+      ? {
+          psWriteConfigSection: `$apiKey = $env:NINEROUTER_API_KEY
+if (-not $apiKey) {
+    $secureApiKey = Read-Host "Enter your 9router API key" -AsSecureString
+    $apiKey = [System.Net.NetworkCredential]::new('', $secureApiKey).Password
+}
+
+$config = @'
+${configContent}
+'@
+
+if ($apiKey) {
+  $jsonApiKey = ConvertTo-Json -InputObject $apiKey -Compress
+  $config = $config.Replace('"__NINEROUTER_API_KEY__"', $jsonApiKey)
+} else {
+  $config = $config.Replace('"__NINEROUTER_API_KEY__"', '"\${input:9router-api-key}"')
+}
+
+Set-Content -Path $targetFile -Value $config -Encoding UTF8`,
+          psPostInstallNotes: `Write-Host ""
+Write-Host "✅ Configuration successfully written to $targetFile" -ForegroundColor Green
+Write-Host ""
+Write-Host "👉 Next step in VS Code:" -ForegroundColor Cyan
+Write-Host "   1. Reload VS Code (Ctrl+Shift+P -> Developer: Reload Window)."
+Write-Host "   2. Open GitHub Copilot Chat and start coding!" -ForegroundColor Green`
+        }
+      : {
+          psWriteConfigSection: `@'
+${configContent}
+'@ | Set-Content -Path $targetFile -Encoding UTF8`,
+          psPostInstallNotes: `Write-Host ""
+Write-Host "✅ Configuration successfully written to $targetFile" -ForegroundColor Green
+Write-Host ""
+Write-Host "👉 Next step in VS Code:" -ForegroundColor Cyan
+Write-Host "   1. Reload VS Code or open GitHub Copilot Chat."
+Write-Host "   2. When prompted for '9router-api-key', paste your key:"
+Write-Host "      ${apiKeyHint}" -ForegroundColor Yellow`
+        }
+
+  const content = `# 9router Install Script for ${tool.name}
+# Automatically generates and installs ${tool.targetFilename}
+
+$ErrorActionPreference = "Stop"
+
+$targetDir = Join-Path $env:APPDATA "Code\\User"
+$targetFile = Join-Path $targetDir "${tool.targetFilename}"
+
+Write-Host "🔧 Installing 9router config for ${tool.name}..." -ForegroundColor Cyan
+Write-Host "📍 Target: $targetFile"
+
+# Ensure directory exists
+if (-not (Test-Path $targetDir)) {
+    New-Item -ItemType Directory -Path $targetDir -Force | Out-Null
+}
+
+# Backup existing file if present
+if (Test-Path $targetFile) {
+    $timestamp = Get-Date -Format "yyyyMMddHHmmss"
+    $backupFile = "$targetFile.backup.$timestamp"
+    Write-Host "⚠️  Existing configuration found. Backing up to:" -ForegroundColor Yellow
+    Write-Host "   $backupFile"
+    Copy-Item $targetFile $backupFile
+}
+
+# Write configuration file with UTF8 encoding
+${psWriteConfigSection}
+${psPostInstallNotes}
+`
+
+  return {
+    filename,
+    language: 'powershell',
+    content,
+    runCommand: `powershell -ExecutionPolicy Bypass -File .\\${filename}`,
+  }
+}
diff --git a/src/services/modelService.ts b/src/services/modelService.ts
index 1b3fc2c..10f5960 100644
--- a/src/services/modelService.ts
+++ b/src/services/modelService.ts
@@ -59,22 +59,22 @@ function formatModelName(id: string, rawName?: string): string {
 
 export async function fetchRemoteModels(connection: ConnectionConfig): Promise<Model[]> {
   const trimmedBase = connection.baseUrl.replace(/\/+$/, '')
-  const isHttpsOrCustom = trimmedBase.startsWith('http://') || trimmedBase.startsWith('https://')
+  const isHttpUrl = trimmedBase.startsWith('http://') || trimmedBase.startsWith('https://')
 
   let data: RawModelsResponse | null = null
 
-  // 1. Direct fetch with ?key= param if remote requires it or headers
+  // 1. Direct fetch with the standard Authorization header. Never put an API key in a URL.
   try {
-    const urlObj = new URL(`${trimmedBase}/models`)
-    if (connection.apiKey) {
-      urlObj.searchParams.set('key', connection.apiKey.trim())
+    const headers: Record<string, string> = {
+      Accept: 'application/json',
+    }
+    if (connection.apiKey?.trim()) {
+      headers['Authorization'] = `Bearer ${connection.apiKey.trim()}`
     }
 
-    const directRes = await fetch(urlObj.toString(), {
+    const directRes = await fetch(`${trimmedBase}/models`, {
       method: 'GET',
-      headers: {
-        Accept: 'application/json',
-      },
+      headers,
     })
 
     if (directRes.ok) {
@@ -84,31 +84,8 @@ export async function fetchRemoteModels(connection: ConnectionConfig): Promise<M
     // If direct CORS/network fails, fallback to standard Authorization header or proxy
   }
 
-  // 2. If direct query-param fetch did not succeed, try standard Bearer header
-  if (!data) {
-    try {
-      const headers: Record<string, string> = {
-        Accept: 'application/json',
-      }
-      if (connection.apiKey?.trim()) {
-        headers['Authorization'] = `Bearer ${connection.apiKey.trim()}`
-      }
-
-      const directRes = await fetch(`${trimmedBase}/models`, {
-        method: 'GET',
-        headers,
-      })
-
-      if (directRes.ok) {
-        data = await directRes.json()
-      }
-    } catch {
-      // Direct fetch failed (likely CORS on browser), proceed to fallback proxy
-    }
-  }
-
-  // 3. Fallback to local Vite / Worker proxy if running in dev or support environment
-  if (!data && isHttpsOrCustom) {
+  // 2. Fallback to the local Vite / allowlisted Worker proxy when direct CORS fails.
+  if (!data && isHttpUrl) {
     try {
       const proxyRes = await fetch('/api/fetch-models', {
         method: 'POST',
@@ -151,6 +128,7 @@ export async function fetchRemoteModels(connection: ConnectionConfig): Promise<M
 
     const vision = caps.vision ?? (item.vision as boolean | undefined) ?? false
     const toolCalling = caps.tools ?? caps.toolCalling ?? (item.toolCalling as boolean | undefined) ?? false
+    const reasoning = caps.reasoning ?? (item.reasoning as boolean | undefined) ?? false
 
     return {
       id: item.id,
@@ -160,6 +138,7 @@ export async function fetchRemoteModels(connection: ConnectionConfig): Promise<M
       contextWindow,
       vision,
       toolCalling,
+      reasoning,
       description: item.description || (caps.reasoning ? 'Reasoning model with extended thinking capabilities' : undefined),
     }
   })
diff --git a/src/types.ts b/src/types.ts
index b15f9b9..67286d2 100644
--- a/src/types.ts
+++ b/src/types.ts
@@ -9,6 +9,7 @@ export interface Model {
   family?: string
   vision?: boolean
   toolCalling?: boolean
+  reasoning?: boolean
 }
 
 export interface ConnectionConfig {
@@ -16,6 +17,11 @@ export interface ConnectionConfig {
   apiKey: string
 }
 
+export interface InstallTargets {
+  unixPath: string
+  windowsPath: string
+}
+
 export interface ToolMeta {
   id: ToolId
   name: string
@@ -24,5 +30,6 @@ export interface ToolMeta {
   locationDescription: string
   language: 'json' | 'toml' | 'bash'
   iconName: 'bot' | 'terminal' | 'cpu'
+  installTargets?: InstallTargets
   sampleTemplate: (connection: ConnectionConfig, selectedModels: Model[]) => string
 }
diff --git a/tsconfig.app.json b/tsconfig.app.json
index 6830b6f..bf46060 100644
--- a/tsconfig.app.json
+++ b/tsconfig.app.json
@@ -4,7 +4,7 @@
     "target": "es2023",
     "lib": ["ES2023", "DOM"],
     "module": "esnext",
-    "types": ["vite/client"],
+    "types": ["vite/client", "bun"],
     "allowArbitraryExtensions": true,
     "skipLibCheck": true,
 
diff --git a/tsconfig.json b/tsconfig.json
index 1ffef60..0cdca22 100644
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -2,6 +2,7 @@
   "files": [],
   "references": [
     { "path": "./tsconfig.app.json" },
-    { "path": "./tsconfig.node.json" }
+    { "path": "./tsconfig.node.json" },
+    { "path": "./worker/tsconfig.json" }
   ]
 }
diff --git a/vite.config.ts b/vite.config.ts
index b29feeb..96d0da6 100644
--- a/vite.config.ts
+++ b/vite.config.ts
@@ -3,6 +3,7 @@ import react, { reactCompilerPreset } from '@vitejs/plugin-react'
 import babel from '@rolldown/plugin-babel'
 import tailwindcss from '@tailwindcss/vite'
 import type { IncomingMessage, ServerResponse } from 'node:http'
+import { renderInstallScript } from './src/services/installEndpoint.ts'
 
 // https://vite.dev/config/
 export default defineConfig({
@@ -13,6 +14,24 @@ export default defineConfig({
     {
       name: 'router-proxy-middleware',
       configureServer(server) {
+        // Dev endpoint for 1-click install scripts: /i/:token.(sh|ps1)
+        server.middlewares.use((req: IncomingMessage, res: ServerResponse, next: () => void) => {
+          const url = req.url || ''
+          const m = url.match(/^\/i\/([A-Za-z0-9\-_]+)\.(sh|ps1)(?:\?.*)?$/)
+          if (m && req.method === 'GET') {
+            const { status, contentType, body } = renderInstallScript(
+              m[1],
+              m[2] as 'sh' | 'ps1'
+            )
+            res.statusCode = status
+            res.setHeader('Content-Type', contentType)
+            res.setHeader('Cache-Control', 'no-store')
+            res.end(body)
+            return
+          }
+          next()
+        })
+
         server.middlewares.use('/api/fetch-models', async (req: IncomingMessage, res: ServerResponse) => {
           if (req.method !== 'POST') {
             res.statusCode = 405
diff --git a/worker/index.ts b/worker/index.ts
new file mode 100644
index 0000000..6ba69b2
--- /dev/null
+++ b/worker/index.ts
@@ -0,0 +1,35 @@
+import { renderInstallScript } from '../src/services/installEndpoint.ts'
+import { proxyModelRequest } from './modelProxy.ts'
+
+interface WorkerEnv {
+  ASSETS: {
+    fetch(request: Request): Promise<Response>
+  }
+  MODEL_PROXY_ALLOWED_ORIGINS?: string
+}
+
+export default {
+  async fetch(request: Request, env: WorkerEnv): Promise<Response> {
+    const url = new URL(request.url)
+    const m = url.pathname.match(/^\/i\/([A-Za-z0-9\-_]+)\.(sh|ps1)$/)
+    if (m) {
+      const { status, contentType, body } = renderInstallScript(
+        m[1],
+        m[2] as 'sh' | 'ps1'
+      )
+      return new Response(body, {
+        status,
+        headers: {
+          'content-type': contentType,
+          'cache-control': 'no-store',
+        },
+      })
+    }
+
+    if (url.pathname === '/api/fetch-models') {
+      return proxyModelRequest(request, env)
+    }
+
+    return env.ASSETS.fetch(request)
+  },
+}
diff --git a/worker/modelProxy.test.ts b/worker/modelProxy.test.ts
new file mode 100644
index 0000000..6e59b5f
--- /dev/null
+++ b/worker/modelProxy.test.ts
@@ -0,0 +1,91 @@
+import { afterEach, describe, expect, it, mock } from 'bun:test'
+import { proxyModelRequest } from './modelProxy.ts'
+
+const originalFetch = globalThis.fetch
+
+function createRequest(body: Record<string, unknown>, method = 'POST'): Request {
+  return new Request('https://config.example.com/api/fetch-models', {
+    method,
+    headers: { 'content-type': 'application/json' },
+    body: method === 'POST' ? JSON.stringify(body) : undefined,
+  })
+}
+
+afterEach(() => {
+  globalThis.fetch = originalFetch
+})
+
+describe('model proxy', () => {
+  it('does not enable the proxy without an allowlist', async () => {
+    const fetchMock = mock()
+    globalThis.fetch = fetchMock
+
+    const response = await proxyModelRequest(
+      createRequest({ baseUrl: 'https://router.example.com/v1' }),
+      {}
+    )
+
+    expect(response.status).toBe(503)
+    expect(fetchMock).not.toHaveBeenCalled()
+  })
+
+  it('ignores allowlist entries that are not plain HTTPS origins', async () => {
+    const fetchMock = mock()
+    globalThis.fetch = fetchMock
+
+    const response = await proxyModelRequest(
+      createRequest({ baseUrl: 'https://router.example.com/v1' }),
+      { MODEL_PROXY_ALLOWED_ORIGINS: 'https://router.example.com/v1' }
+    )
+
+    expect(response.status).toBe(503)
+    expect(fetchMock).not.toHaveBeenCalled()
+  })
+
+  it('proxies an allowlisted gateway request with a bearer token', async () => {
+    const fetchMock = mock(() =>
+      Promise.resolve(Response.json({ data: [{ id: 'example-model' }] }))
+    )
+    globalThis.fetch = fetchMock
+
+    const response = await proxyModelRequest(
+      createRequest({
+        baseUrl: 'https://router.example.com/v1/',
+        apiKey: 'test-key',
+      }),
+      { MODEL_PROXY_ALLOWED_ORIGINS: 'https://router.example.com' }
+    )
+
+    expect(response.status).toBe(200)
+    expect(await response.json()).toEqual({ data: [{ id: 'example-model' }] })
+    expect(fetchMock).toHaveBeenCalledWith(
+      'https://router.example.com/v1/models',
+      expect.objectContaining({
+        headers: expect.any(Headers),
+        redirect: 'error',
+      })
+    )
+
+    const [, requestInit] = fetchMock.mock.calls[0] as [string, RequestInit]
+    expect((requestInit.headers as Headers).get('Authorization')).toBe('Bearer test-key')
+  })
+
+  it('rejects unallowlisted and non-HTTPS gateways without fetching them', async () => {
+    const fetchMock = mock()
+    globalThis.fetch = fetchMock
+    const env = { MODEL_PROXY_ALLOWED_ORIGINS: 'https://router.example.com' }
+
+    const unallowlisted = await proxyModelRequest(
+      createRequest({ baseUrl: 'https://other.example.com/v1' }),
+      env
+    )
+    const nonHttps = await proxyModelRequest(
+      createRequest({ baseUrl: 'http://router.example.com/v1' }),
+      env
+    )
+
+    expect(unallowlisted.status).toBe(403)
+    expect(nonHttps.status).toBe(400)
+    expect(fetchMock).not.toHaveBeenCalled()
+  })
+})
\ No newline at end of file
diff --git a/worker/modelProxy.ts b/worker/modelProxy.ts
new file mode 100644
index 0000000..bfe2a42
--- /dev/null
+++ b/worker/modelProxy.ts
@@ -0,0 +1,147 @@
+const MAX_REQUEST_BODY_BYTES = 10_240
+const MAX_BASE_URL_LENGTH = 2_048
+const MAX_API_KEY_LENGTH = 4_096
+
+interface ModelProxyEnvironment {
+  MODEL_PROXY_ALLOWED_ORIGINS?: string
+}
+
+interface ModelProxyRequestBody {
+  baseUrl?: unknown
+  apiKey?: unknown
+}
+
+function jsonError(status: number, error: string): Response {
+  return Response.json(
+    { error },
+    {
+      status,
+      headers: { 'cache-control': 'no-store' },
+    }
+  )
+}
+
+function getAllowedOrigins(value: string | undefined): Set<string> {
+  const origins = new Set<string>()
+
+  for (const candidate of value?.split(',') ?? []) {
+    try {
+      const url = new URL(candidate.trim())
+      if (
+        url.protocol === 'https:' &&
+        url.pathname === '/' &&
+        !url.search &&
+        !url.hash &&
+        !url.username &&
+        !url.password
+      ) {
+        origins.add(url.origin)
+      }
+    } catch {
+      // Ignore malformed configuration entries rather than widening access.
+    }
+  }
+
+  return origins
+}
+
+export async function proxyModelRequest(
+  request: Request,
+  env: ModelProxyEnvironment
+): Promise<Response> {
+  if (request.method !== 'POST') {
+    return jsonError(405, 'Method not allowed')
+  }
+
+  const contentLength = Number(request.headers.get('content-length'))
+  if (Number.isFinite(contentLength) && contentLength > MAX_REQUEST_BODY_BYTES) {
+    return jsonError(413, 'Request body is too large')
+  }
+
+  if (!request.headers.get('content-type')?.includes('application/json')) {
+    return jsonError(415, 'Content-Type must be application/json')
+  }
+
+  const requestText = await request.text()
+  if (requestText.length > MAX_REQUEST_BODY_BYTES) {
+    return jsonError(413, 'Request body is too large')
+  }
+
+  let body: ModelProxyRequestBody
+  try {
+    body = JSON.parse(requestText) as ModelProxyRequestBody
+  } catch {
+    return jsonError(400, 'Request body must be valid JSON')
+  }
+
+  if (
+    typeof body.baseUrl !== 'string' ||
+    body.baseUrl.length === 0 ||
+    body.baseUrl.length > MAX_BASE_URL_LENGTH
+  ) {
+    return jsonError(400, 'baseUrl must be a valid HTTPS URL')
+  }
+
+  if (typeof body.apiKey !== 'undefined' && typeof body.apiKey !== 'string') {
+    return jsonError(400, 'apiKey must be a string')
+  }
+
+  if (body.apiKey && body.apiKey.length > MAX_API_KEY_LENGTH) {
+    return jsonError(400, 'apiKey is too long')
+  }
+
+  const normalizedBaseUrl = body.baseUrl.trim().replace(/\/+$/, '')
+  let baseUrl: URL
+  try {
+    baseUrl = new URL(normalizedBaseUrl)
+  } catch {
+    return jsonError(400, 'baseUrl must be a valid HTTPS URL')
+  }
+
+  if (
+    baseUrl.protocol !== 'https:' ||
+    baseUrl.username ||
+    baseUrl.password ||
+    baseUrl.search ||
+    baseUrl.hash
+  ) {
+    return jsonError(400, 'baseUrl must be a valid HTTPS URL')
+  }
+
+  const allowedOrigins = getAllowedOrigins(env.MODEL_PROXY_ALLOWED_ORIGINS)
+  if (allowedOrigins.size === 0) {
+    return jsonError(
+      503,
+      'Model proxy is not configured. Ask the site administrator to configure MODEL_PROXY_ALLOWED_ORIGINS.'
+    )
+  }
+
+  if (!allowedOrigins.has(baseUrl.origin)) {
+    return jsonError(403, 'This gateway origin is not allowed by the model proxy')
+  }
+
+  const headers = new Headers({ Accept: 'application/json' })
+  if (body.apiKey?.trim()) {
+    headers.set('Authorization', `Bearer ${body.apiKey.trim()}`)
+  }
+
+  let upstreamResponse: Response
+  try {
+    upstreamResponse = await fetch(`${normalizedBaseUrl}/models`, {
+      method: 'GET',
+      headers,
+      redirect: 'error',
+    })
+  } catch {
+    return jsonError(502, 'Unable to contact the configured gateway')
+  }
+
+  const upstreamBody = await upstreamResponse.json().catch(() => ({
+    error: 'Gateway returned an invalid JSON response',
+  }))
+
+  return Response.json(upstreamBody, {
+    status: upstreamResponse.status,
+    headers: { 'cache-control': 'no-store' },
+  })
+}
\ No newline at end of file
diff --git a/worker/tsconfig.json b/worker/tsconfig.json
new file mode 100644
index 0000000..4b4540c
--- /dev/null
+++ b/worker/tsconfig.json
@@ -0,0 +1,14 @@
+{
+  "compilerOptions": {
+    "target": "es2022",
+    "module": "esnext",
+    "moduleResolution": "bundler",
+    "types": ["@cloudflare/workers-types"],
+    "skipLibCheck": true,
+    "noEmit": true,
+    "allowImportingTsExtensions": true,
+    "verbatimModuleSyntax": true,
+    "moduleDetection": "force"
+  },
+  "include": ["index.ts", "modelProxy.ts"]
+}
diff --git a/wrangler.jsonc b/wrangler.jsonc
index d22428b..d616208 100644
--- a/wrangler.jsonc
+++ b/wrangler.jsonc
@@ -1,9 +1,12 @@
 {
   "$schema": "node_modules/wrangler/config-schema.json",
   "name": "9router-config-generate",
+  "main": "worker/index.ts",
   "compatibility_date": "2026-08-15",
   "assets": {
     "directory": "./dist",
-    "not_found_handling": "single-page-application"
+    "binding": "ASSETS",
+    "not_found_handling": "single-page-application",
+    "run_worker_first": ["/i/*", "/api/*"]
   }
 }