authClient generates error
Helloo!
When I tried to use authClient in a React Client Component, i get the following error:
code:
useEffect(() => {
const fetchUsers = async () => {
try {
setIsLoading(true);
const response = await authClient.admin.listUsers({
query: {
limit: 10,
},
});
if (response?.data) {
setUsers(response.data.users as User[]);
}
} catch (err) {
setError(
err instanceof Error ? err : new Error("Failed to fetch users")
);
} finally {
setIsLoading(false);
}
};
useEffect(() => {
const fetchUsers = async () => {
try {
setIsLoading(true);
const response = await authClient.admin.listUsers({
query: {
limit: 10,
},
});
if (response?.data) {
setUsers(response.data.users as User[]);
}
} catch (err) {
setError(
err instanceof Error ? err : new Error("Failed to fetch users")
);
} finally {
setIsLoading(false);
}
};
1 Reply
package.json:
"dependencies": {
"@better-fetch/fetch": "^1.1.15",
"@hookform/resolvers": "^4.1.3",
"@radix-ui/react-avatar": "^1.1.3",
"@radix-ui/react-checkbox": "^1.1.4",
"@radix-ui/react-dialog": "^1.1.6",
"@radix-ui/react-dropdown-menu": "^2.1.6",
"@radix-ui/react-label": "^2.1.2",
"@radix-ui/react-select": "^2.1.6",
"@radix-ui/react-separator": "^1.1.2",
"@radix-ui/react-slot": "^1.1.2",
"@radix-ui/react-switch": "^1.1.3",
"@radix-ui/react-tabs": "^1.1.3",
"@radix-ui/react-toggle": "^1.1.2",
"@radix-ui/react-tooltip": "^1.1.8",
"@tanstack/react-query": "^5.67.2",
"axios": "^1.8.1",
"better-auth": "^1.2.3",
"class-variance-authority": "^0.7.1",
"clsx": "^2.1.1",
"dotenv": "^16.4.7",
"drizzle-orm": "^0.40.0",
"hono": "^4.7.4",
"lucide-react": "^0.479.0",
"next": "15.2.1",
"next-themes": "^0.4.4",
"pg": "^8.13.3",
"postgres": "^3.4.5",
"react": "^19.0.0",
"react-dom": "^19.0.0",
"react-hook-form": "^7.54.2",
"server-only": "^0.0.1",
"sonner": "^2.0.1",
"tailwind-merge": "^3.0.2",
"tailwindcss-animate": "^1.0.7",
"zod": "^3.24.2"
},
"devDependencies": {
"@eslint/eslintrc": "^3",
"@tailwindcss/postcss": "^4",
"@types/node": "^20",
"@types/pg": "^8.11.11",
"@types/react": "^19",
"@types/react-dom": "^19",
"drizzle-kit": "^0.30.5",
"eslint": "^9",
"eslint-config-next": "15.2.1",
"tailwindcss": "^4",
"tsx": "^4.19.3",
"typescript": "^5"
},
"dependencies": {
"@better-fetch/fetch": "^1.1.15",
"@hookform/resolvers": "^4.1.3",
"@radix-ui/react-avatar": "^1.1.3",
"@radix-ui/react-checkbox": "^1.1.4",
"@radix-ui/react-dialog": "^1.1.6",
"@radix-ui/react-dropdown-menu": "^2.1.6",
"@radix-ui/react-label": "^2.1.2",
"@radix-ui/react-select": "^2.1.6",
"@radix-ui/react-separator": "^1.1.2",
"@radix-ui/react-slot": "^1.1.2",
"@radix-ui/react-switch": "^1.1.3",
"@radix-ui/react-tabs": "^1.1.3",
"@radix-ui/react-toggle": "^1.1.2",
"@radix-ui/react-tooltip": "^1.1.8",
"@tanstack/react-query": "^5.67.2",
"axios": "^1.8.1",
"better-auth": "^1.2.3",
"class-variance-authority": "^0.7.1",
"clsx": "^2.1.1",
"dotenv": "^16.4.7",
"drizzle-orm": "^0.40.0",
"hono": "^4.7.4",
"lucide-react": "^0.479.0",
"next": "15.2.1",
"next-themes": "^0.4.4",
"pg": "^8.13.3",
"postgres": "^3.4.5",
"react": "^19.0.0",
"react-dom": "^19.0.0",
"react-hook-form": "^7.54.2",
"server-only": "^0.0.1",
"sonner": "^2.0.1",
"tailwind-merge": "^3.0.2",
"tailwindcss-animate": "^1.0.7",
"zod": "^3.24.2"
},
"devDependencies": {
"@eslint/eslintrc": "^3",
"@tailwindcss/postcss": "^4",
"@types/node": "^20",
"@types/pg": "^8.11.11",
"@types/react": "^19",
"@types/react-dom": "^19",
"drizzle-kit": "^0.30.5",
"eslint": "^9",
"eslint-config-next": "15.2.1",
"tailwindcss": "^4",
"tsx": "^4.19.3",
"typescript": "^5"
},