Skip to content

chore(KNO-14398): adopt the oxc toolchain (oxlint + oxfmt) and TypeScript 7 for packages - #1047

Draft
kylemcd wants to merge 4 commits into
mainfrom
kyle-kno-14398-chore-adopt-the-oxc-toolchain-oxlint-oxfmt-and-typescript-7
Draft

chore(KNO-14398): adopt the oxc toolchain (oxlint + oxfmt) and TypeScript 7 for packages#1047
kylemcd wants to merge 4 commits into
mainfrom
kyle-kno-14398-chore-adopt-the-oxc-toolchain-oxlint-oxfmt-and-typescript-7

Conversation

@kylemcd

Copy link
Copy Markdown
Member

Description

Mirrors the toolchain migration done in control (#10453 / #10455 / #10458, KNO-14365/14366/14367) for the @knocklabs/* published packages: ESLint → oxlint, Prettier → oxfmt, and TypeScript 7 for type-checking. The driver, proven in control, is that oxlint removes the @typescript-eslint dependency on the old TypeScript JS API — the coupling that blocks moving type-checking to TS7.

What changed

  • oxlint — root .oxlintrc.json mirrors the previous @knocklabs/eslint-config/library.js coverage (typescript + react + react-hooks + jsx-a11y, correctness as errors, the ^_ unused-vars ignore). Each package's lint runs oxlint --max-warnings=0; per-package .eslintrc.js and the eslint / @typescript-eslint / eslint-plugin-* devDependencies are removed. jsx-a11y/prefer-tag-over-role is turned off to match the prior config (parity with control).
  • oxfmt — root .oxfmtrc.json reproduces @knocklabs/prettier-config (printWidth 80, double quotes, trailing commas, the same import grouping). Each package's format / format:check runs oxfmt; prettier + @trivago/prettier-plugin-sort-imports removed. The reformat was tiny (9 files) since the repo was already on Prettier 3.
  • TypeScript 7 — installed as typescript-7 (npm:typescript@7.0.2) alongside typescript@5.x, which is kept for the build (vite-plugin-dts uses the JS compiler API that TS7 drops). Each package's type:check invokes the aliased binary by path (node ../../node_modules/typescript-7/bin/tsc --noEmit), since the tsc bin name collides with the 5.x we keep.
  • oxlint/oxfmt auto-discover the root config from each package dir, so turbo's per-package tasks and caching are unchanged.

Correctness issues surfaced by oxlint (separate fix commit + changeset)

  • @knocklabs/react: the guide Modal / Card image components no longer pass children to a void <img> (invalid, ignored at runtime).
  • @knocklabs/client: KnockGuideActivationUrlPattern.pattern is typed against the urlpattern-polyfillURLPattern it's constructed from — TS7's newer DOM lib added hasRegExpGroups to the global. Also adds an explicit @types/node reference for the build-time process.env version string (TS7 no longer auto-includes ambient @types), and drops a redundant Feed parameter-property assignment.

Scope / follow-ups

  • Example apps are intentionally excluded and still run ESLint / Prettier — migrating them means fixing ~16 pre-existing lint findings their lenient next lint / expo lint configs tolerated. Tracked as a follow-up.
  • @knocklabs/eslint-config and @knocklabs/prettier-config are retained (the examples still consume them); deprecating them follows once the examples move.
  • Speed wins are smaller than control's headline numbers (these packages are tiny next to the dashboard), so I've deliberately not quoted benchmarks — the value here is the decoupling and cross-repo consistency.

Verification — all green locally: yarn type:check (TS7, 6/6) · yarn lint (oxlint + examples' eslint, 13/13) · yarn format:check (12/12) · yarn build:packages (5/5) · yarn test (1007 tests).

Todos

  • Decide whether to migrate the example apps to the oxc toolchain (and then deprecate @knocklabs/eslint-config / @knocklabs/prettier-config).

Checklist

  • No new features; the existing suite (1007 tests) passes and covers the guide/feed changes.

Replace ESLint with oxlint and Prettier with oxfmt across the published
packages, and type-check them with TypeScript 7 (installed as the
`typescript-7` alias). This removes the @typescript-eslint dependency on the
old TypeScript JS API from the packages' lint path.
- Add root .oxlintrc.json (mirrors the prior eslint-config coverage) and
.oxfmtrc.json (reproduces the prettier-config settings).
- Point each package's lint/format/type:check at oxlint/oxfmt/TS7; remove
per-package .eslintrc.js and the eslint/prettier devDependencies.
- Keep TypeScript 5.x for builds (vite-plugin-dts).
- Example apps are unchanged and still run ESLint/Prettier (follow-up).
- react: stop passing children to the void <img> in the guide Modal/Card
image components (invalid and ignored at runtime).
- client: type KnockGuideActivationUrlPattern.pattern against the
urlpattern-polyfill URLPattern it is constructed from, and add an explicit
@types/node reference for the build-time process.env version string (TS7
no longer auto-includes ambient @types).
- client: drop a redundant parameter-property assignment in Feed.
@linear-code

Copy link
Copy Markdown

KNO-14398

@changeset-bot

changeset-botBot commented Jul 24, 2026

Copy link
Copy Markdown

🦋 Changeset detected

Latest commit: 9e5fdd6

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 6 packages
NameType
@knocklabs/clientPatch
@knocklabs/reactPatch
ms-teams-connect-examplePatch
nextjs-app-dir-examplePatch
slack-connect-examplePatch
slack-kit-examplePatch

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

@vercel

vercelBot commented Jul 24, 2026

Copy link
Copy Markdown

The latest updates on your projects. Learn more about Vercel for GitHub.

ProjectDeploymentActionsUpdated (UTC)
javascript-ms-teams-connect-exampleReadyReadyPreview, CommentJul 24, 2026 3:21pm
javascript-nextjs-exampleReadyReadyPreview, CommentJul 24, 2026 3:21pm
javascript-slack-connect-exampleReadyReadyPreview, CommentJul 24, 2026 3:21pm
javascript-slack-kit-exampleReadyReadyPreview, CommentJul 24, 2026 3:21pm

Request Review

@codecov

codecovBot commented Jul 24, 2026

Copy link
Copy Markdown

Bundle Report

Changes will decrease total bundle size by 93 bytes (-0.02%) ⬇️. This is within the configured threshold ✅

Detailed changes
Bundle nameSizeChange
@knocklabs/react-react-esm138.93kB-36 bytes (-0.03%) ⬇️
@knocklabs/react-react-cjs128.91kB-26 bytes (-0.02%) ⬇️
@knocklabs/client-client-esm86.98kB-17 bytes (-0.02%) ⬇️
@knocklabs/client-client-cjs63.36kB-14 bytes (-0.02%) ⬇️

Affected Assets, Files, and Routes:

view changes for bundle: @knocklabs/react-react-esm

Assets Changed:

Asset NameSize ChangeTotal SizeChange (%)
modules/guide/components/Modal/Modal.mjs-18 bytes5.74kB-0.31%
modules/guide/components/Card/Card.mjs-18 bytes5.54kB-0.32%

Files inmodules/guide/components/Modal/Modal.mjs:

  • ./src/modules/guide/components/Modal/Modal.tsx → Total Size: 6.83kB

Files inmodules/guide/components/Card/Card.mjs:

  • ./src/modules/guide/components/Card/Card.tsx → Total Size: 6.6kB
view changes for bundle: @knocklabs/client-client-cjs

Assets Changed:

Asset NameSize ChangeTotal SizeChange (%)
clients/feed/feed.js-14 bytes10.73kB-0.13%

Files inclients/feed/feed.js:

  • ./src/clients/feed/feed.ts → Total Size: 18.18kB
view changes for bundle: @knocklabs/client-client-esm

Assets Changed:

Asset NameSize ChangeTotal SizeChange (%)
clients/feed/feed.mjs-17 bytes15.63kB-0.11%

Files inclients/feed/feed.mjs:

  • ./src/clients/feed/feed.ts → Total Size: 18.04kB
view changes for bundle: @knocklabs/react-react-cjs

Assets Changed:

Asset NameSize ChangeTotal SizeChange (%)
modules/guide/components/Modal/Modal.js-13 bytes5.0kB-0.26%
modules/guide/components/Card/Card.js-13 bytes4.49kB-0.29%

Files inmodules/guide/components/Modal/Modal.js:

  • ./src/modules/guide/components/Modal/Modal.tsx → Total Size: 7.24kB

Files inmodules/guide/components/Card/Card.js:

  • ./src/modules/guide/components/Card/Card.tsx → Total Size: 6.92kB

The guide Modal/Card `Img` components rewritten in this PR had no test, so the
changed lines showed up as uncovered (codecov patch/project). Add direct render
tests for `CardView.Img` / `ModalView.Img` that assert a void `<img>` with the
right alt/class and no children (regression guard for the fix), and exclude the
dev-only `App.tsx` playground (`yarn dev:local`, not exported/shipped) from
coverage.
@codecov

codecovBot commented Jul 24, 2026

Copy link
Copy Markdown

Codecov Report

✅ All modified and coverable lines are covered by tests.
✅ Project coverage is 66.90%. Comparing base (f755233) to head (9e5fdd6).
✅ All tests successful. No failed tests found.

Additional details and impacted files
@@ Coverage Diff @@## main #1047 +/- ##
==========================================
+ Coverage 66.58% 66.90% +0.32% 
==========================================
Files 214 213 -1 Lines 10514 10489 -25 Branches 1529 1532 +3 ==========================================
+ Hits 7001 7018 +17 + Misses 3487 3446 -41 + Partials 26 25 -1 
Files with missing linesCoverage Δ
packages/client/src/api.ts93.99% <ø> (ø)
packages/client/src/clients/feed/feed.ts83.42% <ø> (-0.04%)⬇️
packages/client/src/clients/guide/types.ts100.00% <ø> (ø)
...ules/ms-teams/hooks/useConnectedMsTeamsChannels.ts83.78% <100.00%> (ø)
...-core/src/modules/ms-teams/hooks/useMsTeamsAuth.ts100.00% <100.00%> (ø)
...e/src/modules/slack/context/KnockSlackProvider.tsx92.85% <100.00%> (ø)
...c/modules/slack/hooks/useConnectedSlackChannels.ts83.78% <100.00%> (ø)
...react-core/src/modules/slack/hooks/useSlackAuth.ts97.05% <100.00%> (ø)
...t-core/src/modules/slack/hooks/useSlackChannels.ts100.00% <100.00%> (ø)
...s/react/src/modules/guide/components/Card/Card.tsx61.77% <100.00%> (+3.74%)⬆️
... and 1 more

... and 1 file with indirect coverage changes

Sign up for freeto join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant

@kylemcd