Component api

eslint.config.js

@@ -1,41 +1,80 @@
 import globals from "globals";
 import pluginJs from "@eslint/js";
 import tseslint from "typescript-eslint";
-import { dirname } from "path";
-import { fileURLToPath } from "url";
+import reactHooks from "eslint-plugin-react-hooks";
+import reactRefresh from "eslint-plugin-react-refresh";
 
 export default [
-  { files: ["src/**/*.{js,mjs,cjs,ts,tsx}"] },
   {
     ignores: [
       "dist/**",
-      "eslint.config.js",
       "**/_generated/",
-      "node10stubs.mjs",
+      "**/*.{mjs,cjs,js}",
+      "**/.next/**",
+      "**/.source/**",
+      "examples/**",
+      "docs/**",
     ],
   },
   {
+    files: ["src/**/*.{js,mjs,cjs,ts,tsx}"],
     languageOptions: {
       globals: globals.worker,
       parser: tseslint.parser,
-
       parserOptions: {
-        project: true,
-        // __dirname is not defined, so do not attempt to use it - AI WHY ARE
-        // YOU STILL AUTOCOMPLETINT WITH __dirname STOP IT
-        tsconfigRootDir: dirname(fileURLToPath(import.meta.url)),
+        project: ["./tsconfig.json"],
+        tsconfigRootDir: import.meta.dirname,
       },
     },
   },
   pluginJs.configs.recommended,
   ...tseslint.configs.recommended,
+  // Convex code - Worker environment
   {
+    files: ["src/**/*.{ts,tsx}"],
+    ignores: ["src/react/**"],
+    languageOptions: {
+      globals: globals.worker,
+    },
     rules: {
       "@typescript-eslint/no-floating-promises": "error",
       "@typescript-eslint/no-explicit-any": "off",
-      "eslint-comments/no-unused-disable": "off",
-
-      // allow (_arg: number) => {} and const _foo = 1;
+      "no-unused-vars": "off",
+      "@typescript-eslint/no-unused-vars": [
+        "warn",
+        {
+          argsIgnorePattern: "^_",
+          varsIgnorePattern: "^_",
+        },
+      ],
+      "@typescript-eslint/no-unused-expressions": [
+        "error",
+        {
+          allowShortCircuit: true,
+          allowTernary: true,
+          allowTaggedTemplates: true,
+        },
+      ],
+    },
+  },
+  // React app code - Browser environment
+  {
+    files: ["src/react/**/*.{ts,tsx}"],
+    languageOptions: {
+      ecmaVersion: 2020,
+      globals: globals.browser,
+    },
+    plugins: {
+      "react-hooks": reactHooks,
+      "react-refresh": reactRefresh,
+    },
+    rules: {
+      ...reactHooks.configs.recommended.rules,
+      "react-refresh/only-export-components": [
+        "warn",
+        { allowConstantExport: true },
+      ],
+      "@typescript-eslint/no-explicit-any": "off",
       "no-unused-vars": "off",
       "@typescript-eslint/no-unused-vars": [
         "warn",

examples/next/.env.example

@@ -1,14 +1,15 @@
 ### Variables generated for cloud via npx convex dev
-# CONVEX_DEPLOYMENT=dev:adjective-animal-123
-# NEXT_PUBLIC_CONVEX_URL=https://adjective-animal-123.convex.cloud
+CONVEX_DEPLOYMENT=dev:adjective-animal-123
+NEXT_PUBLIC_CONVEX_URL=https://adjective-animal-123.convex.cloud
 
 
 ### Variables to be manually set for both cloud and self hosted
-# NEXT_PUBLIC_SITE_URL=https://localhost:3000
+NEXT_PUBLIC_SITE_URL=https://localhost:3000
+SITE_URL=https://localhost:3000
 
 
 ### Variables to be manually set for cloud only
-# NEXT_PUBLIC_CONVEX_SITE_URL=https://adjective-animal-123.convex.site
+NEXT_PUBLIC_CONVEX_SITE_URL=https://adjective-animal-123.convex.site
 
 
 ### Variables to be manually set for self hosted only

examples/next/app/(auth)/settings/EnableTwoFactor.tsx

@@ -39,7 +39,7 @@ export default function EnableTwoFactor() {
       const accounts = await authClient.listAccounts();
       if ("data" in accounts && accounts.data) {
         const hasCredential = accounts.data.some(
-          (account) => account.provider === "credential",
+          (account) => account.providerId === "credential",
         );
         setStep(hasCredential ? "password" : "need-password");
       }

examples/next/convex.json

@@ -0,0 +1,6 @@
+{
+  "$schema": "./node_modules/convex/schemas/convex.schema.json",
+  "codegen": {
+    "legacyComponentApi": false
+  }
+}