Compare commits

...

20 Commits

Author SHA1 Message Date
Claude a1f8078b99 Link search title/page matches to the page top instead of a section anchor
Search results render as page items with an optional bestSection. The link
used the section anchor whenever a section snippet existed, so title/page
matches dropped users into a mid-page heading instead of the top of the article.

Link to the section anchor only when a section snippet is shown AND the query
is not a title match (every whitespace-split query word is a case-insensitive
substring of the title, mirroring the title-scoring notion in
reciprocalRankFusion). Section-level matches keep their heading anchor.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01T4BRKDCFacoNMqgP5QyDPu
2026-07-23 00:10:33 +00:00
conico974 8c890522ed Patch next for dev, and fix issue in dev with inline icon (#4432) 2026-07-22 16:00:36 +02:00
conico974 e9558a6df7 Revert "Simplify search query handling to in-memory storage only (#4419)" (#4431) 2026-07-22 14:53:29 +02:00
Brett Jephson b5f3c1416a RND-11857: Prompt block with default expanded options (#4429) 2026-07-22 13:33:06 +01:00
conico974 b9d383bed3 Bump dependencies for @opennextjs/aws, @opennextjs/cloudflare, and next to latest versions (#4430) 2026-07-22 11:01:17 +02:00
spastorelli b6e7f2d2db Render the Site OAuth consent screen from the server's signed marker (#4428) 2026-07-22 09:59:30 +02:00
Tomek 94ef1769ec Simplify search query handling to in-memory storage only (#4419)
Co-authored-by: Claude Haiku 4.5 <noreply@anthropic.com>
2026-07-22 07:54:50 +00:00
Zeno Kapitein ae9367dafe Only show the assistant activity heading when there's activity to reveal (#4424)
Co-authored-by: Claude Opus 4.8 <noreply@anthropic.com>
2026-07-21 14:47:58 +02:00
Zeno Kapitein cef18701be Add an assistant tool to submit page feedback (#4408)
Co-authored-by: Claude Opus 4.8 <noreply@anthropic.com>
2026-07-21 13:25:14 +02:00
Zeno Kapitein bf674a47d9 Add supporting context to AI tool confirmation dialogs (#4422)
Co-authored-by: Claude Opus 4.8 <noreply@anthropic.com>
2026-07-21 11:45:51 +02:00
conico974 1eb763f9c5 Implement API token cookie handling with chunking support (#4421) 2026-07-20 15:38:07 +02:00
Nolann B. db176ba0ea Add "On this page" on models page (#4417) 2026-07-20 13:17:02 +02:00
Nolann B. 03bbacf319 Add missing link reference to OpenAPI models (#4416) 2026-07-20 12:53:28 +02:00
Tomek 484cc11627 Fix ScrollContainer scroll buttons not reflecting overflow immediately (#4414)
Co-authored-by: Claude Haiku 4.5 <noreply@anthropic.com>
2026-07-20 08:47:04 +00:00
spastorelli 0dee4155a2 Add consent flow env vars to next config (#4413) 2026-07-17 15:16:46 +00:00
spastorelli 4d7c01587e Add Sites OAuth consent screen (#4405) 2026-07-17 15:58:27 +02:00
Greg Bergé 6083a88845 Expose the current page context to integration block webframes (#4411)
Co-authored-by: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
2026-07-17 12:06:38 +02:00
Nolann B. bf6a7af72b Defer search index loading until search is opened (#4407) 2026-07-16 21:53:24 +02:00
Utku Ufuk 703e654a37 Split the default-scope site search into two parallel API requests (#4395) 2026-07-16 15:23:30 +03:00
conico974 1b571aeaa9 Fix scroll behavior for navigation (#4406) 2026-07-16 14:21:01 +02:00
128 changed files with 2424 additions and 370 deletions
@@ -0,0 +1,5 @@
---
"gitbook": patch
---
Add an assistant tool to submit feedback about the current page on behalf of the user.
@@ -0,0 +1,5 @@
---
"gitbook": patch
---
Assistant: the "Explored briefly" activity heading no longer appears when there's nothing to show. It now renders only when the answer is preceded by a real preamble or one or more tool calls, so a simple answer with an empty reasoning step no longer surfaces an empty collapsible.
+5
View File
@@ -0,0 +1,5 @@
---
"gitbook": patch
---
Add configurable default visibility to Prompt block
+7
View File
@@ -0,0 +1,7 @@
---
"@gitbook/openapi-parser": patch
"@gitbook/react-openapi": patch
"gitbook": patch
---
Add missing link reference to OpenAPI models
+7
View File
@@ -0,0 +1,7 @@
---
"@gitbook/browser-types": patch
"@gitbook/embed": patch
"gitbook": patch
---
Add an optional `context` property (string, up to 512 characters) to the `confirmation` of custom AI tools, shown above the confirmation dialog to help the user understand what they are approving or rejecting. The `confirmation` can now also be a function that receives the AI-provided input and returns the confirmation, so the context can be derived dynamically from the arguments the tool is about to run with. Available both to integrations (`GitBookIntegrationTool`) and to embed consumers (`GitBookToolDefinition`).
@@ -0,0 +1,5 @@
---
"gitbook": patch
---
Add an "On this page" table of contents on OpenAPI models pages. Each model in a grouped/multi-model "Models" section is now listed as its own section, matching operations and webhooks.
@@ -0,0 +1,5 @@
---
"gitbook": patch
---
Fix ScrollContainer scroll buttons not reflecting content overflow immediately or after dynamic content changes (e.g. search results).
@@ -0,0 +1,5 @@
---
"gitbook": patch
---
Search results that match a page title now link to the top of the page instead of a mid-page section anchor; section-level matches keep their heading anchor.
+5
View File
@@ -0,0 +1,5 @@
---
"gitbook": patch
---
Split the default-scope site search into two parallel API requests — one restricted to the current site space and one for the other site spaces — rendering each result set as soon as its response arrives. All results are ranked together by score, with the current site space scores boosted.
+6
View File
@@ -0,0 +1,6 @@
---
"@gitbook/react-contentkit": patch
"gitbook": patch
---
Expose the current page (`id`, `path`, `title`) to integration block webframes through the client-only webframe `state.page`, alongside adaptive visitor claims.
@@ -53,6 +53,7 @@ runs:
GITBOOK_API_PUBLIC_URL: ${{ inputs.opItem }}/GITBOOK_API_PUBLIC_URL
GITBOOK_API_TOKEN: ${{ inputs.opItem }}/GITBOOK_API_TOKEN
GITBOOK_OAUTH_SERVER_URL: ${{ inputs.opItem }}/GITBOOK_OAUTH_SERVER_URL
GITBOOK_SITE_OAUTH_SIGNING_SECRET: ${{ inputs.opItem }}/GITBOOK_SITE_OAUTH_SIGNING_SECRET
GITBOOK_PREVIEW_BASE_URL: ${{ inputs.opItem }}/GITBOOK_PREVIEW_BASE_URL
GITBOOK_INTEGRATIONS_HOST: ${{ inputs.opItem }}/GITBOOK_INTEGRATIONS_HOST
GITBOOK_INTEGRATIONS_CONTENT_HOST: ${{ inputs.opItem }}/GITBOOK_INTEGRATIONS_CONTENT_HOST
@@ -55,6 +55,7 @@ runs:
GITBOOK_API_PUBLIC_URL: ${{ inputs.opItem }}/GITBOOK_API_PUBLIC_URL
GITBOOK_API_TOKEN: ${{ inputs.opItem }}/GITBOOK_API_TOKEN
GITBOOK_OAUTH_SERVER_URL: ${{ inputs.opItem }}/GITBOOK_OAUTH_SERVER_URL
GITBOOK_SITE_OAUTH_SIGNING_SECRET: ${{ inputs.opItem }}/GITBOOK_SITE_OAUTH_SIGNING_SECRET
GITBOOK_PREVIEW_BASE_URL: ${{ inputs.opItem }}/GITBOOK_PREVIEW_BASE_URL
GITBOOK_INTEGRATIONS_HOST: ${{ inputs.opItem }}/GITBOOK_INTEGRATIONS_HOST
GITBOOK_INTEGRATIONS_CONTENT_HOST: ${{ inputs.opItem }}/GITBOOK_INTEGRATIONS_CONTENT_HOST
+18 -18
View File
@@ -127,8 +127,8 @@
"@gitbook/react-openapi": "workspace:*",
"@mermaid-js/mermaid-zenuml": "^0.2.2",
"@modelcontextprotocol/sdk": "1.17.5",
"@opennextjs/aws": "4.0.1",
"@opennextjs/cloudflare": "1.19.8",
"@opennextjs/aws": "4.1.0",
"@opennextjs/cloudflare": "1.20.2",
"@panzoom/panzoom": "^4.6.1",
"@radix-ui/react-checkbox": "^1.0.4",
"@radix-ui/react-collapsible": "^1.1.12",
@@ -165,7 +165,7 @@
"micromark-extension-gfm": "^3.0.0",
"motion": "^12.23.24",
"negotiator": "^1.0.0",
"next": "^16.2.6",
"next": "^16.2.11",
"next-themes": "^0.4.6",
"nuqs": "^2.2.3",
"object-hash": "^3.0.0",
@@ -346,8 +346,8 @@
},
},
"patchedDependencies": {
"next@16.2.11": "patches/next@16.2.11.patch",
"decode-named-character-reference@1.0.2": "patches/decode-named-character-reference@1.0.2.patch",
"next@16.2.6": "patches/next@16.2.6.patch",
},
"overrides": {
"@codemirror/state": "6.4.1",
@@ -360,7 +360,7 @@
"react-dom": "catalog:",
},
"catalog": {
"@gitbook/api": "0.189.0",
"@gitbook/api": "0.190.0",
"@scalar/api-client-react": "^1.3.46",
"@tsconfig/node20": "^20.1.6",
"@tsconfig/strictest": "^2.0.6",
@@ -756,7 +756,7 @@
"@fortawesome/fontawesome-svg-core": ["@fortawesome/fontawesome-svg-core@7.2.0", "", { "dependencies": { "@fortawesome/fontawesome-common-types": "7.2.0" } }, "sha512-6639htZMjEkwskf3J+e6/iar+4cTNM9qhoWuRfj9F3eJD6r7iCzV1SWnQr2Mdv0QT0suuqU8BoJCZUyCtP9R4Q=="],
"@gitbook/api": ["@gitbook/api@0.189.0", "", { "dependencies": { "event-iterator": "^2.0.0", "eventsource-parser": "^3.0.0" } }, "sha512-QezuW8dMScSTJ+2IL/GGixkhGEsMRFRoO/W2r80pKRjoWyI9Ebai9oZsoN/pbRZz3cTnwa7hpRDtzaqHeeOAdQ=="],
"@gitbook/api": ["@gitbook/api@0.190.0", "", { "dependencies": { "event-iterator": "^2.0.0", "eventsource-parser": "^3.0.0" } }, "sha512-Ln+AOp0+GIsQPhW7JHuolC2MlfPII26EffLkvrDe8KR+aSOGV23I+wtQ/iLl64UBFodExGfd3fe+Mb6S6h+lSQ=="],
"@gitbook/browser-types": ["@gitbook/browser-types@workspace:packages/browser-types"],
@@ -924,23 +924,23 @@
"@napi-rs/wasm-runtime": ["@napi-rs/wasm-runtime@1.0.6", "", { "dependencies": { "@emnapi/core": "^1.5.0", "@emnapi/runtime": "^1.5.0", "@tybys/wasm-util": "^0.10.1" } }, "sha512-DXj75ewm11LIWUk198QSKUTxjyRjsBwk09MuMk5DGK+GDUtyPhhEHOGP/Xwwj3DjQXXkivoBirmOnKrLfc0+9g=="],
"@next/env": ["@next/env@16.2.6", "", {}, "sha512-gd8HoHN4ufj73WmR3JmVolrpJR47ILK6LouP5xElPglaVxir6e1a7VzvTvDWkOoPXT9rkkTzyCxBu4yeZfZwcw=="],
"@next/env": ["@next/env@16.2.11", "", {}, "sha512-0do5A3BJ2gxWr0ZCMcD6BhW+e595jyxdTl3rXTS6lOtD8ektMiW6CO+EPwt1Eca1DBnm90r/7GdiKWBKxH++DA=="],
"@next/swc-darwin-arm64": ["@next/swc-darwin-arm64@16.2.6", "", { "os": "darwin", "cpu": "arm64" }, "sha512-ZJGkkcNfYgrrMkqOdZ7zoLa1TOy0qpcMfk/z4Mh/FKUz40gVO+HNQWqmLxf67Z5WB64DRp0dhEbyHfel+6sJUg=="],
"@next/swc-darwin-arm64": ["@next/swc-darwin-arm64@16.2.11", "", { "os": "darwin", "cpu": "arm64" }, "sha512-wryL4pjKmDwGv2ox6+GZDFxvmtSRLqApBR8kL1j4+vhB7Z5vJC/zAnXpiR9Xkfzl0AS8WLMnsuGV/UKI67/rrw=="],
"@next/swc-darwin-x64": ["@next/swc-darwin-x64@16.2.6", "", { "os": "darwin", "cpu": "x64" }, "sha512-v/YLBHIY132Ced3puBJ7YJKw1lqsCrgcNo2aRJlCEyQrrCeRJlvGlnmxhPxNQI3KE3N1DN5r9TPNPvka3nq5RQ=="],
"@next/swc-darwin-x64": ["@next/swc-darwin-x64@16.2.11", "", { "os": "darwin", "cpu": "x64" }, "sha512-aZl2j4f/fLyjQvOhv0Oe9UaMAQHolYpKhctsoYzplSumKJKPUmgjcf6545aBtysLTcu994TREd0+pSgNE4ohmg=="],
"@next/swc-linux-arm64-gnu": ["@next/swc-linux-arm64-gnu@16.2.6", "", { "os": "linux", "cpu": "arm64" }, "sha512-RPOvqlYBbcQjkz9VQQDZ2T2bARIjXZV1KFlt+V2Mr6SW/e4I9fcKsaA0hdyf2FHoTlsV2xnBd5Y912rP/1Ce6w=="],
"@next/swc-linux-arm64-gnu": ["@next/swc-linux-arm64-gnu@16.2.11", "", { "os": "linux", "cpu": "arm64" }, "sha512-5jEriyEnH/LWFy27L2ZG0XaLlyEJIjhsImEsiS9P563PKEVp2BVups/xfOucIrsvVntp11oNcZwjHvaDPYVB5g=="],
"@next/swc-linux-arm64-musl": ["@next/swc-linux-arm64-musl@16.2.6", "", { "os": "linux", "cpu": "arm64" }, "sha512-URUTu1+dMkxJsPFgm+OeEvq9wf5sujw0EvgYy80TDGHTSLTnIHeqb0Eu8A3sC95IRgjejQL+kC4mw+4yPxiAXA=="],
"@next/swc-linux-arm64-musl": ["@next/swc-linux-arm64-musl@16.2.11", "", { "os": "linux", "cpu": "arm64" }, "sha512-eIjcpx2fnnFSSkZDbTxy74KnokUXDjfoLClpWelfgHLf621aTqswhwXQ7GkD5K5rplrS6LZ/Bj+mVuvzluBOEg=="],
"@next/swc-linux-x64-gnu": ["@next/swc-linux-x64-gnu@16.2.6", "", { "os": "linux", "cpu": "x64" }, "sha512-DOj182mPV8G3UkrayLoREM5YEYI+Dk5wv7Ox9xl1fFibAELEsFD0lDPfHIeILlutMMfdyhlzYPELG3peuKaurw=="],
"@next/swc-linux-x64-gnu": ["@next/swc-linux-x64-gnu@16.2.11", "", { "os": "linux", "cpu": "x64" }, "sha512-8WgzpaWMs46qJT9kiV47cje86L0x/Mu9t8/Gwj+pnbgW3rETVfCnaScPjlYUwNScpOozdcIMHWmAvuZJUonR2w=="],
"@next/swc-linux-x64-musl": ["@next/swc-linux-x64-musl@16.2.6", "", { "os": "linux", "cpu": "x64" }, "sha512-HKQ5SP/V/ub73UvF7n/zeJlxk2kLmtL7Wzrg4WfmkjmNos5onJ2tKu7yZOPdL18A6Svfn3max29ym+ry7NkK4g=="],
"@next/swc-linux-x64-musl": ["@next/swc-linux-x64-musl@16.2.11", "", { "os": "linux", "cpu": "x64" }, "sha512-I3UgPds7G4ZYnTb/H+5GBGuUT2DhAk6j0mL6A4s63RjFs74wB2hOWP0vaxsK+3NJraExt3eYEPQ/UtT0x/64Nw=="],
"@next/swc-win32-arm64-msvc": ["@next/swc-win32-arm64-msvc@16.2.6", "", { "os": "win32", "cpu": "arm64" }, "sha512-LZXpTlPyS5v7HhSmnvsLGP3iIYgYOBnc8r8ArlT55sGHV89bR2HlDdBjWQ+PY6SJMmk8TuVGFuxalnP3k/0Dwg=="],
"@next/swc-win32-arm64-msvc": ["@next/swc-win32-arm64-msvc@16.2.11", "", { "os": "win32", "cpu": "arm64" }, "sha512-n89CjtcThnjrwgJMAiI5xbqwLY51zvwC9tSlArmVndAJLYVl9T9UAdlkXTmZvE++idoXe8KdglQlhNRdUp1c6g=="],
"@next/swc-win32-x64-msvc": ["@next/swc-win32-x64-msvc@16.2.6", "", { "os": "win32", "cpu": "x64" }, "sha512-F0+4i0h9J6C4eE3EAPWsoCk7UW/dbzOjyzxY0qnDUOYFu6FFmdZ6l97/XdV3/Nz3VYyO7UWjyEJUXkGqcoXfMA=="],
"@next/swc-win32-x64-msvc": ["@next/swc-win32-x64-msvc@16.2.11", "", { "os": "win32", "cpu": "x64" }, "sha512-md8CLNggS1Dx9pUgApzps5uAf+N8GN9xywzmNx9vHAWo94HtBwCCqkSnhIrdfQe83Dhz8Lfo/20Nb1Zxal092w=="],
"@noble/ciphers": ["@noble/ciphers@1.2.1", "", {}, "sha512-rONPWMC7PeExE077uLE4oqWrZ1IvAfz3oH9LibVAcVCopJiA9R62uavnbEzdkVmJYI6M6Zgkbeb07+tWjlq2XA=="],
@@ -976,9 +976,9 @@
"@octokit/types": ["@octokit/types@14.1.0", "", { "dependencies": { "@octokit/openapi-types": "^25.1.0" } }, "sha512-1y6DgTy8Jomcpu33N+p5w58l6xyt55Ar2I91RPiIA0xCJBXyUAhXCcmZaDWSANiha7R9a6qJJ2CRomGPZ6f46g=="],
"@opennextjs/aws": ["@opennextjs/aws@4.0.1", "", { "dependencies": { "@ast-grep/napi": "^0.40.5", "@aws-sdk/client-cloudfront": "3.984.0", "@aws-sdk/client-dynamodb": "3.984.0", "@aws-sdk/client-lambda": "3.984.0", "@aws-sdk/client-s3": "3.984.0", "@aws-sdk/client-sqs": "3.984.0", "@node-minify/core": "^8.0.6", "@node-minify/terser": "^8.0.6", "@tsconfig/node18": "^1.0.3", "aws4fetch": "^1.0.20", "chalk": "^5.6.2", "cookie": "^1.0.2", "esbuild": "0.25.4", "express": "^5.1.0", "path-to-regexp": "^6.3.0", "urlpattern-polyfill": "^10.1.0", "yaml": "^2.8.1" }, "peerDependencies": { "next": ">=15.5.16 <16 || >=16.2.5" }, "bin": { "open-next": "dist/index.js" } }, "sha512-k+wV8xyl2koaQRp84EY++3tO1J/M0b2KK4zR0LrPSwDgPqcR9EaKYiUu1mugc79A0KVgo839KR+opgk3wpSsXw=="],
"@opennextjs/aws": ["@opennextjs/aws@4.1.0", "", { "dependencies": { "@ast-grep/napi": "^0.40.5", "@aws-sdk/client-cloudfront": "3.984.0", "@aws-sdk/client-dynamodb": "3.984.0", "@aws-sdk/client-lambda": "3.984.0", "@aws-sdk/client-s3": "3.984.0", "@aws-sdk/client-sqs": "3.984.0", "@node-minify/core": "^8.0.6", "@node-minify/terser": "^8.0.6", "@tsconfig/node18": "^1.0.3", "aws4fetch": "^1.0.20", "chalk": "^5.6.2", "cookie": "^1.0.2", "esbuild": "0.25.4", "express": "^5.1.0", "path-to-regexp": "^6.3.0", "urlpattern-polyfill": "^10.1.0", "yaml": "^2.8.1" }, "peerDependencies": { "next": ">=15.5.21 <16 || >=16.2.11" }, "bin": { "open-next": "dist/index.js" } }, "sha512-GuKkdUbnJhLvtwTiJlytNtWIcSYN3+Dzi+OusUlRgf+Ur7dGoXdzBopd+VFiSdTBduPOvr9lPFDg6BYNjEV3wQ=="],
"@opennextjs/cloudflare": ["@opennextjs/cloudflare@1.19.8", "", { "dependencies": { "@ast-grep/napi": "^0.40.5", "@dotenvx/dotenvx": "1.31.0", "@opennextjs/aws": "4.0.1", "ci-info": "^4.2.0", "cloudflare": "^4.4.1", "comment-json": "^4.5.1", "enquirer": "^2.4.1", "glob": "^12.0.0", "ts-tqdm": "^0.8.6", "yargs": "^18.0.0" }, "peerDependencies": { "next": ">=15.5.16 <16 || >=16.2.5", "wrangler": "^4.86.0" }, "bin": { "opennextjs-cloudflare": "dist/cli/index.js" } }, "sha512-4c8gFgVWsuH+g42b1/tmltWeeGrM+vK+yx3v7sQS4ZdnjB5Oh4KHjOBuSyv/ZOKjad+67RxLZT1uP7yDKK/Y6w=="],
"@opennextjs/cloudflare": ["@opennextjs/cloudflare@1.20.2", "", { "dependencies": { "@ast-grep/napi": "^0.40.5", "@dotenvx/dotenvx": "1.31.0", "@opennextjs/aws": "4.1.0", "ci-info": "^4.2.0", "cloudflare": "^4.4.1", "comment-json": "^4.5.1", "enquirer": "^2.4.1", "glob": "^12.0.0", "ts-tqdm": "^0.8.6", "yargs": "^18.0.0" }, "peerDependencies": { "next": ">=15.5.21 <16 || >=16.2.11", "rclone.js": "^0.6.6", "wrangler": "^4.86.0" }, "optionalPeers": ["rclone.js"], "bin": { "opennextjs-cloudflare": "dist/cli/index.js" } }, "sha512-iFBjABnaDk3be27F5EpxyMLMGPbVnnArFx5I3Y8Rf6BSx5nBV8h0UuJiMKrx3+whDU5ahIy4d8sfbvWvMiF1Kg=="],
"@opentelemetry/api": ["@opentelemetry/api@1.9.0", "", {}, "sha512-3giAOQvZiH5F9bMlMiv8+GSPMeqg0dbaeo58/0SlA9sxSqZhnUtxzX9/2FzyhS9sWQf5S0GJE0AKBrFqjpeYcg=="],
@@ -2866,7 +2866,7 @@
"netmask": ["netmask@2.0.2", "", {}, "sha512-dBpDMdxv9Irdq66304OLfEmQ9tbNRFnFTuZiLo+bD+r332bBmMJ8GBLXklIXXgxd3+v9+KUnZaUR5PJMa75Gsg=="],
"next": ["next@16.2.6", "", { "dependencies": { "@next/env": "16.2.6", "@swc/helpers": "0.5.15", "baseline-browser-mapping": "^2.9.19", "caniuse-lite": "^1.0.30001579", "postcss": "8.4.31", "styled-jsx": "5.1.6" }, "optionalDependencies": { "@next/swc-darwin-arm64": "16.2.6", "@next/swc-darwin-x64": "16.2.6", "@next/swc-linux-arm64-gnu": "16.2.6", "@next/swc-linux-arm64-musl": "16.2.6", "@next/swc-linux-x64-gnu": "16.2.6", "@next/swc-linux-x64-musl": "16.2.6", "@next/swc-win32-arm64-msvc": "16.2.6", "@next/swc-win32-x64-msvc": "16.2.6", "sharp": "^0.34.5" }, "peerDependencies": { "@opentelemetry/api": "^1.1.0", "@playwright/test": "^1.51.1", "babel-plugin-react-compiler": "*", "react": "^18.2.0 || 19.0.0-rc-de68d2f4-20241204 || ^19.0.0", "react-dom": "^18.2.0 || 19.0.0-rc-de68d2f4-20241204 || ^19.0.0", "sass": "^1.3.0" }, "optionalPeers": ["@opentelemetry/api", "@playwright/test", "babel-plugin-react-compiler", "sass"], "bin": { "next": "dist/bin/next" } }, "sha512-qOVgKJg1+At15NpeUP+eJgCHvTCgXsogweq87Ri/Ix7PkqQHg4sdaXmSFqKlgaIXE4kW0g25LE68W87UANlHtw=="],
"next": ["next@16.2.11", "", { "dependencies": { "@next/env": "16.2.11", "@swc/helpers": "0.5.15", "baseline-browser-mapping": "^2.9.19", "caniuse-lite": "^1.0.30001579", "postcss": "8.4.31", "styled-jsx": "5.1.6" }, "optionalDependencies": { "@next/swc-darwin-arm64": "16.2.11", "@next/swc-darwin-x64": "16.2.11", "@next/swc-linux-arm64-gnu": "16.2.11", "@next/swc-linux-arm64-musl": "16.2.11", "@next/swc-linux-x64-gnu": "16.2.11", "@next/swc-linux-x64-musl": "16.2.11", "@next/swc-win32-arm64-msvc": "16.2.11", "@next/swc-win32-x64-msvc": "16.2.11", "sharp": "^0.34.5" }, "peerDependencies": { "@opentelemetry/api": "^1.1.0", "@playwright/test": "^1.51.1", "babel-plugin-react-compiler": "*", "react": "^18.2.0 || 19.0.0-rc-de68d2f4-20241204 || ^19.0.0", "react-dom": "^18.2.0 || 19.0.0-rc-de68d2f4-20241204 || ^19.0.0", "sass": "^1.3.0" }, "optionalPeers": ["@opentelemetry/api", "@playwright/test", "babel-plugin-react-compiler", "sass"], "bin": { "next": "dist/bin/next" } }, "sha512-B339zaqbyK8cmxhoAvLrcwoabwCP1wz21zSzfqxqXAemTu2BXnH7tQnfcglKv1vnMUIDBc+Hth7XODQriTZiRQ=="],
"next-themes": ["next-themes@0.4.6", "", { "peerDependencies": { "react": "^16.8 || ^17 || ^18 || ^19 || ^19.0.0-rc", "react-dom": "^16.8 || ^17 || ^18 || ^19 || ^19.0.0-rc" } }, "sha512-pZvgD5L0IEvX5/9GWyHMf3m8BKiVQwsCMHfoFosXtXBMnaS0ZnIJ9ST4b4NqLVKDEm8QBxoNNGNaBv2JNF6XNA=="],
+2 -2
View File
@@ -43,7 +43,7 @@
"catalog": {
"@tsconfig/strictest": "^2.0.6",
"@tsconfig/node20": "^20.1.6",
"@gitbook/api": "0.189.0",
"@gitbook/api": "0.190.0",
"@scalar/api-client-react": "^1.3.46",
"@types/react": "^19.0.0",
"@types/react-dom": "^19.0.0",
@@ -62,6 +62,6 @@
"patchedDependencies": {
"decode-named-character-reference@1.0.2": "patches/decode-named-character-reference@1.0.2.patch",
"@vercel/next@4.4.2": "patches/@vercel%2Fnext@4.4.2.patch",
"next@16.2.6": "patches/next@16.2.6.patch"
"next@16.2.11": "patches/next@16.2.11.patch"
}
}
+18 -4
View File
@@ -5,14 +5,28 @@ export type GitBookIntegrationEvent = 'load' | 'unload';
export type GitBookIntegrationEventCallback = (...args: any[]) => void;
export type GitBookIntegrationToolConfirmation = {
icon?: IconName;
label: string;
/**
* Supporting context displayed to the user above the confirmation dialog,
* to help them understand what they are approving or rejecting.
* Limited to 512 characters.
*/
context?: string;
};
export type GitBookIntegrationTool = AIToolDefinition & {
/**
* Confirmation action to be displayed to the user before executing the tool.
* Provide a static object, or a function that receives the input provided by
* the AI assistant and returns the confirmation — useful to display dynamic
* context based on the arguments the tool is about to be executed with.
*/
confirmation?: {
icon?: IconName;
label: string;
};
confirmation?:
| GitBookIntegrationToolConfirmation
| ((input: object) => GitBookIntegrationToolConfirmation);
/**
* Callback when the tool is executed.
+19 -4
View File
@@ -1,17 +1,32 @@
import type { AIToolCallResult, AIToolDefinition } from '@gitbook/api';
import type { IconName } from '@gitbook/icons';
/**
* Confirmation action to be displayed to the user before executing a tool.
*/
export type GitBookToolConfirmation = {
icon?: IconName;
label: string;
/**
* Supporting context displayed to the user above the confirmation dialog,
* to help them understand what they are approving or rejecting.
* Limited to 512 characters.
*/
context?: string;
};
/**
* Custom tool definition to be passed to the AI assistant.
*/
export type GitBookToolDefinition = AIToolDefinition & {
/**
* Confirmation action to be displayed to the user before executing the tool.
* Provide a static object, or a function that receives the input provided by
* the AI assistant and returns the confirmation — useful to display dynamic
* context based on the arguments the tool is about to be executed with.
*/
confirmation?: {
icon?: IconName;
label: string;
};
confirmation?: GitBookToolConfirmation | ((input: object) => GitBookToolConfirmation);
/**
* Callback when the tool is executed.
-5
View File
@@ -282,11 +282,6 @@ const testCases: TestsCase[] = [
contentBaseURL: 'https://vimeo.com',
tests: [{ name: 'Home', url: '/legal' }],
},
{
name: 'help.platipomiru.com',
contentBaseURL: 'https://help.platipomiru.com',
tests: [{ name: 'Home', url: '/' }],
},
{
name: 'help.aikido.dev',
contentBaseURL: 'https://help.aikido.dev',
+1
View File
@@ -46,6 +46,7 @@ const nextConfig = {
GITBOOK_API_URL: process.env.GITBOOK_API_URL,
GITBOOK_APP_URL: process.env.GITBOOK_APP_URL,
GITBOOK_OAUTH_SERVER_URL: process.env.GITBOOK_OAUTH_SERVER_URL,
GITBOOK_SITE_OAUTH_SIGNING_SECRET: process.env.GITBOOK_SITE_OAUTH_SIGNING_SECRET,
GITBOOK_PREVIEW_BASE_URL: process.env.GITBOOK_PREVIEW_BASE_URL,
GITBOOK_INTEGRATIONS_HOST: process.env.GITBOOK_INTEGRATIONS_HOST,
GITBOOK_INTEGRATIONS_CONTENT_HOST: process.env.GITBOOK_INTEGRATIONS_CONTENT_HOST,
@@ -3,6 +3,7 @@
"name": "gitbook-open-v2-server",
"keep_names": false,
"compatibility_date": "2026-04-02",
"minify": true,
"compatibility_flags": [
"nodejs_compat",
"allow_importable_env",
+3 -3
View File
@@ -19,8 +19,8 @@
"@gitbook/react-openapi": "workspace:*",
"@mermaid-js/mermaid-zenuml": "^0.2.2",
"@modelcontextprotocol/sdk": "1.17.5",
"@opennextjs/aws": "4.0.1",
"@opennextjs/cloudflare": "1.19.8",
"@opennextjs/aws": "4.1.0",
"@opennextjs/cloudflare": "1.20.2",
"@panzoom/panzoom": "^4.6.1",
"@radix-ui/react-checkbox": "^1.0.4",
"@radix-ui/react-collapsible": "^1.1.12",
@@ -57,7 +57,7 @@
"micromark-extension-gfm": "^3.0.0",
"motion": "^12.23.24",
"negotiator": "^1.0.0",
"next": "^16.2.6",
"next": "^16.2.11",
"next-themes": "^0.4.6",
"nuqs": "^2.2.3",
"object-hash": "^3.0.0",
@@ -0,0 +1,20 @@
import { type RouteLayoutParams, getDynamicSiteContext } from '@/app/utils';
import { CustomizationRootLayout } from '@/components/RootLayout/CustomizationRootLayout';
import { getThemeFromMiddleware } from '@/lib/middleware';
/**
* Layout for the sites OAuth consent screen.
*/
export default async function Layout({
params,
children,
}: React.PropsWithChildren<{ params: Promise<RouteLayoutParams> }>) {
const { context } = await getDynamicSiteContext(await params);
const forcedTheme = await getThemeFromMiddleware();
return (
<CustomizationRootLayout context={context} forcedTheme={forcedTheme}>
{children}
</CustomizationRootLayout>
);
}
@@ -0,0 +1,72 @@
import { cookies, headers } from 'next/headers';
import { notFound } from 'next/navigation';
import {
type RouteLayoutParams,
getDynamicSiteContext,
getSiteURLDataFromParams,
} from '@/app/utils';
import { ConsentError, ConsentScreen } from '@/components/SiteOAuthConsent';
import { withLeadingSlash, withTrailingSlash } from '@/lib/paths';
import {
SiteOAuthConsentError,
startSiteOAuthConsent,
verifySiteOAuthConsentMarker,
} from '@/lib/site-oauth';
import { getVisitorToken } from '@/lib/visitors';
// The consent screen depends on the request (visitor, one-time interaction) and must never be cached.
export const dynamic = 'force-dynamic';
type PageParams = RouteLayoutParams & { siteId: string };
/**
* Render the sites OAuth consent screen for a post-login authorize resume.
*/
export default async function Page(props: {
params: Promise<PageParams>;
searchParams: Promise<{ gb_oauth_state?: string; gb_consent?: string }>;
}) {
const params = await props.params;
const searchParams = await props.searchParams;
const { siteId } = params;
const consentVerified = await verifySiteOAuthConsentMarker({
siteId,
interactionId: searchParams.gb_oauth_state,
signature: searchParams.gb_consent,
});
if (!consentVerified) {
notFound();
}
const { context } = await getDynamicSiteContext(params);
const siteBasePath = withTrailingSlash(
withLeadingSlash(getSiteURLDataFromParams(params).siteBasePath)
);
const authorizeURL = new URL(
`${siteBasePath}~gitbook/oauth2/v1/${siteId}/authorize`,
context.linker.toAbsoluteURL('/')
);
const visitorToken = getVisitorToken({
cookies: (await cookies()).getAll(),
headers: await headers(),
url: authorizeURL,
});
const jwtToken = visitorToken?.token;
const interactionId = searchParams.gb_oauth_state;
if (!interactionId || !jwtToken) {
return <ConsentError />;
}
try {
const consent = await startSiteOAuthConsent({ siteId, interactionId, jwtToken });
return <ConsentScreen siteId={siteId} siteTitle={context.site.title} consent={consent} />;
} catch (error) {
if (error instanceof SiteOAuthConsentError) {
return <ConsentError />;
}
throw error;
}
}
@@ -16,6 +16,13 @@ export const ConfirmControlDef = createAIControl({
description:
'Display a confirmation prompt to the user (Confirm / Cancel) to approve or abort a pending action. Use this when an operation is irreversible, sensitive, or should only proceed with explicit user consent. Returns either a `confirmed` or `cancelled` result based on the user’s click.',
inputSchema: z.object({
context: z
.string()
.max(512)
.optional()
.describe(
'Supporting context shown above the prompt to help the user understand what they are approving or rejecting.'
),
icon: z
.string()
.optional()
@@ -29,30 +36,37 @@ export const ConfirmControlDef = createAIControl({
});
function ConfirmControl(props: GetAIControlProps<typeof ConfirmControlDef>) {
const { label, icon, onSubmit } = props;
const { label, icon, context, onSubmit } = props;
const language = useLanguage();
return (
<AIToolContainer className="flex w-full flex-col gap-2">
<Button
data-testid="ai-chat-tool-confirm-cancel"
onClick={() => {
onSubmit({ result: 'cancelled' });
}}
truncate={false}
variant="blank"
icon="xmark"
label={tString(language, 'cancel')}
/>
<Button
data-testid="ai-chat-tool-confirm-accept"
onClick={() => {
onSubmit({ result: 'confirmed' });
}}
variant="primary"
truncate={false}
icon={icon}
label={label}
/>
{context ? (
<p className="whitespace-pre-line px-2 pt-1 text-sm text-tint">{context}</p>
) : null}
<div className="flex w-full flex-wrap gap-2">
<Button
data-testid="ai-chat-tool-confirm-cancel"
onClick={() => {
onSubmit({ result: 'cancelled' });
}}
truncate={false}
variant="secondary"
icon="xmark"
label={tString(language, 'cancel')}
className="shrink-0 grow justify-center"
/>
<Button
data-testid="ai-chat-tool-confirm-accept"
onClick={() => {
onSubmit({ result: 'confirmed' });
}}
variant="primary"
truncate={false}
icon={icon}
label={label}
className="min-w-1/2 shrink-0 grow justify-center"
/>
</div>
</AIToolContainer>
);
}
@@ -11,6 +11,7 @@ import {
type AIStreamResponse,
type AIStreamResponseToolCallPending,
type AIToolCallResult,
SiteInsightsDisplayContext,
} from '@gitbook/api';
import assertNever from 'assert-never';
import * as React from 'react';
@@ -24,6 +25,7 @@ import { type RenderAIMessageOptions, streamAIChatResponse } from './server-acti
import { getTools } from './tools';
import { useAIMessageContextRef } from './useAIMessageContext';
import { useNavigateToPageTool } from './useNavigateToPageTool';
import { useSubmitPageFeedbackTool } from './useSubmitPageFeedbackTool';
export type AIChatMessage = {
role: AIMessageRole;
@@ -220,9 +222,11 @@ function notify(
*/
export function AIChatProvider(props: {
renderMessageOptions?: RenderAIMessageOptions;
/** Whether page feedback is enabled for the site (gates the submit-feedback tool). */
withPageFeedback?: boolean;
children: React.ReactNode;
}) {
const { renderMessageOptions, children } = props;
const { renderMessageOptions, withPageFeedback = false, children } = props;
const messageContextRef = useAIMessageContextRef();
const trackEvent = useTrackEvent();
@@ -230,9 +234,23 @@ export function AIChatProvider(props: {
const { siteSpaceId } = useCurrentContent();
const language = useLanguage();
// Built-in tools exposed to the assistant (e.g. navigating to a page). The tool has a stable
// identity, so it can be referenced directly from the streaming callback.
// Built-in tools exposed to the assistant (e.g. navigating to a page, submitting page
// feedback). Each tool has a stable identity, so it can be referenced directly from the
// streaming callback.
const navigateToPageTool = useNavigateToPageTool();
const submitPageFeedbackTool = useSubmitPageFeedbackTool({
displayContext: renderMessageOptions?.asEmbeddable
? SiteInsightsDisplayContext.Embed
: SiteInsightsDisplayContext.Site,
});
// Only expose the submit-feedback tool when the site has page feedback enabled, mirroring the
// "Was this helpful?" widget's visibility.
const builtInTools = React.useMemo(
() =>
withPageFeedback ? [navigateToPageTool, submitPageFeedbackTool] : [navigateToPageTool],
[navigateToPageTool, submitPageFeedbackTool, withPageFeedback]
);
// Event listeners storage
const eventsRef = React.useRef<Map<AIChatEvent['type'], AIChatEventListener[]>>(new Map());
@@ -312,7 +330,7 @@ export function AIChatProvider(props: {
// Execute a tool call
const executeToolCall = async (event: AIStreamResponseToolCallPending) => {
const tools = getTools([navigateToPageTool]);
const tools = getTools(builtInTools);
const toolDef = tools.find((tool) => tool.name === event.toolCall.tool);
if (!toolDef || !('execute' in toolDef)) {
@@ -348,7 +366,7 @@ export function AIChatProvider(props: {
let toolToExecute: AIStreamResponseToolCallPending | null = null;
try {
const tools = getTools([navigateToPageTool]);
const tools = getTools(builtInTools);
const stream = await streamAIChatResponse({
message: input.message,
toolCall: input.toolCall,
@@ -434,6 +452,18 @@ export function AIChatProvider(props: {
const confirmation = 'confirmation' in toolDef && toolDef.confirmation;
if (confirmation) {
// The confirmation can be a static object or a function that
// derives it from the AI-provided input (e.g. dynamic context).
// The function call is awaited because, for embed-registered
// tools, it arrives as an async proxy over the postMessage channel.
const resolvedConfirmation =
typeof confirmation === 'function'
? await confirmation(event.toolCall.input)
: confirmation;
const supportingContext =
typeof resolvedConfirmation.context === 'string'
? resolvedConfirmation.context.slice(0, 512)
: undefined;
globalState.setState((state) => ({
...state,
control: ConfirmControlDef.createControl({
@@ -442,8 +472,9 @@ export function AIChatProvider(props: {
toolCallId: event.toolCallId,
},
input: {
label: confirmation.label,
icon: confirmation.icon,
label: resolvedConfirmation.label,
icon: resolvedConfirmation.icon,
context: supportingContext,
},
language,
send: async (result) => {
@@ -462,7 +493,7 @@ export function AIChatProvider(props: {
text: tString(
language,
'tool_call_skipped',
confirmation.label
resolvedConfirmation.label
),
},
},
@@ -555,7 +586,7 @@ export function AIChatProvider(props: {
renderMessageOptions?.withToolCalls,
renderMessageOptions?.asEmbeddable,
language,
navigateToPageTool,
builtInTools,
]
);
@@ -832,12 +863,22 @@ function updateAIChatMessageActivity(
return {
...activity,
currentPhase: event.phase,
hasCommentary:
activity.hasCommentary || event.phase === AIMessageStepPhase.Commentary,
hasFinalAnswer:
activity.hasFinalAnswer || event.phase === AIMessageStepPhase.FinalAnswer,
};
}
case 'response_document': {
// A commentary phase can start without ever producing anything visible. Only a
// commentary step that emits document content is a real preamble worth collapsing
// behind the activity heading, so flag it here rather than on phase start.
return {
...activity,
hasCommentary:
activity.hasCommentary ||
(activity.currentPhase === AIMessageStepPhase.Commentary &&
event.blocks.length > 0),
};
}
case 'response_tool_call': {
return {
...activity,
@@ -0,0 +1,147 @@
'use client';
import { useLanguage } from '@/intl/client';
import { tString } from '@/intl/translate';
import {
type AIToolDefinition,
PageFeedbackRating,
type SiteInsightsDisplayContext,
} from '@gitbook/api';
import type { GitBookIntegrationTool } from '@gitbook/browser-types';
import * as React from 'react';
import { z } from 'zod';
import { zodToJsonSchema } from 'zod-to-json-schema';
import { type InsightsEventPageContext, useTrackEvent } from '../Insights';
import { type PagePointer, useCurrentPage } from '../hooks';
// Matches the comment cap the "Was this helpful?" widget enforces (PageFeedbackForm).
const MAX_COMMENT_LENGTH = 512;
const SubmitPageFeedbackInputSchema = z.object({
rating: z.enum(['good', 'ok', 'bad']).describe(
`The user's overall sentiment about the current page:
- 'good' if it was helpful. Only use it when the user actively expresses positive sentiment.
- 'ok' if it was fine but could be improved. Default to 'ok' for neutral feedback (typos, incoherent or missing content, etc).
- 'bad' if it was unhelpful. Only use it when the user actively expresses negative sentiment.
Infer it from the conversation; if it is unclear, ask the user before submitting.`
),
comment: z
.string()
.max(MAX_COMMENT_LENGTH)
.optional()
.describe(
`The user's feedback about the page, in their own words (e.g. what was confusing or missing). Optional — omit it when the user only expressed a rating.`
),
});
const ratingByInput: Record<
z.infer<typeof SubmitPageFeedbackInputSchema>['rating'],
PageFeedbackRating
> = {
good: PageFeedbackRating.Good,
ok: PageFeedbackRating.Ok,
bad: PageFeedbackRating.Bad,
};
/**
* Build the built-in `submitPageFeedback` tool exposed to the assistant.
*
* The tool records the user's feedback about the page they are currently viewing, reusing the same
* insights pipeline as the "Was this helpful?" widget (a `page_post_feedback` event, plus a
* `page_post_feedback_comment` event when the user left a comment). Because it acts on the user's
* behalf, it asks for confirmation before submitting.
*
* The events are tracked with an explicit page context so they attribute to the current page even
* on pathnames whose ambient insights context has no page (e.g. the embed's assistant tab).
*/
export function useSubmitPageFeedbackTool(options: {
/** Display context recorded with the feedback events (e.g. `site` vs. `embed`). */
displayContext: SiteInsightsDisplayContext;
}): GitBookIntegrationTool {
const { displayContext } = options;
const trackEvent = useTrackEvent();
const language = useLanguage();
const currentPage = useCurrentPage();
// The tool object is memoized once, so read the latest values from a ref at call time.
const ref = React.useRef<{
trackEvent: typeof trackEvent;
language: typeof language;
currentPage: PagePointer | null;
displayContext: SiteInsightsDisplayContext;
}>({ trackEvent, language, currentPage, displayContext });
React.useEffect(() => {
ref.current = { trackEvent, language, currentPage, displayContext };
});
return React.useMemo<GitBookIntegrationTool>(
() => ({
name: 'submitPageFeedback',
description:
"Submit the feedback on behalf of the user about the documentation page they are currently viewing. Use this when the user is indicating a sentiment about the page, particularly a negative one, or pointing to incorrect or incoherent information on a page. Proactively suggest to submit feedback for the user to help alleviate frustration or indicate a content gap they've encountered. The user will be asked to confirm before the feedback is recorded. Provide a rating and, when the user gave one, a comment in their own words.",
confirmation: (input) => {
const parsed = SubmitPageFeedbackInputSchema.safeParse(input);
const comment = parsed.success ? parsed.data.comment?.trim() : undefined;
return {
icon: 'paper-plane',
label: tString(language, 'ai_chat_tools_submit_feedback', ''),
context: comment ? `"${comment}"` : undefined,
};
},
inputSchema: zodToJsonSchema(
SubmitPageFeedbackInputSchema as any
) as AIToolDefinition['inputSchema'],
execute: async (input) => {
const { trackEvent, language, currentPage, displayContext } = ref.current;
const { rating, comment } = SubmitPageFeedbackInputSchema.parse(input);
if (!currentPage) {
throw new Error(
'No documentation page is currently open to submit feedback for.'
);
}
const pageFeedbackRating = ratingByInput[rating];
const trimmedComment = comment?.trim() || undefined;
const pageContext: InsightsEventPageContext = {
pageId: currentPage.pageId,
displayContext,
};
trackEvent(
{ type: 'page_post_feedback', feedback: { rating: pageFeedbackRating } },
pageContext,
{ immediate: !trimmedComment }
);
if (trimmedComment) {
trackEvent(
{
type: 'page_post_feedback_comment',
feedback: { rating: pageFeedbackRating, comment: trimmedComment },
},
pageContext,
{ immediate: true }
);
}
return {
output: {
submitted: true,
rating,
comment: trimmedComment ?? null,
pageId: currentPage.pageId,
},
summary: {
icon: 'comment-check',
text: `${tString(language, 'ai_chat_tools_submitted_feedback')}${trimmedComment ? `: "${trimmedComment}"` : ''}`,
},
};
},
}),
// Rebuild when the locale changes so the confirmation label (read at memo time, not from
// the ref) stays translated.
[language]
);
}
@@ -21,6 +21,7 @@ export type ClientBlockProps = Pick<BlockProps<DocumentBlockCode>, 'block' | 'st
inlineExprVariables: InlineExpressionVariables;
mode: BlockProps<DocumentBlockCode>['context']['mode'];
themes?: CustomizationThemedCodeTheme;
embedded?: boolean;
};
export const CODE_BLOCK_DEFAULT_COLLAPSED_LINE_COUNT = 10;
@@ -30,7 +31,7 @@ export const CODE_BLOCK_DEFAULT_COLLAPSED_LINE_COUNT = 10;
* It allows us to defer some load to avoid blocking the rendering of the whole page with block highlighting.
*/
export function ClientCodeBlock(props: ClientBlockProps) {
const { block, mode, style, inlines, inlineExprVariables, themes } = props;
const { block, mode, style, inlines, inlineExprVariables, themes, embedded } = props;
const blockRef = useRef<HTMLDivElement>(null);
const isInViewportRef = useRef(false);
const [isInViewport, setIsInViewport] = useState(false);
@@ -142,6 +143,7 @@ export function ClientCodeBlock(props: ClientBlockProps) {
theme={theme ?? plainTheme}
id={codeBlockBodyId}
isPrint={mode === 'print'}
embedded={embedded}
/>
);
@@ -22,6 +22,7 @@ export async function CodeBlock(
props: BlockProps<DocumentBlockCode> & {
themeKey?: keyof SiteCustomizationSettings['styling']['codeTheme'];
themes?: CustomizationThemedCodeTheme;
embedded?: boolean;
}
) {
const {
@@ -32,6 +33,7 @@ export async function CodeBlock(
context,
themeKey = 'default',
themes: providedThemes,
embedded,
} = props;
const inlines = getInlines(block);
const isMermaid = block.data.syntax?.toLowerCase() === 'mermaid';
@@ -87,6 +89,7 @@ export async function CodeBlock(
style={style}
theme={theme}
isPrint={context.mode === 'print'}
embedded={embedded}
/>
);
}
@@ -108,6 +111,7 @@ export async function CodeBlock(
inlineExprVariables: variables,
mode: context.mode,
themes,
embedded,
};
return (
@@ -19,6 +19,7 @@ type CodeBlockRendererProps = Pick<BlockProps<DocumentBlockCode>, 'block' | 'sty
* When true, the "Ask AI" button is not rendered.
*/
isPrint?: boolean;
embedded?: boolean;
};
/**
@@ -28,11 +29,12 @@ export const CodeBlockRenderer = forwardRef(function CodeBlockRenderer(
props: CodeBlockRendererProps,
ref: React.ForwardedRef<HTMLDivElement>
) {
const { block, style, theme, 'aria-busy': ariaBusy, isPrint } = props;
const { block, style, theme, 'aria-busy': ariaBusy, isPrint, embedded } = props;
const withLineNumbers = Boolean(block.data.lineNumbers) && block.nodes.length > 1;
const withWrap = block.data.overflow === 'wrap';
const title = block.data.title;
const withTitle = Boolean(title && !embedded);
const isSingleLine = theme.lines.length <= 1 && !withWrap;
const id = useId();
@@ -42,6 +44,7 @@ export const CodeBlockRenderer = forwardRef(function CodeBlockRenderer(
So we parse the foreground & background into objects that can be passed into React's `style` prop. */
const bg = parseShikiColorString(theme.bg);
const fg = parseShikiColorString(theme.fg);
const codeBackground = embedded ? undefined : bg;
return (
<div
@@ -50,8 +53,10 @@ export const CodeBlockRenderer = forwardRef(function CodeBlockRenderer(
aria-busy={ariaBusy}
className={tcls(
'group/codeblock shiki relative flex shrink flex-col overflow-hidden print:overflow-visible',
'circular-corners:rounded-2xl rounded-corners:rounded-xl straight-corners:rounded-xs',
'[&:has([data-codeblock-focus]:focus)]:ring-2 [&:has([data-codeblock-focus]:focus)]:ring-primary-hover',
!embedded &&
'circular-corners:rounded-2xl rounded-corners:rounded-xl straight-corners:rounded-xs',
!embedded &&
'[&:has([data-codeblock-focus]:focus)]:ring-2 [&:has([data-codeblock-focus]:focus)]:ring-primary-hover',
style
)}
/* Sets the code theme's mode (light or dark) for the site's theme mode (light or dark).
@@ -65,7 +70,7 @@ export const CodeBlockRenderer = forwardRef(function CodeBlockRenderer(
className="pointer-events-none absolute size-0 outline-none"
/>
<div className="flex items-center justify-start gap-2 text-sm">
{title ? (
{withTitle ? (
<div
className="relative top-px z-20 inline-flex items-center justify-center circular-corners:rounded-t-xl rounded-corners:rounded-t-lg straight-corners:rounded-t-xs border border-tint-subtle border-b-0 bg-tint-subtle theme-bold-tint:bg-tint-base theme-muted:bg-tint-base px-3 py-2 text-tint text-xs leading-none tracking-wide contrast-more:border-tint contrast-more:bg-tint-base [html.theme-bold.sidebar-filled_&]:bg-tint-base"
style={{
@@ -80,31 +85,37 @@ export const CodeBlockRenderer = forwardRef(function CodeBlockRenderer(
) : null}
</div>
<div className="relative flex min-h-0 flex-col">
<div
className={tcls(
'absolute right-2 z-2 flex items-center gap-1.5 font-sans leading-none opacity-0 group-hover/codeblock:opacity-11 has-[button:focus-visible]:opacity-11',
isSingleLine ? 'inset-y-0' : 'top-2'
)}
>
{!isPrint ? (
<AskAICodeButton
codeId={codeId}
title={title}
syntax={block.data.syntax}
style="backdrop-blur-md"
/>
) : null}
<CopyCodeButton codeId={codeId} style="backdrop-blur-md" />
</div>
{!embedded ? (
<div
className={tcls(
'absolute right-2 z-2 flex items-center gap-1.5 font-sans leading-none opacity-0 group-hover/codeblock:opacity-11 has-[button:focus-visible]:opacity-11',
isSingleLine ? 'inset-y-0' : 'top-2'
)}
>
{!isPrint ? (
<AskAICodeButton
codeId={codeId}
title={title}
syntax={block.data.syntax}
style="backdrop-blur-md"
/>
) : null}
<CopyCodeButton codeId={codeId} style="backdrop-blur-md" />
</div>
) : null}
<pre
className={tcls(
'relative overflow-auto border border-tint-subtle bg-tint-subtle theme-bold-tint:bg-tint-base theme-muted:bg-tint-base py-2.5 text-tint-strong contrast-more:border-tint contrast-more:bg-tint-base print:overflow-visible',
'circular-corners:rounded-2xl rounded-corners:rounded-xl straight-corners:rounded-xs depth-subtle:shadow-xs',
title && 'rounded-ss-none!'
'relative overflow-auto py-2.5 text-tint-strong print:overflow-visible',
embedded
? 'bg-tint-base'
: 'border border-tint-subtle bg-tint-subtle theme-bold-tint:bg-tint-base theme-muted:bg-tint-base contrast-more:border-tint contrast-more:bg-tint-base',
!embedded &&
'circular-corners:rounded-2xl rounded-corners:rounded-xl straight-corners:rounded-xs depth-subtle:shadow-xs',
withTitle && 'rounded-ss-none!'
)}
style={{
backgroundColor: bg?.color,
...bg?.vars,
backgroundColor: codeBackground?.color,
...codeBackground?.vars,
color: fg?.color,
...fg?.vars,
}}
@@ -118,7 +129,8 @@ export const CodeBlockRenderer = forwardRef(function CodeBlockRenderer(
>
{theme.lines.map((line, index) => (
<CodeHighlightLine
bg={bg}
bg={codeBackground}
embedded={embedded}
fg={fg}
key={index}
line={line}
@@ -136,11 +148,13 @@ export const CodeBlockRenderer = forwardRef(function CodeBlockRenderer(
function CodeHighlightLine(props: {
line: HighlightLine;
bg?: ShikiColorDefinition;
embedded?: boolean;
fg?: ShikiColorDefinition;
isLast: boolean;
withLineNumbers: boolean;
}) {
const { line, isLast, withLineNumbers, bg, fg } = props;
const { line, isLast, withLineNumbers, bg, embedded, fg } = props;
const embeddedPlainLine = Boolean(embedded && !line.diff && !line.highlighted);
const lineStyle = {
color: fg?.color,
...fg?.vars,
@@ -151,6 +165,7 @@ function CodeHighlightLine(props: {
<span
className={tcls(
'highlight-line',
embeddedPlainLine && 'bg-transparent! hover:bg-tint-subtle!',
line.diff === 'added' && 'diff-added',
line.diff === 'deleted' && 'diff-deleted',
line.highlighted && 'highlighted'
@@ -6,6 +6,7 @@ import { type GitBookLinker, createLinker } from '@/lib/links';
import { ContentKit, type ContentKitClientContextData } from '@gitbook/react-contentkit/client';
import { useRouter } from 'next/navigation';
import React from 'react';
import type { WebframePageContext } from './adaptive';
type ContentKitProps<RenderContext> = React.ComponentProps<typeof ContentKit<RenderContext>>;
@@ -17,18 +18,20 @@ export type WebframeLinkerData = Pick<
/**
* ContentKit wrapper for integration blocks that expose client-only capabilities to webframes:
* navigation to other pages, and adaptive visitor claims (only when the integration is allowed to
* access them).
* the current page, navigation to other pages, and adaptive visitor claims (only when the
* integration is allowed to access them).
*/
export function ContentKitWithClientContext<RenderContext>(
props: ContentKitProps<RenderContext> & {
/** Whether visitor claims may be exposed to the webframe (integration scope gated). */
canAccessVisitorClaims: boolean;
/** Current page to inject into the webframe, or `null` when unknown. */
page: WebframePageContext | null;
/** Data to rebuild the site linker, used to resolve webframe navigation requests. */
linkerData: WebframeLinkerData;
}
) {
const { canAccessVisitorClaims, linkerData, ...contentKitProps } = props;
const { canAccessVisitorClaims, page, linkerData, ...contentKitProps } = props;
const router = useRouter();
const { onNavigationClick } = React.useContext(NavigationStatusContext);
@@ -56,6 +59,7 @@ export function ContentKitWithClientContext<RenderContext>(
getVisitorContext: canAccessVisitorClaims
? () => ({ visitor: visitorClaims?.visitor ?? null })
: undefined,
getPageContext: page ? () => ({ page }) : undefined,
navigate: ({ path, anchor }) => {
// Resolve the requested path relative to the site root so a webframe can navigate
// to any section or space within the site (and nowhere outside it).
@@ -63,7 +67,7 @@ export function ContentKitWithClientContext<RenderContext>(
navigateTo(linker.toPathInSite(path) + suffix);
},
}),
[canAccessVisitorClaims, visitorClaims, linker, navigateTo]
[canAccessVisitorClaims, visitorClaims, page, linker, navigateTo]
);
return <ContentKit {...contentKitProps} clientContext={clientContext} />;
@@ -10,7 +10,7 @@ import {
ContentKitWithClientContext,
type WebframeLinkerData,
} from './ContentKitWithClientContext';
import { integrationBlockContainsWebframe } from './adaptive';
import { getWebframePageContext, integrationBlockContainsWebframe } from './adaptive';
import { contentKitServerContext } from './contentkit';
import { fetchSafeIntegrationUI } from './render';
import { renderIntegrationUi } from './server-actions';
@@ -77,8 +77,11 @@ export async function IntegrationBlock(props: BlockProps<DocumentBlockIntegratio
const containsWebframe = integrationBlockContainsWebframe(initialOutput);
const canAccessVisitorClaims = initialOutput.canAccessVisitorClaims === true;
// Any webframe uses the client-context wrapper: it enables navigation to other pages, plus
// visitor claims when the integration is allowed them.
// The current page (path/id/title) is non-sensitive, so it is always exposed to webframes.
const page = getWebframePageContext(context.contentContext);
// Any webframe uses the client-context wrapper: it enables navigation to other pages and
// exposes the current page, plus visitor claims when the integration is allowed them.
const useClientContext = containsWebframe;
const contentKitProps = {
@@ -106,6 +109,7 @@ export async function IntegrationBlock(props: BlockProps<DocumentBlockIntegratio
<ContentKitWithClientContext
{...contentKitProps}
canAccessVisitorClaims={canAccessVisitorClaims}
page={page}
linkerData={getWebframeLinkerData(context.contentContext.linker)}
>
<ContentKitOutput output={initialOutput} context={contentKitServerContext} />
@@ -1,7 +1,9 @@
import { describe, expect, it } from 'bun:test';
import type { ContentKitRenderOutput, ContentKitWebFrame } from '@gitbook/api';
import { integrationBlockContainsWebframe } from './adaptive';
import type { GitBookAnyContext } from '@/lib/context';
import { createLinker } from '@/lib/links';
import { getWebframePageContext, integrationBlockContainsWebframe } from './adaptive';
const webframe: ContentKitWebFrame = {
type: 'webframe',
@@ -38,3 +40,47 @@ describe('integrationBlockContainsWebframe', () => {
expect(integrationBlockContainsWebframe(output)).toBe(true);
});
});
describe('getWebframePageContext', () => {
it('returns null when the context has no page', () => {
const context = { space: { id: 'space-1' } } as unknown as GitBookAnyContext;
expect(getWebframePageContext(context)).toBeNull();
});
it('resolves the page path relative to the site root, including the section slug', () => {
const context = {
page: {
id: 'page-1',
path: 'guides/getting-started',
title: 'Getting started',
slug: 'getting-started',
},
// Site served at /docs, with the page's space mounted under the `api` section.
linker: createLinker({ siteBasePath: '/docs/', spaceBasePath: '/docs/api/' }),
} as unknown as GitBookAnyContext;
expect(getWebframePageContext(context)).toEqual({
id: 'page-1',
path: 'api/guides/getting-started',
title: 'Getting started',
});
});
it('leaves the path unprefixed when the space is served at the site root', () => {
const context = {
page: {
id: 'page-2',
path: 'guides/getting-started',
title: 'Getting started',
slug: 'getting-started',
},
linker: createLinker({ siteBasePath: '/', spaceBasePath: '/' }),
} as unknown as GitBookAnyContext;
expect(getWebframePageContext(context)).toEqual({
id: 'page-2',
path: 'guides/getting-started',
title: 'Getting started',
});
});
});
@@ -1,3 +1,4 @@
import type { GitBookAnyContext } from '@/lib/context';
import type {
ContentKitDescendantElement,
ContentKitRenderOutput,
@@ -7,9 +8,19 @@ import type {
type ContentKitElement = ContentKitRootElement | ContentKitDescendantElement | ContentKitStepper;
/**
* Current page exposed to a webframe through the client-only webframe state.
*/
export type WebframePageContext = {
id: string;
/** Path of the page relative to the site root (includes the section and variant). */
path: string;
title: string;
};
/**
* Whether an integration block's output contains a webframe that can consume client-only context
* (navigation and/or visitor claims).
* (navigation, visitor claims and/or the current page).
*/
export function integrationBlockContainsWebframe(output: ContentKitRenderOutput): boolean {
if (output.type === 'complete') {
@@ -19,6 +30,31 @@ export function integrationBlockContainsWebframe(output: ContentKitRenderOutput)
return doesContentKitElementContainWebframe(output.element);
}
/**
* Extract the current page to expose to a webframe, or `null` when it is unknown
* (e.g. a non-page context, or reusable content resolved from another source).
*
* The exposed `path` is resolved relative to the site root — so it carries the section and
* variant, unlike the space-relative `page.path` — matching how `@webframe.navigate` resolves a
* path. A webframe can pass `page.path` straight back to the navigate action.
*/
export function getWebframePageContext(
contentContext: GitBookAnyContext
): WebframePageContext | null {
if (!('page' in contentContext) || !contentContext.page) {
return null;
}
const { linker } = contentContext;
const { id, path, title } = contentContext.page;
return {
id,
path: linker.toRelativePathInSite(linker.toPathInSpace(path)),
title,
};
}
/**
* Check whether a ContentKit element tree contains a webframe element.
*/
@@ -52,6 +52,7 @@ export function getOpenAPIContext(args: {
check: <Icon icon="check" />,
lock: <Icon icon="lock" />,
mcp: <Icon icon="mcp" />,
hashtag: <Icon icon="hashtag" />,
},
renderCodeBlock: (codeProps) => (
<PlainCodeBlock
@@ -865,6 +865,30 @@ body:has(.openapi-select-popover) {
@apply border-t border-x last:border-b border-tint-subtle !ring-0 rounded-corners:first:!rounded-t-xl rounded-corners:last:!rounded-b-xl circular-corners:first:!rounded-t-2xl circular-corners:last:!rounded-b-2xl straight-corners:first:!rounded-t-xs straight-corners:last:!rounded-b-xs !rounded-none;
}
/* Model name + its hover hash-link, inline. Carries the anchor id / deep-link scroll target. */
.openapi-schemas-model-title {
@apply flex items-center gap-2 min-w-0;
/* Offset by the trigger's p-5 so a deep-link lands the model's top edge, not its title, below the header. */
scroll-margin-top: calc(var(--content-scroll-margin) + 1.25rem);
}
.openapi-schemas-model-title-name {
@apply min-w-0 truncate;
}
.openapi-schemas-anchor-link {
@apply shrink-0 flex items-center opacity-0 transition-opacity;
}
.openapi-schemas-disclosure:hover .openapi-schemas-anchor-link,
.openapi-schemas-anchor-link:focus-visible {
@apply opacity-100;
}
.openapi-schemas-anchor-link svg {
@apply size-3 text-tint-subtle hover:text-tint-strong;
}
.openapi-schemas-disclosure > .openapi-disclosure-trigger {
@apply flex items-center font-mono transition-all font-normal text-tint-strong !text-sm hover:bg-tint-subtle dark:hover:bg-tint-hover relative flex-1 gap-2.5 p-5 truncate -outline-offset-1;
}
@@ -965,7 +989,7 @@ body:has(.openapi-select-popover) {
}
}
.openapi-disclosure-trigger[aria-expanded="true"] svg {
.openapi-disclosure-trigger[aria-expanded="true"] .openapi-disclosure-trigger-label svg {
@apply rotate-45;
}
@@ -1,25 +1,46 @@
import {
CustomizationPageActionType,
type DocumentBlockCode,
type DocumentBlockPrompt,
type SiteCustomizationSettings,
} from '@gitbook/api';
import { validateIconName } from '@gitbook/icons/icons';
import type { BlockProps } from '../Block';
import { CodeBlock } from '../CodeBlock';
import { getPlainCodeBlock } from '../CodeBlock/highlight';
import { PromptClient } from './PromptClient';
const PROMPT_COLLAPSED_LINE_COUNT = 10;
export function Prompt(props: BlockProps<DocumentBlockPrompt>) {
const { block } = props;
const { block, document, ancestorBlocks, context, isEstimatedOffscreen } = props;
const contentIcon =
block.data.icon && validateIconName(block.data.icon) ? block.data.icon : null;
const prompt = getPromptText(block);
const defaultExpanded = block.data.defaultExpanded ?? 'hidden';
const promptContent = block.nodes.map((node, index) => (
<CodeBlock
key={node.key ?? index}
block={getPromptCodeBlock(node, { defaultExpanded })}
document={document}
ancestorBlocks={[...ancestorBlocks, block]}
context={context}
isEstimatedOffscreen={isEstimatedOffscreen}
embedded
/>
));
return (
<PromptClient
{...block.data}
contentIcon={contentIcon}
description={block.data.description}
prompt={getPromptText(block)}
defaultExpanded={defaultExpanded}
openInAIProviders={getOpenInAIProviders(props)}
/>
prompt={prompt}
>
{promptContent}
</PromptClient>
);
}
@@ -49,3 +70,22 @@ function isExternalAIPageActionEnabled(
function getPromptText(block: DocumentBlockPrompt): string {
return (block.nodes ?? []).map((node) => getPlainCodeBlock(node)).join('\n');
}
function getPromptCodeBlock(
block: DocumentBlockCode,
options: { defaultExpanded: 'hidden' | 'partial' | 'full' }
): DocumentBlockCode {
const isPartiallyExpanded = options.defaultExpanded === 'partial';
return {
...block,
data: {
...block.data,
syntax: block.data.syntax ?? 'markdown',
expandable: isPartiallyExpanded,
collapsedLineCount: isPartiallyExpanded ? PROMPT_COLLAPSED_LINE_COUNT : undefined,
lineNumbers: false,
overflow: 'wrap',
},
};
}
@@ -4,67 +4,83 @@ import { Button, DropdownMenu, DropdownMenuItem, ToggleChevron } from '@/compone
import { getURLForLLM } from '@/components/utils';
import { tString, useLanguage } from '@/intl/client';
import { tcls } from '@/lib/tailwind';
import type { DocumentBlockPrompt } from '@gitbook/api';
import { Icon, type IconName } from '@gitbook/icons';
import React from 'react';
const OPEN_IN_AI_PROVIDERS = ['claude', 'chatgpt', 'cursor'] as const;
type AIProviders = (typeof OPEN_IN_AI_PROVIDERS)[number];
export function PromptClient(props: {
type PromptClientProps = DocumentBlockPrompt['data'] & {
contentIcon: IconName | null;
description: string;
prompt: string;
openInAIProviders: boolean;
}) {
const { contentIcon, description, prompt, openInAIProviders } = props;
children?: React.ReactNode;
};
export function PromptClient(props: PromptClientProps) {
const {
contentIcon,
description,
openInAIProviders = false,
defaultExpanded = 'hidden',
prompt,
children,
} = props;
const language = useLanguage();
const promptId = React.useId();
const [open, setOpen] = React.useState(false);
const [open, setOpen] = React.useState(defaultExpanded === 'full');
const isPartiallyExpanded = defaultExpanded === 'partial';
const expanded = isPartiallyExpanded || open;
React.useEffect(() => {
setOpen(defaultExpanded === 'full');
}, [defaultExpanded]);
return (
<div
className={tcls(
'relative flex w-full flex-col overflow-hidden circular-corners:rounded-2xl rounded-corners:rounded-xl straight-corners:rounded-xs text-tint-strong',
'border border-tint-subtle contrast-more:border-tint',
'transition',
open ? 'bg-tint depth-subtle:shadow-xs' : 'bg-tint-base'
expanded ? 'bg-tint depth-subtle:shadow-xs' : 'bg-tint-base'
)}
>
<div
className={tcls(
'group/prompt-header relative flex min-h-9 flex-row items-center justify-between gap-4 p-3 transition-colors',
open ? 'hover:bg-tint-hover' : 'hover:bg-tint-subtle'
!isPartiallyExpanded && (open ? 'hover:bg-tint-hover' : 'hover:bg-tint-subtle')
)}
>
<button
type="button"
aria-controls={promptId}
aria-expanded={open}
aria-label={tString(language, 'view')}
className={tcls(
'absolute inset-0 z-10 cursor-pointer outline-hidden',
'focus-visible:ring-2 focus-visible:ring-primary-hover'
)}
disabled={!prompt}
onClick={() => setOpen((prev) => !prev)}
/>
<div className="pointer-events-none relative z-0 flex min-w-0 flex-row items-center gap-2 text-tint-strong">
<ToggleChevron
open={open}
orientation="right-to-down"
className="size-3 shrink-0 text-tint-subtle transition-colors group-hover/prompt-header:text-tint-strong"
{!isPartiallyExpanded ? (
<button
type="button"
aria-controls={promptId}
aria-expanded={open}
aria-label={tString(language, 'view')}
className={tcls(
'absolute inset-0 z-10 cursor-pointer outline-hidden',
'focus-visible:ring-2 focus-visible:ring-primary-hover'
)}
disabled={!prompt}
onClick={() => setOpen((prev) => !prev)}
/>
) : null}
<div className="pointer-events-none relative z-0 flex min-w-0 flex-row items-center gap-2 text-tint-strong">
{!isPartiallyExpanded ? (
<ToggleChevron
open={open}
orientation="right-to-down"
className="size-3 shrink-0 text-tint-subtle transition-colors group-hover/prompt-header:text-tint-strong"
/>
) : null}
{contentIcon ? <Icon icon={contentIcon} className="size-4 shrink-0" /> : null}
<span className="min-w-0 truncate">{description}</span>
</div>
<PromptActions prompt={prompt} openInAIProviders={openInAIProviders} />
</div>
{open ? (
{isPartiallyExpanded || open ? (
<div id={promptId} className="border-tint-subtle border-t bg-tint-base">
<pre className="overflow-auto p-4 text-sm text-tint-strong">
<code className="language-markdown whitespace-pre-wrap font-mono">
{prompt}
</code>
</pre>
{children}
</div>
) : null}
</div>
@@ -1,2 +1 @@
export * from './Prompt';
export type * from './types';
@@ -1,14 +0,0 @@
import type { DocumentBlockCode } from '@gitbook/api';
export type PromptBlock = {
object: 'block';
type: 'prompt';
key?: string;
data: {
icon?: string;
description?: string;
openInAIProviders?: boolean;
};
nodes?: DocumentBlockCode[];
isVoid?: false;
};
@@ -154,7 +154,11 @@ export function InsightsProvider(props: InsightsProviderProps) {
const pathname = window.location.pathname;
const previous = eventsRef.current[pathname];
eventsRef.current[pathname] = {
pageContext: previous?.pageContext ?? ctx,
// An explicitly-provided context wins so page-scoped events (e.g. feedback) can
// attribute to their page even when the pathname's ambient context has none — such
// as the embed's assistant tab, whose view records a null page. Events that pass no
// context keep the stored one.
pageContext: ctx ?? previous?.pageContext,
url: previous?.url ?? window.location.href,
events: [
...(previous?.events ?? []),
@@ -3,6 +3,7 @@
import { t, useLanguage } from '@/intl/client';
import { tcls } from '@/lib/tailwind';
import { CustomizationSearchStyle } from '@gitbook/api';
import dynamic from 'next/dynamic';
import React, { useRef } from 'react';
import { useHotkeys } from 'react-hotkeys-hook';
import { AIChatButton } from '../AIChat';
@@ -10,13 +11,16 @@ import { useIsMobile } from '../hooks/useIsMobile';
import { Button, Popover } from '../primitives';
import { KeyboardShortcut } from '../primitives/KeyboardShortcut';
import { SideSheet } from '../primitives/SideSheet';
import { SearchFrame } from './SearchFrame';
import { SearchInput } from './SearchInput';
import { SearchLiveResultsAnnouncer } from './SearchLiveResultsAnnouncer';
import { SearchScopeControl } from './SearchScopeControl';
import type { SearchBaseProps } from './search-props';
import { useSearchController } from './useSearchController';
const SearchFrame = dynamic(() => import('./SearchFrame').then((mod) => mod.SearchFrame), {
ssr: false,
});
interface SearchContainerProps extends SearchBaseProps {
style: CustomizationSearchStyle;
className?: string;
@@ -113,8 +117,20 @@ export function SearchContainer({
cursor !== null && cursor < results.length ? `${resultsId}-${cursor}` : undefined;
const isSearchOpen = Boolean(visible && (state?.open ?? false));
const shouldFillHeight = Boolean(query || showAsk);
// The SideSheet always renders its children (it hides them with CSS, unlike the desktop
// Popover which mounts its content on open). Mounting the frame only after the first open
// keeps the dynamic SearchFrame chunk off the mobile startup path, while leaving it mounted
// afterwards so the sheet's exit animation isn't cut short.
const [wasSearchOpened, setWasSearchOpened] = React.useState(false);
React.useEffect(() => {
if (isSearchOpen) {
setWasSearchOpened(true);
}
}, [isSearchOpen]);
const shouldShowSearchFrame = usesSideSheet
? Boolean(state?.open || state?.query || withAI)
? Boolean(state?.open || state?.query || wasSearchOpened)
: Boolean(state?.query || withAI);
const scopeControlNode =
searchProps.withVariants || searchProps.withSections ? (
@@ -7,6 +7,7 @@ import { Tooltip } from '../primitives';
import { Emoji } from '../primitives/Emoji/Emoji';
import { HighlightQuery } from './HighlightQuery';
import { SearchResultItem } from './SearchResultItem';
import { isPageTitleMatch } from './isPageTitleMatch';
import type { MergedPageResult } from './reciprocalRankFusion';
import type { ComputedPageResult } from './search-types';
import type { LocalPageResult } from './useLocalSearchResults';
@@ -26,9 +27,12 @@ export const SearchPageResultItem = React.forwardRef(function SearchPageResultIt
const language = useLanguage();
const bestSection = item.type === 'page' ? item.bestSection : undefined;
// When the section snippet is displayed, link to the section anchor so the
// link matches what the user sees.
const href = bestSection?.body ? bestSection.href : 'href' in item ? item.href : item.pathname;
const pageHref = 'href' in item ? item.href : item.pathname;
// Link to the section anchor only when a section snippet is shown AND the
// query is not a title match. Title/page matches link to the top of the page;
// section-level matches keep their heading anchor.
const href =
bestSection?.body && !isPageTitleMatch(query, item.title) ? bestSection.href : pageHref;
const emoji = 'emoji' in item ? item.emoji : undefined;
const icon = 'icon' in item ? item.icon : undefined;
@@ -0,0 +1,40 @@
import { describe, expect, it } from 'bun:test';
import { isPageTitleMatch } from './isPageTitleMatch';
describe('isPageTitleMatch', () => {
it('matches when every query word is a substring of the title', () => {
expect(isPageTitleMatch('EDR Integrations', 'EDR Integrations')).toBe(true);
});
it('is case-insensitive', () => {
expect(isPageTitleMatch('edr integrations', 'EDR Integrations')).toBe(true);
});
it('matches when the title contains the query as part of a longer title', () => {
expect(isPageTitleMatch('EDR', 'EDR Integrations')).toBe(true);
});
it('does not match a section-level query whose words are not all in the title', () => {
expect(isPageTitleMatch('selecting crowdstrike URL', 'EDR Integrations')).toBe(false);
});
it('requires every query word to appear in the title', () => {
expect(isPageTitleMatch('EDR missing', 'EDR Integrations')).toBe(false);
});
it('returns false for an empty query', () => {
expect(isPageTitleMatch('', 'EDR Integrations')).toBe(false);
});
it('returns false for a whitespace-only query', () => {
expect(isPageTitleMatch(' ', 'EDR Integrations')).toBe(false);
});
it('ignores extra whitespace between query words', () => {
expect(isPageTitleMatch(' EDR Integrations ', 'EDR Integrations')).toBe(true);
});
it('matches substrings within a title word (substring heuristic)', () => {
expect(isPageTitleMatch('api', 'Rapid start')).toBe(true);
});
});
@@ -0,0 +1,24 @@
/**
* Whether a search query matches a page by its title.
*
* There is no server-provided title-vs-section flag on search results, so we
* infer a title match the same way title scoring does in `reciprocalRankFusion`:
* a match when every whitespace-split query word appears (case-insensitively)
* as a substring of the title.
*
* Used to decide whether a result should link to the top of the page (title
* match) or keep its section anchor (section-level match).
*/
export function isPageTitleMatch(query: string, title: string): boolean {
const queryWords = query
.toLowerCase()
.split(/\s+/)
.filter((word) => word.length > 0);
if (queryWords.length === 0) {
return false;
}
const lowerTitle = title.toLowerCase();
return queryWords.every((word) => lowerTitle.includes(word));
}
@@ -14,7 +14,7 @@ function localPage(id: string, title = id): LocalPageResult {
};
}
function remotePage(id: string, title = id): OrderedComputedResult {
function remotePage(id: string, title = id, score = 0): OrderedComputedResult {
return {
type: 'page',
id: `remote-${id}`,
@@ -22,7 +22,7 @@ function remotePage(id: string, title = id): OrderedComputedResult {
spaceId: 'space',
title,
href: `/${id}`,
score: 0,
score,
breadcrumbs: [{ label: 'Remote' }],
};
}
@@ -133,7 +133,7 @@ function mergePinnedRemoteResult(
/**
* Merge local (FlexSearch) and remote (API) search results using
* Reciprocal Rank Fusion (RRF), while preserving the API order for the first
* Reciprocal Rank Fusion (RRF), while preserving the order of the first
* three remote results.
*
* RRF formula: score(d) = Σ_i 1 / (k + rank_i(d))
@@ -37,7 +37,12 @@ export type ComputedRecordResult = BaseComputedResult & {
export type SearchSiteContentScope =
| { mode: 'all' }
| { mode: 'current'; siteSpaceId: string }
| {
mode: 'current';
siteSpaceId: string;
/** Restrict the search to the current site space alone, or to the other site spaces in the scope. */
restrictTo?: 'currentSiteSpace' | 'otherSiteSpaces';
}
| { mode: 'specific'; siteSpaceIds: string[] };
export interface SearchSiteContentRequest {
@@ -0,0 +1,79 @@
'use client';
/**
* Client-side access to the `~gitbook/site-index` JSON, shared by every consumer
* (instant search in `useLocalSearchResults`, related pages on the 404 page).
*
* Loading strategy: the download starts as early as possible (server-rendered
* preload hint in `SiteLayout`, deduped here at first call) and is kept as raw
* text so the multi-MB `JSON.parse` — main-thread work — is only paid when a
* consumer actually needs the pages.
*/
export interface SiteIndexBreadcrumb {
label: string;
icon?: string;
emoji?: string;
}
/** Raw entry from the `~gitbook/site-index` JSON response */
export interface SiteIndexPage {
id: string;
title: string;
pathname: string;
siteSpaceId: string;
/** BCP-47 language code emitted by the index route, absent when no language is set. */
lang?: string;
icon?: string;
emoji?: string;
description?: string;
breadcrumbs?: SiteIndexBreadcrumb[];
}
let siteIndexText: Promise<string> | null = null;
/**
* Start (or reuse) the single-flight download of the raw index. Errors clear the
* cache so the next consumer retries.
*/
export function prefetchSiteIndex(indexURL: string): void {
fetchSiteIndexText(indexURL).catch(() => {
// Ignored: consumers surface errors when they actually read the index.
});
}
/**
* Get the parsed index pages. Parses per call (cheap for the rare second
* consumer) so the parsed object graph is never retained at module scope.
*/
export async function fetchSiteIndex(
indexURL: string
): Promise<{ version: 1; pages: SiteIndexPage[] }> {
return JSON.parse(await fetchSiteIndexText(indexURL));
}
/**
* Drop the cached raw text (several MB for large sites) once a consumer has
* turned it into a longer-lived form. Purely a memory release: a later consumer
* re-fetches, hitting the HTTP cache.
*/
export function releaseSiteIndex(): void {
siteIndexText = null;
}
function fetchSiteIndexText(indexURL: string): Promise<string> {
if (!siteIndexText) {
siteIndexText = fetch(indexURL).then((response) => {
if (!response.ok) {
throw new Error(`Failed to fetch search index: ${response.status}`);
}
return response.text();
});
siteIndexText.catch(() => {
siteIndexText = null;
});
}
return siteIndexText;
}
@@ -1,27 +1,14 @@
'use client';
import { Document, type DocumentValue } from 'flexsearch';
import type { Document, DocumentValue } from 'flexsearch';
import React from 'react';
interface Breadcrumb {
label: string;
icon?: string;
emoji?: string;
}
/** Raw entry from the `~gitbook/index` JSON response */
interface RawIndexPage {
id: string;
title: string;
pathname: string;
siteSpaceId: string;
/** BCP-47 language code emitted by the index route, absent when no language is set. */
lang?: string;
icon?: string;
emoji?: string;
description?: string;
breadcrumbs?: Breadcrumb[];
}
import {
type SiteIndexBreadcrumb,
type SiteIndexPage,
fetchSiteIndex,
prefetchSiteIndex,
releaseSiteIndex,
} from './site-index';
/** FlexSearch-compatible document type — satisfies DocumentData via explicit index signature */
interface IndexPage {
@@ -41,7 +28,7 @@ export interface LocalPageResult {
icon?: string;
emoji?: string;
description?: string;
breadcrumbs?: Breadcrumb[];
breadcrumbs?: SiteIndexBreadcrumb[];
}
type LocalSearchState = {
@@ -58,13 +45,16 @@ const cachedIndexes = new Map<string, Document<IndexPage>>();
// Keyed by page id, shared across all language groups.
const cachedPageData = new Map<
string,
{ pathname: string; icon?: string; emoji?: string; breadcrumbs?: Breadcrumb[] }
{ pathname: string; icon?: string; emoji?: string; breadcrumbs?: SiteIndexBreadcrumb[] }
>();
let pendingFetch: Promise<Map<string, Document<IndexPage>>> | null = null;
function buildLangIndex(pages: RawIndexPage[]): Document<IndexPage> {
const index = new Document<IndexPage>({
function buildLangIndex(
DocumentCtor: typeof import('flexsearch').Document,
pages: SiteIndexPage[]
): Document<IndexPage> {
const index = new DocumentCtor<IndexPage>({
document: {
id: 'id',
index: ['title', 'description'],
@@ -110,15 +100,14 @@ async function getOrBuildIndexes(indexURL: string): Promise<Map<string, Document
}
pendingFetch = (async () => {
const response = await fetch(indexURL);
if (!response.ok) {
throw new Error(`Failed to fetch search index: ${response.status}`);
}
const data: { version: 1; pages: RawIndexPage[] } = await response.json();
// FlexSearch stays in an on-demand chunk instead of the main client bundle, it's only needed once the user actually searches.
const [{ Document }, data] = await Promise.all([
import('flexsearch'),
fetchSiteIndex(indexURL),
]);
// Group pages by their `lang` value (empty string for pages without one)
const pagesByLang = new Map<string, RawIndexPage[]>();
const pagesByLang = new Map<string, SiteIndexPage[]>();
for (const page of data.pages) {
const key = page.lang ?? '';
const bucket = pagesByLang.get(key);
@@ -131,9 +120,11 @@ async function getOrBuildIndexes(indexURL: string): Promise<Map<string, Document
// Build one FlexSearch Document per language group
for (const [lang, pages] of pagesByLang) {
cachedIndexes.set(lang, buildLangIndex(pages));
cachedIndexes.set(lang, buildLangIndex(Document, pages));
}
releaseSiteIndex();
return cachedIndexes;
})();
@@ -156,8 +147,10 @@ export function useLocalSearchResults(props: {
* are returned. Uses FlexSearch native tag filtering. Omit for no filtering (all spaces). */
filterSiteSpaceIds?: string[];
disabled?: boolean;
/** Whether the search surface is open. */
open: boolean;
}): LocalSearchState {
const { query, indexURL, lang, filterSiteSpaceIds, disabled = false } = props;
const { query, indexURL, lang, filterSiteSpaceIds, disabled = false, open } = props;
const [state, setState] = React.useState<LocalSearchState>({
results: [],
@@ -168,6 +161,8 @@ export function useLocalSearchResults(props: {
// Track whether the indexes are loaded so the search effect re-runs after load
const [indexReady, setIndexReady] = React.useState(cachedIndexes.size > 0);
const active = open || Boolean(query);
// Load the indexes once
React.useEffect(() => {
if (cachedIndexes.size > 0) {
@@ -175,6 +170,12 @@ export function useLocalSearchResults(props: {
return;
}
prefetchSiteIndex(indexURL);
if (!active) {
return;
}
let cancelled = false;
setState((prev) => ({ ...prev, fetching: true, error: false }));
@@ -194,7 +195,7 @@ export function useLocalSearchResults(props: {
return () => {
cancelled = true;
};
}, [indexURL]);
}, [indexURL, active]);
// Perform instant local search whenever query, lang, or index readiness changes
React.useEffect(() => {
@@ -200,6 +200,7 @@ export function useSearchController(props: SearchBaseProps) {
const { results, fetching, error, abort } = useSearchResults({
asEmbeddable,
disabled: !(state?.query || withAI),
open: Boolean(state?.open),
query: normalizedQuery,
siteSpaceId: siteSpace.id,
siteSpaceIds,
@@ -8,7 +8,7 @@ import {
createRecommendedQuestionResult,
getEmptySearchResults,
} from './empty-search-results';
import type { OrderedComputedResult } from './search-types';
import type { OrderedComputedResult, SearchSiteContentScope } from './search-types';
import { streamRecommendedQuestions } from './server-actions';
import { useAI } from '@/components/AI';
@@ -28,6 +28,9 @@ export type ResultType =
export type { LocalPageResult, MergedPageResult };
// Score multiplier for current site space results when combined with those from other site spaces
const CURRENT_SITE_SPACE_SCORE_MULTIPLIER = 2;
// Small helper extracted for unit testing of scope → local filter mapping
// computeFilterSiteSpaceIds is imported from './filter' for testability
@@ -42,6 +45,8 @@ const cachedRecommendedQuestions: Map<string, RecommendedQuestionResult[]> = new
export function useSearchResults(props: {
asEmbeddable?: boolean;
disabled: boolean;
/** Whether the search surface is open. Gates building the local search index. */
open: boolean;
query: string;
siteSpaceId: string;
siteSpaceIds: string[];
@@ -49,7 +54,7 @@ export function useSearchResults(props: {
suggestions?: string[];
/** URL for the search API route (e.g. from linker.toPathInSpace('~gitbook/search')). */
searchURL: string;
/** URL for the local index JSON (e.g. from linker.toPathInSite('~gitbook/index')). */
/** URL for the local index JSON (e.g. from linker.toPathInSite('~gitbook/site-index')). */
indexURL: string;
/** BCP-47 language code of the current site space, used to filter local search results. */
lang?: string;
@@ -59,6 +64,7 @@ export function useSearchResults(props: {
const {
asEmbeddable,
disabled,
open,
query,
siteSpaceId,
siteSpaceIds,
@@ -82,14 +88,16 @@ export function useSearchResults(props: {
indexURL,
lang,
disabled,
open,
filterSiteSpaceIds,
});
const [remoteState, setRemoteState] = React.useState<{
results: OrderedComputedResult[];
otherSpacesResults: OrderedComputedResult[];
fetching: boolean;
error: boolean;
}>({ results: [], fetching: false, error: false });
}>({ results: [], otherSpacesResults: [], fetching: false, error: false });
// Track the current in-flight fetch so it can be aborted imperatively
// when the user navigates away before the request completes.
@@ -105,7 +113,12 @@ export function useSearchResults(props: {
}
if (!query) {
if (!withAI) {
setRemoteState({ results: [], fetching: false, error: false });
setRemoteState({
results: [],
otherSpacesResults: [],
fetching: false,
error: false,
});
return;
}
@@ -116,11 +129,21 @@ export function useSearchResults(props: {
`Cached recommended questions should be set for site-space ${siteSpaceId}`
);
// Recommended questions are stored as ResultType[] already
setRemoteState({ results: [], fetching: false, error: false });
setRemoteState({
results: [],
otherSpacesResults: [],
fetching: false,
error: false,
});
return;
}
setRemoteState({ results: [], fetching: false, error: false });
setRemoteState({
results: [],
otherSpacesResults: [],
fetching: false,
error: false,
});
let cancelled = false;
@@ -133,7 +156,12 @@ export function useSearchResults(props: {
suggestions.forEach((question) => {
questions.add(question);
});
setRemoteState({ results: [], fetching: false, error: false });
setRemoteState({
results: [],
otherSpacesResults: [],
fetching: false,
error: false,
});
return;
}
@@ -159,7 +187,12 @@ export function useSearchResults(props: {
if (!cancelled) {
// Recommended questions are handled via a separate path below
setRemoteState({ results: [], fetching: false, error: false });
setRemoteState({
results: [],
otherSpacesResults: [],
fetching: false,
error: false,
});
}
}
}, 100);
@@ -171,67 +204,121 @@ export function useSearchResults(props: {
}
setRemoteState({
results: [],
otherSpacesResults: [],
fetching: true,
error: false,
});
let cancelled = false;
const abortController = new AbortController();
const timeout = setTimeout(async () => {
try {
const results = await (() => {
const fetchSearch = (
scope: Parameters<typeof fetchSearchResults>[1]
): Promise<OrderedComputedResult[]> =>
fetchSearchResults(
searchURL,
scope,
query,
abortController.signal,
asEmbeddable
);
const fetchSearch = (
scope: Parameters<typeof fetchSearchResults>[1]
): Promise<OrderedComputedResult[]> =>
fetchSearchResults(searchURL, scope, query, abortController.signal, asEmbeddable);
try {
// Each scope resolves to a primary search request and, for the default scope
// on a multi-section site, a secondary request for the other site spaces
const { resultsPromise, otherSpacesResultsPromise } = ((): {
resultsPromise: Promise<OrderedComputedResult[]>;
otherSpacesResultsPromise?: Promise<OrderedComputedResult[]>;
} => {
switch (scope) {
case 'all':
// Search all content on the site
return fetchSearch({ mode: 'all' });
return { resultsPromise: fetchSearch({ mode: 'all' }) };
case 'default':
// Search the current section's variant + matched/default variant for other sections
return fetchSearch({ mode: 'current', siteSpaceId });
// Search the current section's variant + matched/default variant for other sections.
// Without sections, the scope resolves to the current site space alone, so a
// second request restricted to the other site spaces would be redundant.
if (!withSections) {
return {
resultsPromise: fetchSearch({ mode: 'current', siteSpaceId }),
};
}
// Split into two parallel requests so the (smaller, faster) current site
// space results can be shown while the other site spaces are still being searched.
return {
resultsPromise: fetchSearch({
mode: 'current',
siteSpaceId,
restrictTo: 'currentSiteSpace',
}),
otherSpacesResultsPromise: fetchSearch({
mode: 'current',
siteSpaceId,
restrictTo: 'otherSiteSpaces',
}),
};
case 'extended':
// Search all variants of the current section
return fetchSearch({ mode: 'specific', siteSpaceIds });
return {
resultsPromise: fetchSearch({ mode: 'specific', siteSpaceIds }),
};
case 'current':
// Search only the current section's current variant
return fetchSearch({ mode: 'specific', siteSpaceIds: [siteSpaceId] });
return {
resultsPromise: fetchSearch({
mode: 'specific',
siteSpaceIds: [siteSpaceId],
}),
};
default:
assertNever(scope);
}
})();
// Render each result set as soon as its response arrives; a failed
// request reports an error without discarding the other result set.
let tracked = false;
const onResults =
(key: 'results' | 'otherSpacesResults') =>
(results: OrderedComputedResult[]) => {
if (cancelled) {
return;
}
if (!results) {
// Can happen when the route cannot be found and returns the page's html.
setRemoteState((prev) => ({ ...prev, error: true }));
return;
}
setRemoteState((prev) => ({ ...prev, [key]: results }));
if (!tracked) {
tracked = true;
trackEvent({ type: 'search_type_query', query });
}
};
const onError = () => {
if (cancelled) {
return;
}
setRemoteState((prev) => ({ ...prev, error: true }));
};
await Promise.all([
resultsPromise.then(onResults('results'), onError),
otherSpacesResultsPromise?.then(onResults('otherSpacesResults'), onError),
]);
if (cancelled) {
return;
}
if (!results) {
// One time when this one returns undefined is when it cannot find the server action and returns the html from the page.
// In that case, we want to avoid being stuck in a loading state, but it is an error.
// We could potentially try to force reload the page here, but i'm not 100% sure it would be a better experience.
setRemoteState({ results: [], fetching: false, error: true });
return;
}
setRemoteState({ results, fetching: false, error: false });
trackEvent({
type: 'search_type_query',
query,
});
setRemoteState((prev) => ({ ...prev, fetching: false }));
} catch {
// If there is an error, we need to catch it to avoid infinite loading state.
if (cancelled) {
return;
}
setRemoteState({ results: [], fetching: false, error: true });
setRemoteState({
results: [],
otherSpacesResults: [],
fetching: false,
error: true,
});
}
}, 200);
@@ -258,6 +345,7 @@ export function useSearchResults(props: {
suggestions,
searchURL,
asEmbeddable,
withSections,
]);
const abort = React.useCallback(() => {
@@ -284,10 +372,23 @@ export function useSearchResults(props: {
});
}
const merged = reciprocalRankFusion(localResults, remoteState.results, query);
return merged;
}, [localResults, remoteState.results, query, withAI, siteSpaceId, suggestions, recentQueries]);
return reciprocalRankFusion(
localResults,
remoteState.otherSpacesResults.length > 0
? combineRemoteResults(remoteState.results, remoteState.otherSpacesResults)
: remoteState.results,
query
);
}, [
localResults,
remoteState.results,
remoteState.otherSpacesResults,
query,
withAI,
siteSpaceId,
suggestions,
recentQueries,
]);
return {
results,
@@ -302,10 +403,7 @@ export function useSearchResults(props: {
*/
async function fetchSearchResults(
searchURL: string,
scope:
| { mode: 'all' }
| { mode: 'current'; siteSpaceId: string }
| { mode: 'specific'; siteSpaceIds: string[] },
scope: SearchSiteContentScope,
query: string,
signal?: AbortSignal,
asEmbeddable?: boolean
@@ -327,3 +425,16 @@ async function fetchSearchResults(
return response.json() as Promise<OrderedComputedResult[]>;
}
function combineRemoteResults(
remoteResultsCurrentSpace: OrderedComputedResult[],
remoteResultsOtherSpaces: OrderedComputedResult[]
): OrderedComputedResult[] {
return [
...remoteResultsCurrentSpace.map((result) => ({
...result,
score: result.score * CURRENT_SITE_SPACE_SCORE_MULTIPLIER,
})),
...remoteResultsOtherSpaces,
].sort((a, b) => b.score - a.score);
}
@@ -39,10 +39,13 @@ export async function SiteLayout(props: {
ReactDOM.preconnect(GITBOOK_ASSETS_URL);
}
// We also preload the site index
// Start the search-index download from the HTML itself. `crossOrigin` must match the
// client `fetch()` (cors + same-origin credentials) or the preload is ignored and the
// index downloads twice — the omission was exactly that bug before.
ReactDOM.preload(`${context.linker.siteBasePath}~gitbook/site-index`, {
as: 'fetch',
type: 'application/json',
crossOrigin: 'anonymous',
});
scripts.forEach(({ script }) => {
@@ -0,0 +1,93 @@
'use client';
import { useState, useTransition } from 'react';
import { Button } from '@/components/primitives/Button';
import { Checkbox } from '@/components/primitives/Checkbox';
import { tcls } from '@/lib/tailwind';
import { type SubmitConsentInput, submitSiteOAuthConsent } from './actions';
/**
* Site's OAuth consent form to present to the user the client's information requesting access to the site's MCP.
*/
export function ConsentForm(props: {
siteId: string;
consentSessionId: string;
/** Whether the OAuth server recognizes the client as verified. */
verified: boolean;
}) {
const { siteId, consentSessionId, verified } = props;
const [isPending, startTransition] = useTransition();
const [error, setError] = useState<string>();
const [trusted, setTrusted] = useState(false);
// Unverified clients can only be approved once the visitor explicitly acknowledges they trust
// the app. The OAuth server re-checks this, so it can't be bypassed by tampering with the client.
const canApprove = verified || trusted;
const decide = (decision: SubmitConsentInput['decision']) => {
setError(undefined);
startTransition(async () => {
const result = await submitSiteOAuthConsent({
siteId,
consentSessionId,
decision,
trusted,
});
if ('redirectURL' in result) {
// Full-page navigation to the client's (external) redirect URI.
window.location.href = result.redirectURL;
} else {
setError(result.error);
}
});
};
return (
<div className="flex flex-col gap-3">
{error ? (
<p role="alert" className="text-danger-strong text-sm">
{error}
</p>
) : null}
<div className="flex flex-wrap items-center justify-between gap-x-4 gap-y-3">
{verified ? (
<span />
) : (
<label
htmlFor="site-oauth-trusted"
className="flex items-center gap-2 text-sm text-tint"
>
<Checkbox
id="site-oauth-trusted"
checked={trusted}
onCheckedChange={(value) => setTrusted(value === true)}
/>
<span>I recognize and trust this client</span>
</label>
)}
<div className={tcls('ms-auto flex gap-2')}>
<Button
variant="secondary"
icon="xmark"
disabled={isPending}
onClick={() => decide('deny')}
>
Deny
</Button>
<Button
variant="primary"
icon="check"
disabled={isPending || !canApprove}
onClick={() => decide('approve')}
>
Approve
</Button>
</div>
</div>
</div>
);
}
@@ -0,0 +1,203 @@
import { Icon } from '@gitbook/icons';
import { StyledLink } from '@/components/primitives/StyledLink';
import type { SiteOAuthConsentStart } from '@/lib/site-oauth';
import { tcls } from '@/lib/tailwind';
import { ConsentForm } from './ConsentForm';
/**
* Consent screen shown to a visitor when an MCP client requests authorization to a published site.
*/
export function ConsentScreen(props: {
siteId: string;
siteTitle: string;
consent: SiteOAuthConsentStart;
}) {
const { siteId, siteTitle, consent } = props;
const { client, redirectUri, consentSessionId } = consent;
const redirectParts = parseRedirectURI(redirectUri);
return (
<ConsentCard>
<div className="flex flex-col gap-6 p-6 sm:p-8">
{/* Client identity */}
<div className="flex items-start gap-3">
{client.logoUri ? (
<img
src={client.logoUri}
alt=""
className="size-10 shrink-0 rounded-corners:rounded-lg straight-corners:rounded-none object-contain"
referrerPolicy="no-referrer"
/>
) : (
<span className="flex size-10 shrink-0 items-center justify-center rounded-corners:rounded-lg straight-corners:rounded-none bg-tint-subtle text-tint">
<Icon icon="key" className="size-5" />
</span>
)}
<div className="flex min-w-0 flex-col gap-0.5">
<div className="flex flex-wrap items-center gap-x-2 gap-y-1">
<h1 className="font-semibold text-tint-strong">{client.name}</h1>
<ClientTrustBadge verified={client.verified} />
</div>
{client.uri ? (
<StyledLink
href={client.uri}
className="inline-flex w-fit items-center gap-1 text-sm text-tint"
>
Website
<Icon icon="arrow-up-right" className="size-3" />
</StyledLink>
) : null}
</div>
</div>
{/* Request statement — toned down, with the client and site names emphasized. */}
<p className="text-base text-tint leading-snug">
<span className="font-semibold text-tint-strong">{client.name}</span> wants to
access <span className="font-semibold text-tint-strong">{siteTitle} MCP</span>{' '}
on your behalf.
</p>
{/* Redirect URI, shown in full with the destination host emphasized. */}
<div className="flex flex-col gap-2">
<span className="text-sm text-tint">
After approving, an authorization code will be sent to:
</span>
<div
className={tcls(
'flex items-center gap-2.5',
'rounded-corners:rounded-md straight-corners:rounded-none',
'border border-tint-subtle bg-tint-subtle px-3 py-2'
)}
>
<Icon icon="link" className="size-4 shrink-0 text-tint" />
<code className="break-all font-mono text-sm">
{redirectParts ? (
<>
<span className="text-tint">{redirectParts.prefix}</span>
<span className="font-semibold text-tint-strong">
{redirectParts.host}
</span>
<span className="text-tint">{redirectParts.rest}</span>
</>
) : (
<span className="text-tint-strong">{redirectUri}</span>
)}
</code>
</div>
</div>
{client.verified ? null : (
<div
className={tcls(
'flex gap-3',
'rounded-corners:rounded-md straight-corners:rounded-none',
'bg-warning p-3 text-sm text-warning-strong'
)}
>
<Icon icon="triangle-exclamation" className="mt-0.5 size-4 shrink-0" />
<div className="flex flex-col gap-1">
<span className="font-semibold">
GitBook has not verified this client
</span>
<span>
Only approve if you recognize this application and trust it with
access to {siteTitle}.
</span>
</div>
</div>
)}
</div>
{/* Footer: trust acknowledgement + decision */}
<div className="border-tint-subtle border-t p-4 sm:px-8">
<ConsentForm
siteId={siteId}
consentSessionId={consentSessionId}
verified={client.verified}
/>
</div>
</ConsentCard>
);
}
/**
* Centered, branded card shell shared by the consent screen and its error state.
*/
function ConsentCard(props: { children: React.ReactNode }) {
return (
<main className="flex min-h-screen items-center justify-center bg-tint-subtle p-4">
<div
className={tcls(
'w-full max-w-lg',
'flex flex-col',
'rounded-corners:rounded-lg straight-corners:rounded-none',
'border border-tint-subtle bg-tint-base',
'shadow-lg'
)}
>
{props.children}
</div>
</main>
);
}
/**
* Error state shown when the consent flow cannot be started (e.g. a refreshed or expired link).
*/
export function ConsentError(props: { title?: string; message?: string }) {
const {
title = 'This authorization link has expired',
message = 'Please start the sign-in again from the application.',
} = props;
return (
<ConsentCard>
<div className="flex flex-col items-center gap-4 p-6 text-center sm:p-8">
<span className="flex size-12 items-center justify-center rounded-corners:rounded-full straight-corners:rounded-none bg-danger text-danger-strong">
<Icon icon="circle-exclamation" className="size-6" />
</span>
<h1 className="font-semibold text-lg text-tint-strong">{title}</h1>
<p className="text-tint">{message}</p>
</div>
</ConsentCard>
);
}
/**
* Split a redirect URI so the destination host (the trust-relevant part) can be emphasized while
* the scheme and path are shown muted. Returns null if the URI can't be parsed.
*/
function parseRedirectURI(uri: string): { prefix: string; host: string; rest: string } | null {
try {
const url = new URL(uri);
return {
prefix: `${url.protocol}//`,
host: url.host,
rest: `${url.pathname}${url.search}${url.hash}`,
};
} catch {
return null;
}
}
/**
* Inline verified/unverified indicator shown next to the client name.
*/
function ClientTrustBadge(props: { verified: boolean }) {
const { verified } = props;
return (
<span
className={tcls(
'inline-flex items-center gap-1 font-medium text-xs',
verified ? 'text-success-strong' : 'text-warning-strong'
)}
>
<Icon icon={verified ? 'circle-check' : 'triangle-exclamation'} className="size-3" />
{verified ? 'Verified' : 'Unverified'}
</span>
);
}
@@ -0,0 +1,39 @@
'use server';
import { type SiteOAuthConsentDecision, submitSiteOAuthConsentDecision } from '@/lib/site-oauth';
export type SubmitConsentInput = {
siteId: string;
consentSessionId: string;
decision: SiteOAuthConsentDecision;
trusted: boolean;
};
export type SubmitConsentResult = { redirectURL: string } | { error: string };
/**
* Server action to submit the consent decision to the sites OAuth server's `consent/decision` endpoint.
*/
export async function submitSiteOAuthConsent(
input: SubmitConsentInput
): Promise<SubmitConsentResult> {
const { siteId, consentSessionId, decision, trusted } = input;
if (!siteId || !consentSessionId || (decision !== 'approve' && decision !== 'deny')) {
return { error: 'Invalid request. Please start again from the application.' };
}
try {
const { redirectURL } = await submitSiteOAuthConsentDecision({
siteId,
consentSessionId,
decision,
trusted,
});
return { redirectURL };
} catch (_error) {
return {
error: 'We could not complete the authorization. The request may have expired — please start again from the application.',
};
}
}
@@ -0,0 +1 @@
export { ConsentScreen, ConsentError } from './ConsentScreen';
@@ -11,6 +11,7 @@ import { useEffect, useState } from 'react';
import { useAI } from '../AI';
import { PreservePageLayout } from '../PageBody/PreservePageLayout';
import { useSetSearchState } from '../Search';
import { fetchSiteIndex } from '../Search/site-index';
import { SiteAuthLoginButton } from '../SiteAuth/SiteAuthLoginLink';
import {
useSiteAdaptiveAuthLoginHref,
@@ -229,34 +230,21 @@ function NotFoundSuggestions(props: { suggestions: RelatedPage[] | null }) {
) : null;
}
/** Minimal shape of an entry in the `~gitbook/site-index` response. */
type IndexPage = {
id: string;
title: string;
pathname: string;
siteSpaceId: string;
icon?: string;
emoji?: string;
};
/**
* Return the pages whose path is closest to the one that 404'd.
*
* Rather than asking the server (which would mean an extra request per 404), this reuses the
* search index served at `~gitbook/site-index` — already preloaded and CDN-cached on every page —
* so it's a cache hit, not an origin request. The ranking is a lighter, client-side cousin of
* `getSimilarPages` (which the Markdown 404 runs server-side from the full page tree).
* search index served at `~gitbook/site-index` — preloaded on every page and shared with
* instant search via the module cache in `site-index.ts`, so at most one request is made.
* The ranking is a lighter, client-side cousin of `getSimilarPages` (which the Markdown 404
* runs server-side from the full page tree).
*/
async function getRelatedPages(
indexURL: string,
requestedPath: string,
siteSpaceId: string | null
): Promise<RelatedPage[]> {
const response = await fetch(indexURL);
if (!response.ok) {
return [];
}
const { pages } = (await response.json()) as { pages: IndexPage[] };
const { pages } = await fetchSiteIndex(indexURL);
return pages
.filter((page) => !siteSpaceId || page.siteSpaceId === siteSpaceId)
@@ -88,7 +88,10 @@ export function SpaceLayoutServerContext(props: SpaceLayoutProps) {
visitorCookieTrackingEnabled={customization.insights?.trackingCookie}
>
<InsightsProvider enabled={withTracking} eventUrl={eventUrl.toString()}>
<AIChatProvider renderMessageOptions={aiChatRenderMessageOptions}>
<AIChatProvider
renderMessageOptions={aiChatRenderMessageOptions}
withPageFeedback={customization.feedback.enabled}
>
{children}
</AIChatProvider>
</InsightsProvider>
@@ -0,0 +1,104 @@
'use client';
import * as React from 'react';
import { useScrollListener } from './useScrollListener';
/**
* Track the scroll position and overflow amount of a scrollable container,
* keeping them in sync with scroll events, resizes, and content changes.
*/
export function useScrollOverflow(
orientation: 'horizontal' | 'vertical',
containerRef: React.RefObject<HTMLElement | null>
) {
const [scrollPosition, setScrollPosition] = React.useState(0);
const [scrollSize, setScrollSize] = React.useState(0);
const measure = React.useCallback(() => {
const container = containerRef.current;
if (!container) {
return;
}
const scrollDimension =
orientation === 'horizontal' ? container.scrollWidth : container.scrollHeight;
const clientDimension =
orientation === 'horizontal' ? container.clientWidth : container.clientHeight;
setScrollSize(Math.max(scrollDimension - clientDimension - 1, 0));
setScrollPosition(
orientation === 'horizontal' ? container.scrollLeft : container.scrollTop
);
}, [orientation, containerRef]);
useScrollListener(measure, containerRef);
// Measure synchronously on mount (and when the container/orientation changes), so
// initial overflow is detected without waiting for a resize/scroll event. Subsequent
// content changes are picked up by the observers below instead of re-measuring on
// every render.
React.useLayoutEffect(() => {
measure();
}, [measure]);
React.useEffect(() => {
const container = containerRef.current;
if (!container) {
return;
}
// Children can overflow (or stop overflowing) without the container itself
// changing size, so we observe the direct children in addition to the container,
// and re-register observers as children are added/removed.
let frame: number | null = null;
const scheduleMeasure = () => {
if (frame !== null) {
return;
}
frame = requestAnimationFrame(() => {
frame = null;
measure();
});
};
const ro = new ResizeObserver(scheduleMeasure);
ro.observe(container);
for (const child of Array.from(container.children)) {
ro.observe(child);
}
const mo = new MutationObserver((mutations) => {
for (const mutation of mutations) {
// Only re-register direct children with the resize observer; descendants
// deeper in the tree are covered by their parent's resize/mutation handling.
if (mutation.target !== container) {
continue;
}
for (const node of Array.from(mutation.addedNodes)) {
if (node instanceof Element) {
ro.observe(node);
}
}
for (const node of Array.from(mutation.removedNodes)) {
if (node instanceof Element) {
ro.unobserve(node);
}
}
}
scheduleMeasure();
});
// Also watch descendants (subtree/characterData) so text/content changes deeper in
// the tree that grow or shrink scrollHeight/scrollWidth still trigger a re-measure.
mo.observe(container, { childList: true, subtree: true, characterData: true });
return () => {
if (frame !== null) {
cancelAnimationFrame(frame);
}
ro.disconnect();
mo.disconnect();
};
}, [measure, containerRef]);
return { scrollPosition, scrollSize };
}
@@ -85,7 +85,9 @@ function scrollToHash(hash: string) {
if (element) {
element.scrollIntoView({
block: 'start',
behavior: 'smooth',
// Looks like there is a bug when using smooth scroll on navigation between pages.
// The browser does not scroll, probably some kind of browser optimization.
behavior: 'instant',
});
return true;
}
@@ -3,7 +3,7 @@
import { tString, useLanguage } from '@/intl/client';
import { tcls } from '@/lib/tailwind';
import * as React from 'react';
import { useScrollListener } from '../hooks/useScrollListener';
import { useScrollOverflow } from '../hooks/useScrollOverflow';
import { Button, type ButtonProps } from './Button';
/**
@@ -56,50 +56,9 @@ export function ScrollContainer(props: ScrollContainerProps) {
const containerRef = React.useRef<HTMLDivElement>(null);
const [scrollPosition, setScrollPosition] = React.useState(0);
const [scrollSize, setScrollSize] = React.useState(0);
const language = useLanguage();
useScrollListener(() => {
const container = containerRef.current;
if (!container) {
return;
}
setScrollSize(
orientation === 'horizontal'
? container.scrollWidth - container.clientWidth - 1
: container.scrollHeight - container.clientHeight - 1
);
setScrollPosition(
orientation === 'horizontal' ? container.scrollLeft : container.scrollTop
);
}, containerRef);
React.useEffect(() => {
const container = containerRef.current;
if (!container) {
return;
}
// Update max scroll position using resize observer
const ro = new ResizeObserver((entries) => {
const [entry] = entries;
if (entry) {
setScrollSize(
orientation === 'horizontal'
? entry.target.scrollWidth - entry.target.clientWidth - 1
: entry.target.scrollHeight - entry.target.clientHeight - 1
);
}
});
ro.observe(container);
return () => ro.disconnect();
}, [orientation]);
const { scrollPosition, scrollSize } = useScrollOverflow(orientation, containerRef);
React.useEffect(() => {
const container = containerRef.current;
@@ -145,6 +145,8 @@ export const ar: TranslationLanguage = {
ai_chat_tools_read_page: 'تمت قراءة الصفحة ${1}',
ai_chat_tools_navigated_to_page: 'تم فتح الصفحة',
ai_chat_tools_navigate_failed: 'تعذّر فتح الصفحة',
ai_chat_tools_submit_feedback: 'إرسال الملاحظات',
ai_chat_tools_submitted_feedback: 'تم إرسال ملاحظاتك',
ai_chat_tools_mcp_tool: 'تم استدعاء ${1}',
ai_chat_ask: 'اسأل ${1}',
ai_chat_ask_about: 'اسأل ${1} عن ${2}',
@@ -149,6 +149,8 @@ export const bg: TranslationLanguage = {
ai_chat_tools_read_page: 'Прочете страница ${1}',
ai_chat_tools_navigated_to_page: 'Страницата е отворена',
ai_chat_tools_navigate_failed: 'Страницата не може да бъде отворена',
ai_chat_tools_submit_feedback: 'Изпращане на обратна връзка',
ai_chat_tools_submitted_feedback: 'Обратната връзка е изпратена',
ai_chat_tools_mcp_tool: 'Извика ${1}',
ai_chat_ask: 'Попитайте ${1}',
ai_chat_ask_about: 'Попитайте ${1} за ${2}',
@@ -147,6 +147,8 @@ export const cs: TranslationLanguage = {
ai_chat_tools_read_page: 'Přečetl stránku ${1}',
ai_chat_tools_navigated_to_page: 'Stránka otevřena',
ai_chat_tools_navigate_failed: 'Stránku se nepodařilo otevřít',
ai_chat_tools_submit_feedback: 'Odeslat zpětnou vazbu',
ai_chat_tools_submitted_feedback: 'Zpětná vazba odeslána',
ai_chat_tools_mcp_tool: 'Zavolal ${1}',
ai_chat_ask: 'Zeptat se ${1}',
ai_chat_ask_about: 'Zeptat se ${1} na ${2}',
@@ -146,6 +146,8 @@ export const da: TranslationLanguage = {
ai_chat_tools_read_page: 'Læste side ${1}',
ai_chat_tools_navigated_to_page: 'Åbnede siden',
ai_chat_tools_navigate_failed: 'Kunne ikke åbne siden',
ai_chat_tools_submit_feedback: 'Send feedback',
ai_chat_tools_submitted_feedback: 'Feedback sendt',
ai_chat_tools_mcp_tool: 'Kaldte ${1}',
ai_chat_ask: 'Spørg ${1}',
ai_chat_ask_about: 'Spørg ${1} om ${2}',
@@ -153,6 +153,8 @@ export const de: TranslationLanguage = {
ai_chat_tools_read_page: 'Seite ${1} gelesen',
ai_chat_tools_navigated_to_page: 'Seite geöffnet',
ai_chat_tools_navigate_failed: 'Seite konnte nicht geöffnet werden',
ai_chat_tools_submit_feedback: 'Feedback senden',
ai_chat_tools_submitted_feedback: 'Feedback gesendet',
ai_chat_tools_mcp_tool: '${1} aufgerufen',
ai_chat_ask: '${1} fragen',
ai_chat_ask_about: '${1} zu ${2} befragen',
@@ -151,6 +151,8 @@ export const el: TranslationLanguage = {
ai_chat_tools_read_page: 'Διαβάστηκε η σελίδα ${1}',
ai_chat_tools_navigated_to_page: 'Άνοιξε η σελίδα',
ai_chat_tools_navigate_failed: 'Αποτυχία ανοίγματος της σελίδας',
ai_chat_tools_submit_feedback: 'Υποβολή σχολίων',
ai_chat_tools_submitted_feedback: 'Τα σχόλια υποβλήθηκαν',
ai_chat_tools_mcp_tool: 'Κλήθηκε ${1}',
ai_chat_ask: 'Ρωτήστε ${1}',
ai_chat_ask_about: 'Ρωτήστε ${1} για ${2}',
@@ -144,6 +144,8 @@ export const en = {
ai_chat_tools_read_page: 'Read page ${1}',
ai_chat_tools_navigated_to_page: 'Opened the page',
ai_chat_tools_navigate_failed: 'Failed to open the page',
ai_chat_tools_submit_feedback: 'Submit feedback',
ai_chat_tools_submitted_feedback: 'Submitted your feedback',
ai_chat_tools_mcp_tool: 'Called ${1}',
ai_chat_ask: 'Ask ${1}',
ai_chat_ask_about: 'Ask ${1} about ${2}',
@@ -151,6 +151,8 @@ export const es: TranslationLanguage = {
ai_chat_tools_read_page: 'Leyó la página ${1}',
ai_chat_tools_navigated_to_page: 'Página abierta',
ai_chat_tools_navigate_failed: 'No se pudo abrir la página',
ai_chat_tools_submit_feedback: 'Enviar comentarios',
ai_chat_tools_submitted_feedback: 'Comentarios enviados',
ai_chat_tools_mcp_tool: 'Llamó a ${1}',
ai_chat_ask: 'Preguntar a ${1}',
ai_chat_ask_about: 'Preguntar a ${1} sobre ${2}',
@@ -146,6 +146,8 @@ export const et: TranslationLanguage = {
ai_chat_tools_read_page: 'Luges lehte ${1}',
ai_chat_tools_navigated_to_page: 'Leht avatud',
ai_chat_tools_navigate_failed: 'Lehe avamine ebaõnnestus',
ai_chat_tools_submit_feedback: 'Saada tagasiside',
ai_chat_tools_submitted_feedback: 'Tagasiside saadetud',
ai_chat_tools_mcp_tool: 'Kutsus ${1}',
ai_chat_ask: 'Küsi ${1}',
ai_chat_ask_about: 'Küsi ${1}: ${2}',
@@ -148,6 +148,8 @@ export const fi: TranslationLanguage = {
ai_chat_tools_read_page: 'Luettiin sivu ${1}',
ai_chat_tools_navigated_to_page: 'Sivu avattu',
ai_chat_tools_navigate_failed: 'Sivun avaaminen epäonnistui',
ai_chat_tools_submit_feedback: 'Lähetä palaute',
ai_chat_tools_submitted_feedback: 'Palaute lähetetty',
ai_chat_tools_mcp_tool: 'Kutsuttiin ${1}',
ai_chat_ask: 'Kysy ${1}',
ai_chat_ask_about: 'Kysy ${1}: ${2}',
@@ -147,6 +147,8 @@ export const fr: TranslationLanguage = {
ai_chat_tools_read_page: 'A consulté la page ${1}',
ai_chat_tools_navigated_to_page: 'Page ouverte',
ai_chat_tools_navigate_failed: "Échec de l'ouverture de la page",
ai_chat_tools_submit_feedback: 'Envoyer',
ai_chat_tools_submitted_feedback: 'Merci pour votre retour',
ai_chat_tools_mcp_tool: 'A appelé ${1}',
ai_chat_ask: 'Demander à ${1}',
ai_chat_ask_about: 'Demander à ${1} à propos de ${2}',
@@ -144,6 +144,8 @@ export const he: TranslationLanguage = {
ai_chat_tools_read_page: 'קרא את הדף ${1}',
ai_chat_tools_navigated_to_page: 'הדף נפתח',
ai_chat_tools_navigate_failed: 'פתיחת הדף נכשלה',
ai_chat_tools_submit_feedback: 'שליחת משוב',
ai_chat_tools_submitted_feedback: 'המשוב נשלח',
ai_chat_tools_mcp_tool: 'קרא ל-${1}',
ai_chat_ask: 'שאל את ${1}',
ai_chat_ask_about: 'שאל את ${1} על ${2}',
@@ -145,6 +145,8 @@ export const hi: TranslationLanguage = {
ai_chat_tools_read_page: 'पृष्ठ ${1} पढ़ा',
ai_chat_tools_navigated_to_page: 'पेज खोला गया',
ai_chat_tools_navigate_failed: 'पेज खोलने में विफल',
ai_chat_tools_submit_feedback: 'प्रतिक्रिया सबमिट करें',
ai_chat_tools_submitted_feedback: 'आपकी प्रतिक्रिया सबमिट कर दी गई',
ai_chat_tools_mcp_tool: '${1} को कॉल किया',
ai_chat_ask: '${1} से पूछें',
ai_chat_ask_about: '${1} से ${2} के बारे में पूछें',
@@ -147,6 +147,8 @@ export const hr: TranslationLanguage = {
ai_chat_tools_read_page: 'Pročitao stranicu ${1}',
ai_chat_tools_navigated_to_page: 'Stranica otvorena',
ai_chat_tools_navigate_failed: 'Stranicu nije moguće otvoriti',
ai_chat_tools_submit_feedback: 'Pošalji povratne informacije',
ai_chat_tools_submitted_feedback: 'Povratne informacije poslane',
ai_chat_tools_mcp_tool: 'Pozvao ${1}',
ai_chat_ask: 'Pitaj ${1}',
ai_chat_ask_about: 'Pitaj ${1} o ${2}',
@@ -148,6 +148,8 @@ export const hu: TranslationLanguage = {
ai_chat_tools_read_page: '${1} oldal elolvasva',
ai_chat_tools_navigated_to_page: 'Oldal megnyitva',
ai_chat_tools_navigate_failed: 'Az oldal megnyitása sikertelen',
ai_chat_tools_submit_feedback: 'Visszajelzés küldése',
ai_chat_tools_submitted_feedback: 'Visszajelzés elküldve',
ai_chat_tools_mcp_tool: '${1} meghívva',
ai_chat_ask: '${1} kérdezése',
ai_chat_ask_about: '${1} megkérdezése ${2} témában',
@@ -146,6 +146,8 @@ export const id: TranslationLanguage = {
ai_chat_tools_read_page: 'Membaca halaman ${1}',
ai_chat_tools_navigated_to_page: 'Halaman dibuka',
ai_chat_tools_navigate_failed: 'Gagal membuka halaman',
ai_chat_tools_submit_feedback: 'Kirim masukan',
ai_chat_tools_submitted_feedback: 'Masukan terkirim',
ai_chat_tools_mcp_tool: 'Memanggil ${1}',
ai_chat_ask: 'Tanya ${1}',
ai_chat_ask_about: 'Tanya ${1} tentang ${2}',
@@ -150,6 +150,8 @@ export const it: TranslationLanguage = {
ai_chat_tools_read_page: 'Ha letto la pagina ${1}',
ai_chat_tools_navigated_to_page: 'Pagina aperta',
ai_chat_tools_navigate_failed: 'Impossibile aprire la pagina',
ai_chat_tools_submit_feedback: 'Invia feedback',
ai_chat_tools_submitted_feedback: 'Feedback inviato',
ai_chat_tools_mcp_tool: 'Ha chiamato ${1}',
ai_chat_ask: 'Chiedi a ${1}',
ai_chat_ask_about: 'Chiedi a ${1} riguardo a ${2}',
@@ -147,6 +147,8 @@ export const ja: TranslationLanguage = {
ai_chat_tools_read_page: 'ページ ${1} を読みました',
ai_chat_tools_navigated_to_page: 'ページを開きました',
ai_chat_tools_navigate_failed: 'ページを開けませんでした',
ai_chat_tools_submit_feedback: 'フィードバックを送信',
ai_chat_tools_submitted_feedback: 'フィードバックを送信しました',
ai_chat_tools_mcp_tool: '${1} を呼び出しました',
ai_chat_ask: '${1} に質問する',
ai_chat_ask_about: '${1}に${2}について質問する',
@@ -146,6 +146,8 @@ export const ko: TranslationLanguage = {
ai_chat_tools_read_page: '${1} 페이지를 읽음',
ai_chat_tools_navigated_to_page: '페이지를 열었습니다',
ai_chat_tools_navigate_failed: '페이지를 열지 못했습니다',
ai_chat_tools_submit_feedback: '피드백 제출',
ai_chat_tools_submitted_feedback: '피드백을 제출했습니다',
ai_chat_tools_mcp_tool: '${1} 호출함',
ai_chat_ask: '${1}에게 질문',
ai_chat_ask_about: '${1}에게 ${2}에 대해 질문',
@@ -147,6 +147,8 @@ export const lt: TranslationLanguage = {
ai_chat_tools_read_page: 'Perskaitytas puslapis ${1}',
ai_chat_tools_navigated_to_page: 'Puslapis atidarytas',
ai_chat_tools_navigate_failed: 'Nepavyko atidaryti puslapio',
ai_chat_tools_submit_feedback: 'Siųsti atsiliepimą',
ai_chat_tools_submitted_feedback: 'Atsiliepimas išsiųstas',
ai_chat_tools_mcp_tool: 'Iškviesta ${1}',
ai_chat_ask: 'Klausti ${1}',
ai_chat_ask_about: 'Klausti ${1} apie ${2}',
@@ -145,6 +145,8 @@ export const lv: TranslationLanguage = {
ai_chat_tools_read_page: 'Izlasīja lapu ${1}',
ai_chat_tools_navigated_to_page: 'Lapa atvērta',
ai_chat_tools_navigate_failed: 'Neizdevās atvērt lapu',
ai_chat_tools_submit_feedback: 'Nosūtīt atsauksmi',
ai_chat_tools_submitted_feedback: 'Atsauksme nosūtīta',
ai_chat_tools_mcp_tool: 'Izsauca ${1}',
ai_chat_ask: 'Jautāt ${1}',
ai_chat_ask_about: 'Jautāt ${1} par ${2}',
@@ -146,6 +146,8 @@ export const ms: TranslationLanguage = {
ai_chat_tools_read_page: 'Membaca halaman ${1}',
ai_chat_tools_navigated_to_page: 'Halaman dibuka',
ai_chat_tools_navigate_failed: 'Gagal membuka halaman',
ai_chat_tools_submit_feedback: 'Hantar maklum balas',
ai_chat_tools_submitted_feedback: 'Maklum balas dihantar',
ai_chat_tools_mcp_tool: 'Memanggil ${1}',
ai_chat_ask: 'Tanya ${1}',
ai_chat_ask_about: 'Tanya ${1} tentang ${2}',
@@ -149,6 +149,8 @@ export const nl: TranslationLanguage = {
ai_chat_tools_read_page: 'Pagina ${1} gelezen',
ai_chat_tools_navigated_to_page: 'Pagina geopend',
ai_chat_tools_navigate_failed: 'Kan de pagina niet openen',
ai_chat_tools_submit_feedback: 'Feedback verzenden',
ai_chat_tools_submitted_feedback: 'Feedback verzonden',
ai_chat_tools_mcp_tool: '${1} aangeroepen',
ai_chat_ask: 'Vraag het aan ${1}',
ai_chat_ask_about: 'Stel ${1} een vraag over ${2}',
@@ -148,6 +148,8 @@ export const no: TranslationLanguage = {
ai_chat_tools_read_page: 'Leste side ${1}',
ai_chat_tools_navigated_to_page: 'Åpnet siden',
ai_chat_tools_navigate_failed: 'Kunne ikke åpne siden',
ai_chat_tools_submit_feedback: 'Send tilbakemelding',
ai_chat_tools_submitted_feedback: 'Tilbakemelding sendt',
ai_chat_tools_mcp_tool: 'Kalte ${1}',
ai_chat_ask: 'Spør ${1}',
ai_chat_ask_about: 'Spør ${1} om ${2}',
@@ -147,6 +147,8 @@ export const pl: TranslationLanguage = {
ai_chat_tools_read_page: 'Przeczytano stronę ${1}',
ai_chat_tools_navigated_to_page: 'Otwarto stronę',
ai_chat_tools_navigate_failed: 'Nie udało się otworzyć strony',
ai_chat_tools_submit_feedback: 'Wyślij opinię',
ai_chat_tools_submitted_feedback: 'Przesłano opinię',
ai_chat_tools_mcp_tool: 'Wywołano ${1}',
ai_chat_ask: 'Zapytaj ${1}',
ai_chat_ask_about: 'Zapytaj ${1} o ${2}',
@@ -151,6 +151,8 @@ export const pt_br: TranslationLanguage = {
ai_chat_tools_read_page: 'Leu a página ${1}',
ai_chat_tools_navigated_to_page: 'Página aberta',
ai_chat_tools_navigate_failed: 'Falha ao abrir a página',
ai_chat_tools_submit_feedback: 'Enviar feedback',
ai_chat_tools_submitted_feedback: 'Feedback enviado',
ai_chat_tools_mcp_tool: 'Chamou ${1}',
ai_chat_ask: 'Perguntar a ${1}',
ai_chat_ask_about: 'Perguntar a ${1} sobre ${2}',
@@ -148,6 +148,8 @@ export const pt: TranslationLanguage = {
ai_chat_tools_read_page: 'Leu a página ${1}',
ai_chat_tools_navigated_to_page: 'Página aberta',
ai_chat_tools_navigate_failed: 'Falha ao abrir a página',
ai_chat_tools_submit_feedback: 'Enviar feedback',
ai_chat_tools_submitted_feedback: 'Feedback enviado',
ai_chat_tools_mcp_tool: 'Chamou ${1}',
ai_chat_ask: 'Perguntar a ${1}',
ai_chat_ask_about: 'Perguntar a ${1} sobre ${2}',
@@ -150,6 +150,8 @@ export const ro: TranslationLanguage = {
ai_chat_tools_read_page: 'A citit pagina ${1}',
ai_chat_tools_navigated_to_page: 'Pagina a fost deschisă',
ai_chat_tools_navigate_failed: 'Deschiderea paginii a eșuat',
ai_chat_tools_submit_feedback: 'Trimite feedback',
ai_chat_tools_submitted_feedback: 'Feedback trimis',
ai_chat_tools_mcp_tool: 'A apelat ${1}',
ai_chat_ask: 'Întreabă ${1}',
ai_chat_ask_about: 'Întreabă ${1} despre ${2}',
@@ -150,6 +150,8 @@ export const ru: TranslationLanguage = {
ai_chat_tools_read_page: 'Прочитана страница ${1}',
ai_chat_tools_navigated_to_page: 'Страница открыта',
ai_chat_tools_navigate_failed: 'Не удалось открыть страницу',
ai_chat_tools_submit_feedback: 'Отправить отзыв',
ai_chat_tools_submitted_feedback: 'Отзыв отправлен',
ai_chat_tools_mcp_tool: 'Вызван ${1}',
ai_chat_ask: 'Спросить у ${1}',
ai_chat_ask_about: 'Спросить у ${1} о ${2}',
@@ -149,6 +149,8 @@ export const sk: TranslationLanguage = {
ai_chat_tools_read_page: 'Prečítal stránku ${1}',
ai_chat_tools_navigated_to_page: 'Stránka otvorená',
ai_chat_tools_navigate_failed: 'Stránku sa nepodarilo otvoriť',
ai_chat_tools_submit_feedback: 'Odoslať spätnú väzbu',
ai_chat_tools_submitted_feedback: 'Spätná väzba odoslaná',
ai_chat_tools_mcp_tool: 'Zavolal ${1}',
ai_chat_ask: 'Opýtať sa ${1}',
ai_chat_ask_about: 'Opýtať sa ${1} na ${2}',
@@ -147,6 +147,8 @@ export const sl: TranslationLanguage = {
ai_chat_tools_read_page: 'Prebrana stran ${1}',
ai_chat_tools_navigated_to_page: 'Stran odprta',
ai_chat_tools_navigate_failed: 'Strani ni bilo mogoče odpreti',
ai_chat_tools_submit_feedback: 'Pošlji povratne informacije',
ai_chat_tools_submitted_feedback: 'Povratne informacije poslane',
ai_chat_tools_mcp_tool: 'Poklicano ${1}',
ai_chat_ask: 'Vprašaj ${1}',
ai_chat_ask_about: 'Vprašaj ${1} o ${2}',
@@ -147,6 +147,8 @@ export const sv: TranslationLanguage = {
ai_chat_tools_read_page: 'Läste sidan ${1}',
ai_chat_tools_navigated_to_page: 'Öppnade sidan',
ai_chat_tools_navigate_failed: 'Det gick inte att öppna sidan',
ai_chat_tools_submit_feedback: 'Skicka feedback',
ai_chat_tools_submitted_feedback: 'Feedback skickad',
ai_chat_tools_mcp_tool: 'Anropade ${1}',
ai_chat_ask: 'Fråga ${1}',
ai_chat_ask_about: 'Fråga ${1} om ${2}',
@@ -143,6 +143,8 @@ export const th: TranslationLanguage = {
ai_chat_tools_read_page: 'อ่านหน้า ${1}',
ai_chat_tools_navigated_to_page: 'เปิดหน้าแล้ว',
ai_chat_tools_navigate_failed: 'ไม่สามารถเปิดหน้าได้',
ai_chat_tools_submit_feedback: 'ส่งความคิดเห็น',
ai_chat_tools_submitted_feedback: 'ส่งความคิดเห็นแล้ว',
ai_chat_tools_mcp_tool: 'เรียกใช้ ${1}',
ai_chat_ask: 'ถาม ${1}',
ai_chat_ask_about: 'ถาม ${1} เกี่ยวกับ ${2}',
@@ -145,6 +145,8 @@ export const tr: TranslationLanguage = {
ai_chat_tools_read_page: '${1} sayfası okundu',
ai_chat_tools_navigated_to_page: 'Sayfa açıldı',
ai_chat_tools_navigate_failed: 'Sayfa açılamadı',
ai_chat_tools_submit_feedback: 'Geri bildirim gönder',
ai_chat_tools_submitted_feedback: 'Geri bildiriminiz gönderildi',
ai_chat_tools_mcp_tool: '${1} çağrıldı',
ai_chat_ask: '${1} sor',
ai_chat_ask_about: '${1} için ${2} hakkında sor',
@@ -145,6 +145,8 @@ export const uk: TranslationLanguage = {
ai_chat_tools_read_page: 'Прочитано сторінку ${1}',
ai_chat_tools_navigated_to_page: 'Сторінку відкрито',
ai_chat_tools_navigate_failed: 'Не вдалося відкрити сторінку',
ai_chat_tools_submit_feedback: 'Надіслати відгук',
ai_chat_tools_submitted_feedback: 'Відгук надіслано',
ai_chat_tools_mcp_tool: 'Викликано ${1}',
ai_chat_ask: 'Запитати ${1}',
ai_chat_ask_about: 'Запитати ${1} про ${2}',
@@ -145,6 +145,8 @@ export const vi: TranslationLanguage = {
ai_chat_tools_read_page: 'Đã đọc trang ${1}',
ai_chat_tools_navigated_to_page: 'Đã mở trang',
ai_chat_tools_navigate_failed: 'Không thể mở trang',
ai_chat_tools_submit_feedback: 'Gửi phản hồi',
ai_chat_tools_submitted_feedback: 'Đã gửi phản hồi',
ai_chat_tools_mcp_tool: 'Đã gọi ${1}',
ai_chat_ask: 'Hỏi ${1}',
ai_chat_ask_about: 'Hỏi ${1} về ${2}',
@@ -142,6 +142,8 @@ export const yue: TranslationLanguage = {
ai_chat_tools_read_page: '已閱讀頁面 ${1}',
ai_chat_tools_navigated_to_page: '已開啟頁面',
ai_chat_tools_navigate_failed: '無法開啟頁面',
ai_chat_tools_submit_feedback: '提交反饋',
ai_chat_tools_submitted_feedback: '已提交反饋',
ai_chat_tools_mcp_tool: '已呼叫 ${1}',
ai_chat_ask: '問 ${1}',
ai_chat_ask_about: '問 ${1} 關於${2}',
@@ -142,6 +142,8 @@ export const zh_tw: TranslationLanguage = {
ai_chat_tools_read_page: '已閱讀頁面 ${1}',
ai_chat_tools_navigated_to_page: '已開啟頁面',
ai_chat_tools_navigate_failed: '無法開啟頁面',
ai_chat_tools_submit_feedback: '提交意見回饋',
ai_chat_tools_submitted_feedback: '已提交意見回饋',
ai_chat_tools_mcp_tool: '已呼叫 ${1}',
ai_chat_ask: '詢問 ${1}',
ai_chat_ask_about: '詢問 ${1} 關於${2}',
@@ -143,6 +143,8 @@ export const zh: TranslationLanguage = {
ai_chat_tools_read_page: '已读取页面 ${1}',
ai_chat_tools_navigated_to_page: '已打开页面',
ai_chat_tools_navigate_failed: '无法打开页面',
ai_chat_tools_submit_feedback: '提交反馈',
ai_chat_tools_submitted_feedback: '已提交反馈',
ai_chat_tools_mcp_tool: '调用了 ${1}',
ai_chat_ask: '向 ${1} 提问',
ai_chat_ask_about: '向 ${1} 询问${2}',
@@ -0,0 +1,128 @@
import { describe, expect, it } from 'bun:test';
import {
MAX_API_TOKEN_COOKIE_LENGTH,
getAPITokenFromCookies,
getAPITokenResponseCookies,
} from './api-token-cookie';
const cookieName = 'gitbook-api-token~test';
const options = {
httpOnly: true,
sameSite: 'none' as const,
secure: true,
maxAge: 60 * 60,
};
describe('API token cookies', () => {
it('keeps tokens at the cookie limit in one cookie', () => {
const apiToken = 'a'.repeat(4_000);
expect(getAPITokenResponseCookies({ cookies: [], cookieName, apiToken, options })).toEqual([
{ name: cookieName, value: apiToken, options },
]);
});
it('splits and reconstructs oversized tokens', () => {
const apiToken = `${'a'.repeat(4_000)}b`;
const cookies = getAPITokenResponseCookies({ cookies: [], cookieName, apiToken, options });
expect(cookies).toEqual([
{ name: cookieName, value: 'chunks:2', options },
{ name: `${cookieName}-0`, value: 'a'.repeat(4_000), options },
{ name: `${cookieName}-1`, value: 'b', options },
]);
expect(getAPITokenFromCookies(cookies, cookieName)).toBe(apiToken);
});
it('rejects tokens that would exceed the response cookie header limit', () => {
expect(() =>
getAPITokenResponseCookies({
cookies: [],
cookieName,
apiToken: 'a'.repeat(MAX_API_TOKEN_COOKIE_LENGTH + 1),
options,
})
).toThrow(`API token exceeds the ${MAX_API_TOKEN_COOKIE_LENGTH}-character cookie limit`);
});
it('reads legacy single-cookie tokens', () => {
expect(
getAPITokenFromCookies([{ name: cookieName, value: 'legacy-token' }], cookieName)
).toBe('legacy-token');
});
it('does not return a partial token when a chunk is missing', () => {
expect(
getAPITokenFromCookies(
[
{ name: cookieName, value: 'chunks:2' },
{ name: `${cookieName}-0`, value: 'first' },
],
cookieName
)
).toBeUndefined();
});
it('does not return a token when the first chunk is missing', () => {
expect(
getAPITokenFromCookies(
[
{ name: cookieName, value: 'chunks:2' },
{ name: `${cookieName}-1`, value: 'second' },
],
cookieName
)
).toBeUndefined();
});
it('returns the base cookie value when its chunk count is unknown', () => {
expect(
getAPITokenFromCookies(
[
{ name: cookieName, value: '2' },
{ name: `${cookieName}-0`, value: 'first' },
{ name: `${cookieName}-1`, value: 'second' },
],
cookieName
)
).toBe('2');
expect(getAPITokenFromCookies([{ name: cookieName, value: 'chunks:02' }], cookieName)).toBe(
'chunks:02'
);
});
it('expires chunks no longer needed by a replacement token', () => {
const oldCookies = [
{ name: cookieName, value: 'chunks:3' },
{ name: `${cookieName}-0`, value: 'first' },
{ name: `${cookieName}-1`, value: 'second' },
{ name: `${cookieName}-2`, value: 'third' },
];
expect(
getAPITokenResponseCookies({
cookies: oldCookies,
cookieName,
apiToken: 'replacement',
options,
})
).toEqual([
{ name: cookieName, value: 'replacement', options },
{ name: `${cookieName}-0`, value: '', options: { ...options, maxAge: 0 } },
{ name: `${cookieName}-1`, value: '', options: { ...options, maxAge: 0 } },
{ name: `${cookieName}-2`, value: '', options: { ...options, maxAge: 0 } },
]);
});
it('does not attempt to expire an unbounded number of forged chunks', () => {
expect(
getAPITokenResponseCookies({
cookies: [{ name: cookieName, value: 'chunks:999999999' }],
cookieName,
apiToken: 'replacement',
options,
})
).toEqual([{ name: cookieName, value: 'replacement', options }]);
});
});

Some files were not shown because too many files have changed in this diff Show More