feat: add Biome formatting code and optimize project structure

.vscode/settings.json

@@ -0,0 +1,8 @@
+{
+  "editor.codeActionsOnSave": {
+    "source.organizeImports.biome": "explicit",
+    "quickfix.biome": "explicit"
+  },
+  "eslint.enable": false,
+  "prettier.enable": false
+}

biome.json

@@ -0,0 +1,95 @@
+{
+  "$schema": "https://biomejs.dev/schemas/1.9.4/schema.json",
+  "files": {
+    "ignoreUnknown": false,
+    "ignore": ["src/components/ui/*.tsx", "node_modules", ".next"]
+  },
+  "vcs": {
+    "enabled": false,
+    "clientKind": "git",
+    "useIgnoreFile": false
+  },
+  "linter": {
+    "enabled": true,
+    "rules": {
+      "recommended": true,
+      "suspicious": {
+        "noDebugger": "off"
+      },
+      "style": {},
+      "a11y": {
+        "useSemanticElements": "off",
+        "useKeyWithClickEvents": "off"
+      },
+      "correctness": {
+        "noUnusedImports": "error"
+      },
+      "nursery": {
+        "useSortedClasses": {
+          "level": "warn",
+          "fix": "safe",
+          "options": {
+            "attributes": ["className"],
+            "functions": ["clsx", "cva", "cn"]
+          }
+        }
+      }
+    }
+  },
+  "formatter": {
+    "enabled": true,
+    "formatWithErrors": false,
+    "indentStyle": "space",
+    "indentWidth": 2,
+    "lineEnding": "lf",
+    "lineWidth": 80,
+    "attributePosition": "auto",
+    "useEditorconfig": false
+  },
+  "organizeImports": {
+    "enabled": true
+  },
+  "javascript": {
+    "formatter": {
+      "enabled": true,
+      "quoteStyle": "single",
+      "jsxQuoteStyle": "single",
+      "quoteProperties": "asNeeded",
+      "trailingCommas": "all",
+      "semicolons": "asNeeded",
+      "arrowParentheses": "always",
+      "indentStyle": "space",
+      "indentWidth": 2,
+      "lineEnding": "lf",
+      "lineWidth": 80,
+      "bracketSameLine": false,
+      "bracketSpacing": true,
+      "attributePosition": "multiline"
+    }
+  },
+  "json": {
+    "parser": {
+      "allowComments": true
+    },
+    "formatter": {
+      "enabled": true,
+      "indentStyle": "space",
+      "indentWidth": 2,
+      "lineEnding": "lf",
+      "lineWidth": 80
+    }
+  },
+  "css": {
+    "parser": {
+      "cssModules": false
+    },
+    "formatter": {
+      "enabled": true,
+      "indentStyle": "space",
+      "indentWidth": 2,
+      "lineEnding": "lf",
+      "lineWidth": 80,
+      "quoteStyle": "single"
+    }
+  }
+}

lefthook.yml

@@ -0,0 +1,6 @@
+pre-commit:
+  commands:
+    check:
+      glob: "*.{js,ts,cjs,mjs,d.cts,d.mts,jsx,tsx,json,jsonc}"
+      run: npx @biomejs/biome check --write --no-errors-on-unmatched --files-ignore-unknown=true --colors=off {staged_files}
+      stage_fixed: true

next.config.ts

@@ -1,30 +1,31 @@
-import nextra from "nextra";
+import nextra from 'nextra'
 
 const withNextra = nextra({
   latex: true,
   search: {
     codeblocks: false,
   },
-  contentDirBasePath: "/docs",
-});
+})
 
 export default withNextra({
   reactStrictMode: true,
-  assetPrefix:
-    process.env.NODE_ENV === "development"
-      ? "http://localhost:3000"
-      : "https://docs.createwise.ai",
-  images: {
-    unoptimized: true,
-    remotePatterns: [
-      {
-        protocol: "https",
-        hostname: "**",
-      },
-      {
-        protocol: "http",
-        hostname: "**",
+  // https://github.com/vercel/turborepo/issues/4832#issuecomment-1751407444
+  webpack(config) {
+    config.module.rules.push({
+      test: /\.svg$/i,
+      use: ['@svgr/webpack'],
+    })
+
+    return config
+  },
+  experimental: {
+    turbo: {
+      rules: {
+        '*.svg': {
+          loaders: ['@svgr/webpack'],
+          as: '*.js',
+        },
       },
-    ],
+    },
   },
-});
+})

package.json

@@ -1,26 +1,33 @@
 {
-	"name": "createwise-docs",
-	"version": "0.1.0",
-	"private": true,
-	"scripts": {
-		"dev": "next dev --turbopack",
-		"build": "next build",
-		"start": "next start"
-	},
-	"dependencies": {
-		"next": "^15.1.6",
-		"nextra": "^4.2.1",
-		"nextra-theme-docs": "^4.2.1",
-		"react": "^19.0.0",
-		"react-dom": "^19.0.0"
-	},
-	"devDependencies": {
-		"@types/node": "^20.17.16",
-		"@types/react": "^19.0.8",
-		"@types/react-dom": "^19.0.3",
-		"pagefind": "^1.3.0",
-		"postcss": "^8.5.1",
-		"tailwindcss": "^3.4.17",
-		"typescript": "^5.7.3"
-	}
+  "name": "createwise-docs",
+  "version": "0.1.0",
+  "private": true,
+  "scripts": {
+    "dev": "next dev --turbopack",
+    "build": "next build",
+    "start": "next start",
+    "lint": "biome check ./src",
+    "lint:fix": "biome check --write ./src"
+  },
+  "dependencies": {
+    "@svgr/webpack": "^8.1.0",
+    "@tailwindcss/postcss": "^4.0.1",
+    "lefthook": "^1.10.10",
+    "next": "^15.1.6",
+    "nextra": "^4.2.1",
+    "nextra-theme-docs": "^4.2.1",
+    "postcss": "^8.5.1",
+    "react": "^19.0.0",
+    "react-dom": "^19.0.0",
+    "tailwind-merge": "^3.0.1",
+    "tailwindcss": "^4.0.1"
+  },
+  "devDependencies": {
+    "@biomejs/biome": "1.9.4",
+    "@types/node": "^20.17.16",
+    "@types/react": "^19.0.8",
+    "@types/react-dom": "^19.0.3",
+    "pagefind": "^1.3.0",
+    "typescript": "^5.7.3"
+  }
 }

postcss.config.mjs

@@ -1,8 +1,8 @@
 /** @type {import('postcss-load-config').Config} */
 const config = {
   plugins: {
-    tailwindcss: {},
+    '@tailwindcss/postcss': {},
   },
-};
+}
 
-export default config;
+export default config

src/app/docs/[[...mdxPath]]/page.jsx → src/app/[[...mdxPath]]/page.tsx

@@ -1,10 +1,9 @@
-/* eslint-disable react-hooks/rules-of-hooks -- false positive, useMDXComponents isn't react hooks */
-
 import { generateStaticParamsFor, importPage } from 'nextra/pages'
-import { useMDXComponents } from '../../../../mdx-components'
+import { useMDXComponents } from '~/mdx-components'
 
 export const generateStaticParams = generateStaticParamsFor('mdxPath')
 
+// @ts-ignore
 export async function generateMetadata(props) {
   const params = await props.params
   const { metadata } = await importPage(params.mdxPath)
@@ -13,13 +12,20 @@ export async function generateMetadata(props) {
 
 const Wrapper = useMDXComponents().wrapper
 
+// @ts-ignore
 export default async function Page(props) {
   const params = await props.params
   const result = await importPage(params.mdxPath)
   const { default: MDXContent, toc, metadata } = result
   return (
-    <Wrapper toc={toc} metadata={metadata}>
-      <MDXContent {...props} params={params} />
+    <Wrapper
+      toc={toc}
+      metadata={metadata}
+    >
+      <MDXContent
+        {...props}
+        params={params}
+      />
     </Wrapper>
   )
 }