chore(apps/documentation): migrate to eslint 9 (#188)

apps/documentation/package.json

@@ -3,8 +3,9 @@
   "description": "The react/rust fullstack framework documentation",
   "version": "0.0.1",
   "private": true,
+  "type": "module",
   "scripts": {
-    "lint": "eslint --ext .ts,.tsx ./src -c .eslintrc",
+    "lint": "eslint .",
     "format": "prettier -u --write --ignore-unknown './src/**/*'",
     "format:check": "prettier --check --ignore-unknown './src/**/*'",
     "types": "tsc --noEmit"

apps/documentation/postcss.config.cjs → apps/documentation/postcss.config.js

@@ -1,4 +1,4 @@
-module.exports = {
+export default {
   plugins: {
     'postcss-preset-mantine': {},
     'postcss-simple-vars': {

apps/documentation/src/components/mdx-provider/mdx-code/mdx-code.tsx

@@ -1,6 +1,5 @@
-import type { JSX } from 'react'
+import type { JSX, HTMLAttributes } from 'react'
 import { Code } from '@mantine/core'
-import type { HTMLAttributes } from 'react'
 
 export default function MdxCode(
   props: HTMLAttributes<HTMLPreElement>,

apps/documentation/src/components/mdx-provider/mdx-pre/mdx-pre.tsx

@@ -1,10 +1,17 @@
 import type { JSX } from 'react'
 import { CodeHighlight } from '@mantine/code-highlight'
+
 import styles from './mdx-pre.module.css'
 
 interface PreProps {
-  children: any
+  children: {
+    props: {
+      children: string
+      className?: string
+    }
+  }
 }
+
 export default function MdxPre({ children }: PreProps): JSX.Element {
   return (
     <CodeHighlight

apps/documentation/src/components/mdx-provider/mdx-provider.tsx

@@ -1,8 +1,7 @@
-import type { JSX } from 'react'
+import type { JSX, ReactNode } from 'react'
 import { MDXProvider } from '@mdx-js/react'
 
 import MdxLink from './mdx-link'
-import type { ReactNode } from 'react'
 import MdxPre from './mdx-pre'
 import MdxQuote from './mdx-quote'
 import MdxCode from './mdx-code'

apps/documentation/src/components/mdx-provider/mdx-title/mdx-title.tsx

@@ -8,6 +8,7 @@ export default function MdxTitle(props: TitleProps): JSX.Element {
       data-order={props.order}
       mt={20}
       {...props}
+      // eslint-disable-next-line @typescript-eslint/no-base-to-string
       id={String(props.children ?? '')
         .toLowerCase()
         .replaceAll(' ', '-')}

apps/documentation/src/components/table-of-content/table-of-content.tsx

@@ -6,6 +6,7 @@ import { useEffect, useRef, useState } from 'react'
 import { useRouter, Link } from 'tuono'
 import { IconList } from '@tabler/icons-react'
 import { Box, rem, ScrollArea, Text } from '@mantine/core'
+
 import { getHeadings, type Heading } from './get-headings'
 import classes from './table-of-content.module.css'
 

apps/documentation/src/modules.d.ts

@@ -1,2 +1,5 @@
 // declaration.d.ts
-declare module '*.css'
+declare module '*.css' {
+  const CSSModule: Record<string, string>
+  export default CSSModule
+}

apps/documentation/src/routes/__root.tsx

@@ -7,13 +7,13 @@ import {
 } from '@mantine/core'
 import { useDisclosure } from '@mantine/hooks'
 import { Head, useRouter } from 'tuono'
+
 import Navbar from '@/components/navbar'
+import Sidebar from '@/components/sidebar'
 
 import '@mantine/core/styles.css'
 import '@mantine/code-highlight/styles.css'
 
-import Sidebar from '@/components/sidebar'
-
 interface RootRouteProps {
   children: ReactNode
 }

apps/documentation/tsconfig.json

@@ -1,28 +1,37 @@
 {
   "compilerOptions": {
-    "target": "ES2020",
-    "useDefineForClassFields": true,
-    "lib": ["ES2021", "DOM", "DOM.Iterable"],
-    "module": "ESNext",
-    "skipLibCheck": true,
-
-    /* Bundler mode */
-    "moduleResolution": "bundler",
-    "allowImportingTsExtensions": true,
-    "resolveJsonModule": true,
-    "isolatedModules": true,
-    "noEmit": true,
-    "jsx": "react-jsx",
-
-    /* Linting */
+    // Typechecking
     "strict": true,
     "noUnusedLocals": true,
     "noUnusedParameters": true,
     "noFallthroughCasesInSwitch": true,
+
+    // Modules
+    "module": "ESNext",
+    "moduleResolution": "bundler",
+    "resolveJsonModule": true,
     "paths": {
       "@/*": ["./src/*"]
-    }
+    },
+
+    // Emit
+    "noEmit": true,
+
+    // JavaScript Support
+    "allowJs": true,
+
+    // Interop Constraints
+    "isolatedModules": true,
+
+    // Language and Environment
+    "target": "ES2020",
+    "useDefineForClassFields": true,
+    "lib": ["ES2021", "DOM", "DOM.Iterable"],
+    "jsx": "react-jsx",
+
+    // Completeness
+    "skipLibCheck": true
   },
-  "include": ["src"],
+  "include": ["src", "tuono.config.ts", "postcss.config.js"],
   "references": [{ "path": "./tsconfig.node.json" }]
 }

eslint.config.js

@@ -9,6 +9,7 @@ export default tseslint.config(
       // #region shared
       '**/build',
       '**/dist',
+      '**/.tuono',
       '**/vite.config.ts.timestamp**',
       // #endregion shared
 
@@ -128,4 +129,12 @@ export default tseslint.config(
       'sort-imports': 'off',
     },
   },
+  {
+    files: ['apps/documentation/**'],
+    settings: {
+      'import/resolver': {
+        typescript: 'apps/documentation/tsconfig.json',
+      },
+    },
+  },
 )