chore: migrate to oxc

.cspell/packages.txt

@@ -6,6 +6,7 @@ fumadocs
 lokalise
 nuqs
 orpc
+oxlint
 radixui
 rmiz
 shiki

.github/actions/setup/action.yml

@@ -20,14 +20,6 @@ runs:
       env:
         PLAYWRIGHT_SKIP_BROWSER_DOWNLOAD: '1'
 
-    - name: Build MDX
-      shell: bash
-      run: bun build:mdx
-
-    - name: Build Cosmos
-      shell: bash
-      run: bun cosmos:export
-
     - name: Generate Next.js route types
       shell: bash
       run: bun typegen

.github/workflows/ci.yml

@@ -44,7 +44,7 @@ jobs:
       - name: Configure environment
         uses: ./.github/actions/setup
 
-      - name: Run ESLint
+      - name: Run Oxlint
         run: bun lint
 
   spellcheck:
@@ -83,7 +83,7 @@ jobs:
       - name: Configure environment
         uses: ./.github/actions/setup
 
-      - name: Run Prettier format check
+      - name: Run Oxfmt format check
         run: bun format:check
 
   knip:

.npmrc

@@ -1,3 +1,2 @@
 engine-strict=true
 save-exact=true
-public-hoist-pattern[]=*eslint-plugin*

.vscode/extensions.json

@@ -1,7 +1,6 @@
 {
   "recommendations": [
-    "dbaeumer.vscode-eslint",
-    "esbenp.prettier-vscode",
+    "oxc.oxc-vscode",
     "bradlc.vscode-tailwindcss",
     "unifiedjs.vscode-mdx",
     "streetsidesoftware.code-spell-checker",

.vscode/settings.json

@@ -1,8 +1,11 @@
 {
   "editor.codeActionsOnSave": {
-    "source.fixAll.eslint": "always"
+    "source.fixAll.oxc": "explicit"
   },
 
+  "editor.defaultFormatter": "oxc.oxc-vscode",
+  "oxc.fmt.configPath": "oxfmt.config.ts",
+
   "editor.formatOnPaste": true,
   "editor.formatOnSave": true,
 

AGENTS.md

@@ -11,7 +11,7 @@ Use Bun for all local work.
 - `bun dev`: start the app on `localhost:3000`
 - `bun run build`: export Cosmos fixtures, then build production output
 - `bun start`: run the production build locally
-- `bun check`: run lint, typecheck, Prettier, Knip, i18n, and spellcheck
+- `bun check`: run lint, typecheck, Oxfmt, Knip, i18n, and spellcheck
 - `bun test:unit` or `bun test:unit:coverage`: run Vitest tests with optional coverage
 - `bun test:e2e`: run Playwright end-to-end tests when the maintainer asks for them
 - `bun db:migrate` and `bun db:seed`: prepare the local database
@@ -27,7 +27,7 @@ This version has breaking changes — APIs, conventions, and file structure may
 
 ## Coding Style & Naming Conventions
 
-TypeScript is strict; prefer small typed helpers over `any`. Follow ESLint and Prettier defaults via `eslint.config.ts` and `prettier.config.js`; run `bun lint:fix` and `bun format` before opening a PR. Use the `@/` alias for `src/` imports and `~/` for `public/`. Components use PascalCase exports, utility files use kebab-case names such as `get-pathnames.ts`, and tests end in `.test.ts` or `.test.tsx`.
+TypeScript is strict; prefer small typed helpers over `any`. Follow Oxlint and Oxfmt defaults via `oxlint.config.ts` and `oxfmt.config.js`; run `bun lint:fix` and `bun format` before opening a PR. Use the `@/` alias for `src/` imports and `~/` for `public/`. Components use PascalCase exports, utility files use kebab-case names such as `get-pathnames.ts`, and tests end in `.test.ts` or `.test.tsx`.
 
 ## Testing Guidelines
 

README.md

@@ -57,8 +57,8 @@ Welcome to my personal blog and portfolio website! This repository contains a mo
 
 - Vitest for unit testing
 - Playwright for E2E testing
-- ESLint configuration
-- Prettier code formatting
+- Oxlint configuration
+- Oxfmt code formatting
 - Lefthook
 - Conventional commit
 
@@ -203,9 +203,9 @@ bun analyze           # Analyze bundle size
 
 # Quality & Testing
 bun check             # Run all quality checks (lint, typecheck, format, etc.)
-bun lint              # Run ESLint
+bun lint              # Run Oxlint
 bun typecheck         # Run TypeScript type checking
-bun format            # Format code with Prettier
+bun format            # Format code with Oxfmt
 bun knip              # Find unused dependencies/exports
 bun test:unit         # Run unit tests
 bun test:e2e          # Run Playwright E2E tests

lefthook.yml

@@ -2,10 +2,10 @@ pre-commit:
   parallel: true
   jobs:
     - name: format
-      run: bun prettier --write --ignore-unknown "{staged_files}"
+      run: bun oxfmt --no-error-on-unmatched-pattern "{staged_files}"
       stage_fixed: true
 
     - name: lint
       glob: '*.{js,jsx,cjs,mjs,ts,tsx,cts,mts,d.ts,d.cjs,d.mts}'
-      run: bun eslint --fix "{staged_files}"
+      run: bun oxlint --fix "{staged_files}"
       stage_fixed: true

oxfmt.config.ts

@@ -0,0 +1,3 @@
+import { defineConfig } from '@nelsonlaidev/oxfmt-config'
+
+export default defineConfig()

oxlint.config.ts

@@ -0,0 +1,45 @@
+import { defineConfig } from '@nelsonlaidev/oxlint-config'
+
+export default defineConfig({
+  custom: {
+    tailwindcss: {
+      entryPoint: 'src/styles/globals.css',
+      ignore: ['not-prose', 'shiki', 'toaster'],
+    },
+    playwright: {
+      files: [`src/tests/e2e/**/*.test.{ts,tsx}`],
+      assertFunctionNames: ['a11y', 'checkAppliedTheme', 'checkStoredTheme'],
+    },
+    vitest: {
+      files: [`src/tests/unit/**/*.test.{ts,tsx}`],
+    },
+  },
+  config: {
+    overrides: [
+      {
+        files: ['src/components/ui/*.fixture.tsx'],
+        plugins: ['nextjs'],
+        rules: {
+          'nextjs/no-html-link-for-pages': 'off',
+        },
+      },
+      {
+        files: ['**/*.{ts,tsx}'],
+        rules: {
+          'no-restricted-imports': [
+            'error',
+            {
+              paths: [
+                {
+                  name: '@tanstack/react-table',
+                  importNames: ['useReactTable'],
+                  message: 'Please use the custom hook from `@/hooks/use-react-table` instead.',
+                },
+              ],
+            },
+          ],
+        },
+      },
+    ],
+  },
+})

package.json

@@ -23,11 +23,11 @@
     "dev": "next dev -p 3000",
     "email:dev": "email dev --port 3001 --dir ./src/emails/templates",
     "email:export": "email export --dir ./src/emails/templates",
-    "format": "prettier --write .",
-    "format:check": "prettier --check .",
+    "format": "oxfmt",
+    "format:check": "oxfmt --check",
     "knip": "knip-bun",
-    "lint": "eslint",
-    "lint:fix": "eslint --fix",
+    "lint": "oxlint",
+    "lint:fix": "oxlint --fix",
     "lint:spell": "cspell .",
     "prepare": "lefthook install",
     "start": "next start -p 3000",
@@ -40,7 +40,7 @@
     "test:unit:ui": "bun with-env vitest --ui",
     "test:unit:watch": "bun with-env vitest watch",
     "typecheck": "tsc --noEmit",
-    "typegen": "next typegen",
+    "typegen": "bun build:mdx && bun cosmos:export && next typegen",
     "with-env": "bun --env-file=.env.local"
   },
   "dependencies": {
@@ -120,11 +120,14 @@
     "@content-collections/next": "0.2.11",
     "@cspell/dict-es-es": "3.0.8",
     "@cspell/dict-pt-br": "2.4.2",
+    "@eslint-react/eslint-plugin": "4.0.2-beta.6",
     "@lingual/i18n-check": "0.9.5",
-    "@nelsonlaidev/eslint-config": "4.1.0",
-    "@nelsonlaidev/prettier-config": "0.3.0",
+    "@nelsonlaidev/eslint-plugin": "0.2.4",
+    "@nelsonlaidev/oxfmt-config": "0.1.4",
+    "@nelsonlaidev/oxlint-config": "0.3.0",
     "@nelsonlaidev/typescript-config": "1.2.1",
     "@playwright/test": "1.61.0",
+    "@stylistic/eslint-plugin": "5.10.0",
     "@tailwindcss/postcss": "4.3.1",
     "@tailwindcss/typography": "0.5.20",
     "@tanstack/react-query-devtools": "5.101.0",
@@ -146,13 +149,23 @@
     "cspell": "10.0.1",
     "discord-api-types": "0.38.48",
     "drizzle-kit": "0.31.10",
-    "eslint": "10.5.0",
+    "eslint-plugin-better-tailwindcss": "4.3.2",
+    "eslint-plugin-command": "3.5.2",
+    "eslint-plugin-de-morgan": "2.1.1",
+    "eslint-plugin-import-zod": "1.2.1",
+    "eslint-plugin-playwright": "2.10.1",
+    "eslint-plugin-react-hooks": "7.0.1",
+    "eslint-plugin-regexp": "3.1.0",
+    "eslint-plugin-simple-import-sort": "12.1.1",
+    "eslint-plugin-sonarjs": "4.0.2",
     "execa": "9.6.1",
     "fast-xml-validator": "1.1.1",
     "jsdom": "29.1.1",
     "knip": "6.17.1",
     "lefthook": "2.1.9",
-    "prettier": "3.8.4",
+    "oxfmt": "0.56.0",
+    "oxlint": "1.71.0",
+    "oxlint-tsgolint": "0.23.0",
     "react-cosmos": "7.3.0",
     "react-cosmos-core": "7.3.0",
     "react-cosmos-next": "7.3.0",
@@ -163,8 +176,8 @@
     "typescript": "6.0.3",
     "vitest": "4.1.9"
   },
-  "packageManager": "bun@1.3.14",
   "engines": {
     "node": ">=24"
-  }
+  },
+  "packageManager": "bun@1.3.14"
 }

src/app/[locale]/(main)/page.tsx

@@ -63,9 +63,9 @@ function Page(props: PageProps<'/[locale]'>) {
       sameAs: [SITE_FACEBOOK_URL, SITE_INSTAGRAM_URL, SITE_X_URL, SITE_GITHUB_URL, SITE_YOUTUBE_URL],
     },
     dateCreated: '2022-02-01T00:00:00Z',
-    // eslint-disable-next-line @eslint-react/purity
+    // oxlint-disable-next-line @eslint-react/purity
     dateModified: new Date().toISOString(),
-    // eslint-disable-next-line @eslint-react/purity
+    // oxlint-disable-next-line @eslint-react/purity
     copyrightYear: new Date().getFullYear(),
     inLanguage: locale,
   }

src/app/[locale]/(unsubscribe)/unsubscribe/page.tsx

@@ -13,7 +13,7 @@ async function Page(props: PageProps<'/[locale]/unsubscribe'>) {
   }
 
   // Allow for future types
-  // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition
+  // oxlint-disable-next-line @typescript-eslint/no-unnecessary-condition
   if (data.type === 'comment_reply') {
     return <UnsubscribeCommentReplyForm data={data} />
   }

src/app/api/avatar/[id]/route.tsx

@@ -15,7 +15,7 @@ function djb2(str: string) {
   let hash = 5381
   for (let i = 0; i < str.length; i++) {
     // `i` is always in range due to the loop condition, so `codePointAt` will never return `undefined`.
-    // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
+    // oxlint-disable-next-line @typescript-eslint/no-non-null-assertion
     hash = (hash << 5) + hash + str.codePointAt(i)!
   }
   return hash

src/components/account/profile.tsx

@@ -122,9 +122,14 @@ function EditName(props: EditNameProps) {
     void refetchSession()
   })
 
-  function handleSubmit(event: React.SubmitEvent<HTMLFormElement>) {
+  async function handleSubmit(event: React.SubmitEvent<HTMLFormElement>) {
     event.preventDefault()
-    void form.handleSubmit()
+
+    try {
+      await form.handleSubmit()
+    } catch (error) {
+      console.error('Failed to submit name update:', error)
+    }
   }
 
   return (

src/components/comment-section/comment-code-block.tsx

@@ -83,7 +83,7 @@ export function CommentCodeBlock(props: CommentCodeBlockProps) {
   return (
     <CodeBlock data-lang={lang} title={title} className='shiki' figureClassName='my-2' scrollAreaClassName='max-h-120'>
       {/* HTML of highlighted code is safely generated. */}
-      {/* eslint-disable-next-line @eslint-react/dom-no-dangerously-set-innerhtml */}
+      {/* oxlint-disable-next-line @eslint-react/dom-no-dangerously-set-innerhtml */}
       {isHighlighted && codeHtml ? <code dangerouslySetInnerHTML={{ __html: codeHtml }} /> : <code>{code}</code>}
     </CodeBlock>
   )

src/components/comment-section/comment-reply.tsx

@@ -60,7 +60,7 @@ export function CommentReply() {
           placeholder={t('blog.comments.reply-to-comment')}
           disabled={disabled}
           // autoFocus is necessary because user is replying to a comment
-          // eslint-disable-next-line jsx-a11y/no-autofocus
+          // oxlint-disable-next-line jsx-a11y/no-autofocus
           autoFocus
           data-testid='comment-textarea-reply'
         />

src/components/comment-section/comment.tsx

@@ -95,7 +95,7 @@ export function Comment(props: CommentProps) {
                       <TooltipTrigger>
                         <span>{formattedDate}</span>
                       </TooltipTrigger>
-                      {/* eslint-disable-next-line @eslint-react/purity */}
+                      {/* oxlint-disable-next-line @eslint-react/purity */}
                       <TooltipContent>{new Date(createdAt).toLocaleString()}</TooltipContent>
                     </Tooltip>
                   ) : (

src/components/guestbook/message-box.tsx

@@ -45,9 +45,14 @@ export function MessageBox(props: MessageBoxProps) {
     toast.success(t('success.message-created'), { testId: 'guestbook-message-created-toast' })
   })
 
-  function handleSubmit(event: React.SubmitEvent<HTMLFormElement>) {
+  async function handleSubmit(event: React.SubmitEvent<HTMLFormElement>) {
     event.preventDefault()
-    void form.handleSubmit()
+
+    try {
+      await form.handleSubmit()
+    } catch (error) {
+      console.error('Failed to submit message:', error)
+    }
   }
 
   return (

src/components/json-ld.tsx

@@ -8,6 +8,6 @@ export function JsonLd(props: JsonLdProps) {
   const { json } = props
 
   // We need to use `dangerouslySetInnerHTML` to insert the JSON-LD script tag.
-  // eslint-disable-next-line @eslint-react/dom-no-dangerously-set-innerhtml
+  // oxlint-disable-next-line @eslint-react/dom-no-dangerously-set-innerhtml
   return <script type='application/ld+json' dangerouslySetInnerHTML={{ __html: JSON.stringify(json) }} />
 }