@checkstack/auth-frontend 0.5.17 → 0.5.19

package/CHANGELOG.md

@@ -1,5 +1,47 @@
 # @checkstack/auth-frontend
 
+## 0.5.19
+
+### Patch Changes
+
+- Updated dependencies [26d8bae]
+  - @checkstack/ui@1.3.0
+
+## 0.5.18
+
+### Patch Changes
+
+- d1a2796: Enforce stricter code quality standards and eliminate AI slop anti-patterns.
+
+  **New utility**
+
+  - `extractErrorMessage(error, fallback?)` in `@checkstack/common` for consistent error extraction
+
+  **ESLint rules**
+
+  - `react-hooks/rules-of-hooks` and `exhaustive-deps` for hook correctness
+  - `no-console` in frontend packages — forces `toast` over silent `console.error`
+  - `no-restricted-syntax` banning `instanceof Error` — forces `extractErrorMessage`
+  - Custom `no-eslint-disable-any` rule preventing `@typescript-eslint/no-explicit-any` circumvention
+
+  **Refactoring**
+
+  - Replace 141 `instanceof Error` boilerplate patterns across the codebase
+  - Replace swallowed `console.error` with user-visible `toast.error()` feedback
+  - Remove 15 redundant `as` type casts in IntegrationsPage and ProviderConnectionsPage
+  - Consolidate 3 identical callback handlers into `handleDialogClose`
+  - Fix conditional React hook call in `FormField.tsx`
+  - Fix unstable useMemo deps in `Dashboard.tsx`
+  - Replace `useEffect`→`setState` with derived `useMemo` in `RegisterPage.tsx`
+  - Rewrite `keystore.test.ts` with typed `DrizzleMockChain` (eliminating 7 `any` suppressions)
+  - Delete obvious comments in `encryption.ts` and Teams `provider.ts`
+
+- Updated dependencies [d1a2796]
+  - @checkstack/common@0.6.5
+  - @checkstack/ui@1.2.1
+  - @checkstack/frontend-api@0.3.9
+  - @checkstack/auth-common@0.6.1
+
 ## 0.5.17
 
 ### Patch Changes

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@checkstack/auth-frontend",
-  "version": "0.5.17",
+  "version": "0.5.19",
   "type": "module",
   "main": "src/index.tsx",
   "checkstack": {
@@ -17,21 +17,21 @@
     "test:e2e": "bunx playwright test"
   },
   "dependencies": {
-    "@checkstack/frontend-api": "0.3.8",
-    "@checkstack/common": "0.6.4",
-    "@checkstack/ui": "1.1.3",
+    "@checkstack/frontend-api": "0.3.9",
+    "@checkstack/common": "0.6.5",
+    "@checkstack/ui": "1.2.1",
     "react": "^18.2.0",
     "react-router-dom": "^6.22.0",
     "lucide-react": "^0.344.0",
     "better-auth": "^1.1.8",
-    "@checkstack/auth-common": "0.5.7"
+    "@checkstack/auth-common": "0.6.1"
   },
   "devDependencies": {
     "typescript": "^5.0.0",
     "@types/react": "^18.2.0",
     "@playwright/test": "^1.49.0",
     "@checkstack/test-utils-frontend": "0.0.4",
-    "@checkstack/tsconfig": "0.0.4",
+    "@checkstack/tsconfig": "0.0.5",
     "@checkstack/scripts": "0.1.2"
   }
 }

package/src/components/ApplicationsTab.tsx

@@ -29,6 +29,7 @@ import { Plus, Trash2, RotateCcw, Copy } from "lucide-react";
 import { usePluginClient } from "@checkstack/frontend-api";
 import { AuthApi } from "@checkstack/auth-common";
 import type { Role } from "../api";
+import { extractErrorMessage } from "@checkstack/common";
 
 export interface Application {
   id: string;
@@ -89,7 +90,7 @@ export const ApplicationsTab: React.FC<ApplicationsTabProps> = ({
     },
     onError: (error) => {
       toast.error(
-        error instanceof Error ? error.message : "Failed to create application",
+        extractErrorMessage(error, "Failed to create application"),
       );
     },
   });
@@ -100,7 +101,7 @@ export const ApplicationsTab: React.FC<ApplicationsTabProps> = ({
     },
     onError: (error) => {
       toast.error(
-        error instanceof Error ? error.message : "Failed to update application",
+        extractErrorMessage(error, "Failed to update application"),
       );
     },
   });
@@ -113,7 +114,7 @@ export const ApplicationsTab: React.FC<ApplicationsTabProps> = ({
     },
     onError: (error) => {
       toast.error(
-        error instanceof Error ? error.message : "Failed to delete application",
+        extractErrorMessage(error, "Failed to delete application"),
       );
     },
   });
@@ -130,9 +131,7 @@ export const ApplicationsTab: React.FC<ApplicationsTabProps> = ({
       },
       onError: (error) => {
         toast.error(
-          error instanceof Error
-            ? error.message
-            : "Failed to regenerate secret",
+          extractErrorMessage(error, "Failed to regenerate secret"),
         );
       },
     });

package/src/components/ChangePasswordPage.tsx

@@ -20,6 +20,7 @@ import {
   Checkbox,
 } from "@checkstack/ui";
 import { getAuthClientLazy } from "../lib/auth-client";
+import { extractErrorMessage } from "@checkstack/common";
 
 export const ChangePasswordPage = () => {
   const navigate = useNavigate();
@@ -84,7 +85,7 @@ export const ChangePasswordPage = () => {
       }
     } catch (error_) {
       setError(
-        error_ instanceof Error ? error_.message : "Failed to change password"
+        extractErrorMessage(error_, "Failed to change password")
       );
     } finally {
       setLoading(false);

package/src/components/ForgotPasswordPage.tsx

@@ -31,9 +31,8 @@ export const ForgotPasswordPage = () => {
         email,
         redirectTo: "/auth/reset-password",
       });
-    } catch (error) {
+    } catch {
       // Silently handle errors to prevent timing attacks
-      console.error("Password reset request failed:", error);
     } finally {
       setLoading(false);
       setSubmitted(true);

package/src/components/LoginPage.tsx

@@ -36,6 +36,8 @@ import {
   InfoBannerTitle,
   InfoBannerDescription,
 } from "@checkstack/ui";
+import { useToast } from "@checkstack/ui";
+import { extractErrorMessage } from "@checkstack/common";
 import { authApiRef, EnabledAuthStrategy } from "../api";
 import { useEnabledStrategies } from "../hooks/useEnabledStrategies";
 import { useAccessRules } from "../hooks/useAccessRules";
@@ -57,6 +59,7 @@ export const LoginPage = () => {
   const authApi = useApi(authApiRef);
   const authClient = usePluginClient(AuthApi);
   const { strategies, loading: strategiesLoading } = useEnabledStrategies();
+  const toast = useToast();
 
   // Query: Registration status
   const { data: registrationData } = authClient.getRegistrationStatus.useQuery(
@@ -90,7 +93,7 @@ export const LoginPage = () => {
         await authApi.signInWithSocial(strategy.id);
       } catch (error) {
         setError("Failed to initialize social login");
-        console.error("Social login failed:", error);
+        toast.error(extractErrorMessage(error, "Failed to initialize social login"));
       }
       return;
     }
@@ -138,7 +141,7 @@ export const LoginPage = () => {
         setError(data.error?.message || "Authentication failed");
       }
     } catch (error) {
-      console.error("Social login failed:", error);
+      toast.error(extractErrorMessage(error, "Social login failed"));
     }
   };
 

package/src/components/OnboardingPage.tsx

@@ -3,7 +3,7 @@ import { useNavigate } from "react-router-dom";
 import { User, Lock, Mail, CheckCircle, AlertCircle } from "lucide-react";
 import { usePluginClient } from "@checkstack/frontend-api";
 import { AuthApi, authRoutes, passwordSchema } from "@checkstack/auth-common";
-import { resolveRoute } from "@checkstack/common";
+import { resolveRoute, extractErrorMessage} from "@checkstack/common";
 import {
   Button,
   Input,
@@ -111,7 +111,7 @@ export const OnboardingPage = () => {
       }
     } catch (error_) {
       const message =
-        error_ instanceof Error ? error_.message : "Failed to complete setup";
+        extractErrorMessage(error_, "Failed to complete setup");
       setError(message);
     } finally {
       setLoading(false);

package/src/components/RegisterPage.tsx

@@ -1,10 +1,10 @@
-import React, { useState, useEffect } from "react";
+import React, { useState, useMemo } from "react";
 import { Link } from "react-router-dom";
 import { AlertCircle } from "lucide-react";
 import { useApi, usePluginClient } from "@checkstack/frontend-api";
 import { authApiRef } from "../api";
 import { AuthApi, authRoutes, passwordSchema } from "@checkstack/auth-common";
-import { resolveRoute } from "@checkstack/common";
+import { resolveRoute, extractErrorMessage } from "@checkstack/common";
 import {
   Button,
   Input,
@@ -20,6 +20,7 @@ import {
   InfoBannerContent,
   InfoBannerTitle,
   InfoBannerDescription,
+  useToast,
 } from "@checkstack/ui";
 import { useEnabledStrategies } from "../hooks/useEnabledStrategies";
 import { SocialProviderButton } from "./SocialProviderButton";
@@ -30,25 +31,18 @@ export const RegisterPage = () => {
   const [email, setEmail] = useState("");
   const [password, setPassword] = useState("");
   const [loading, setLoading] = useState(false);
-  const [validationErrors, setValidationErrors] = useState<string[]>([]);
 
   const authApi = useApi(authApiRef);
   const authClient = usePluginClient(AuthApi);
   const { strategies, loading: strategiesLoading } = useEnabledStrategies();
   const authBetterClient = getAuthClientLazy();
+  const toast = useToast();
 
-  // Validate password on change
-  useEffect(() => {
-    if (password) {
-      const result = passwordSchema.safeParse(password);
-      if (result.success) {
-        setValidationErrors([]);
-      } else {
-        setValidationErrors(result.error.issues.map((issue) => issue.message));
-      }
-    } else {
-      setValidationErrors([]);
-    }
+  // Derive validation errors directly from password (no state/effect needed)
+  const validationErrors = useMemo(() => {
+    if (!password) return [];
+    const result = passwordSchema.safeParse(password);
+    return result.success ? [] : result.error.issues.map((issue) => issue.message);
   }, [password]);
 
   // Query: Registration status
@@ -73,13 +67,13 @@ export const RegisterPage = () => {
         password,
       });
       if (res.error) {
-        console.error("Registration failed:", res.error);
+        toast.error(res.error.message ?? "Registration failed");
       } else {
         // Use full page navigation to ensure session state refreshes in navbar
         globalThis.location.href = "/";
       }
     } catch (error) {
-      console.error("Registration failed:", error);
+      toast.error(extractErrorMessage(error, "Registration failed"));
     } finally {
       setLoading(false);
     }
@@ -90,7 +84,7 @@ export const RegisterPage = () => {
       await authApi.signInWithSocial(provider);
       // Navigation will happen automatically after OAuth redirect
     } catch (error) {
-      console.error("Social registration failed:", error);
+      toast.error(extractErrorMessage(error, "Social registration failed"));
     }
   };
 

package/src/components/ResetPasswordPage.tsx

@@ -2,7 +2,7 @@ import React, { useState, useEffect } from "react";
 import { Link, useSearchParams, useNavigate } from "react-router-dom";
 import { Lock, ArrowLeft, CheckCircle, AlertCircle } from "lucide-react";
 import { authRoutes, passwordSchema } from "@checkstack/auth-common";
-import { resolveRoute } from "@checkstack/common";
+import { resolveRoute, extractErrorMessage} from "@checkstack/common";
 import {
   Button,
   Input,
@@ -83,7 +83,7 @@ export const ResetPasswordPage = () => {
       }
     } catch (error_) {
       setError(
-        error_ instanceof Error ? error_.message : "Failed to reset password"
+        extractErrorMessage(error_, "Failed to reset password")
       );
     } finally {
       setLoading(false);

package/src/components/RolesTab.tsx

@@ -21,6 +21,7 @@ import { usePluginClient } from "@checkstack/frontend-api";
 import { AuthApi } from "@checkstack/auth-common";
 import type { Role, AccessRuleEntry } from "../api";
 import { RoleDialog } from "./RoleDialog";
+import { extractErrorMessage } from "@checkstack/common";
 
 export interface RolesTabProps {
   roles: Role[];
@@ -58,7 +59,7 @@ export const RolesTab: React.FC<RolesTabProps> = ({
     },
     onError: (error) => {
       toast.error(
-        error instanceof Error ? error.message : "Failed to create role",
+        extractErrorMessage(error, "Failed to create role"),
       );
     },
   });
@@ -70,7 +71,7 @@ export const RolesTab: React.FC<RolesTabProps> = ({
     },
     onError: (error) => {
       toast.error(
-        error instanceof Error ? error.message : "Failed to update role",
+        extractErrorMessage(error, "Failed to update role"),
       );
     },
   });
@@ -83,7 +84,7 @@ export const RolesTab: React.FC<RolesTabProps> = ({
     },
     onError: (error) => {
       toast.error(
-        error instanceof Error ? error.message : "Failed to delete role",
+        extractErrorMessage(error, "Failed to delete role"),
       );
     },
   });

package/src/components/StrategiesTab.tsx

@@ -19,6 +19,7 @@ import { usePluginClient } from "@checkstack/frontend-api";
 import { AuthApi } from "@checkstack/auth-common";
 import type { AuthStrategy } from "../api";
 import { AuthStrategyCard } from "./AuthStrategyCard";
+import { extractErrorMessage } from "@checkstack/common";
 
 export interface StrategiesTabProps {
   strategies: AuthStrategy[];
@@ -88,7 +89,7 @@ export const StrategiesTab: React.FC<StrategiesTabProps> = ({
     },
     onError: (error) => {
       toast.error(
-        error instanceof Error ? error.message : "Failed to update strategy"
+        extractErrorMessage(error, "Failed to update strategy")
       );
     },
   });
@@ -99,7 +100,7 @@ export const StrategiesTab: React.FC<StrategiesTabProps> = ({
     },
     onError: (error) => {
       toast.error(
-        error instanceof Error ? error.message : "Failed to save settings"
+        extractErrorMessage(error, "Failed to save settings")
       );
     },
   });
@@ -112,7 +113,7 @@ export const StrategiesTab: React.FC<StrategiesTabProps> = ({
     },
     onError: (error) => {
       toast.error(
-        error instanceof Error ? error.message : "Failed to reload auth"
+        extractErrorMessage(error, "Failed to reload auth")
       );
       setReloading(false);
     },

package/src/components/TeamAccessEditor.tsx

@@ -33,6 +33,7 @@ import {
   accessApiRef,
 } from "@checkstack/frontend-api";
 import { AuthApi, authAccess } from "@checkstack/auth-common";
+import { extractErrorMessage } from "@checkstack/common";
 
 interface TeamAccess {
   teamId: string;
@@ -121,7 +122,7 @@ export const TeamAccessEditor: React.FC<TeamAccessEditorProps> = ({
     },
     onError: (error) => {
       toast.error(
-        error instanceof Error ? error.message : "Failed to update access",
+        extractErrorMessage(error, "Failed to update access"),
       );
     },
   });
@@ -134,7 +135,7 @@ export const TeamAccessEditor: React.FC<TeamAccessEditorProps> = ({
     },
     onError: (error) => {
       toast.error(
-        error instanceof Error ? error.message : "Failed to remove access",
+        extractErrorMessage(error, "Failed to remove access"),
       );
     },
   });
@@ -146,7 +147,7 @@ export const TeamAccessEditor: React.FC<TeamAccessEditorProps> = ({
     },
     onError: (error) => {
       toast.error(
-        error instanceof Error ? error.message : "Failed to update settings",
+        extractErrorMessage(error, "Failed to update settings"),
       );
     },
   });

package/src/components/TeamsTab.tsx

@@ -43,6 +43,7 @@ import {
 import { usePluginClient } from "@checkstack/frontend-api";
 import { AuthApi } from "@checkstack/auth-common";
 import type { AuthUser } from "../api";
+import { extractErrorMessage } from "@checkstack/common";
 
 interface Team {
   id: string;
@@ -116,7 +117,7 @@ export const TeamsTab: React.FC<TeamsTabProps> = ({
     },
     onError: (error) => {
       toast.error(
-        error instanceof Error ? error.message : "Failed to create team",
+        extractErrorMessage(error, "Failed to create team"),
       );
     },
   });
@@ -130,7 +131,7 @@ export const TeamsTab: React.FC<TeamsTabProps> = ({
     },
     onError: (error) => {
       toast.error(
-        error instanceof Error ? error.message : "Failed to update team",
+        extractErrorMessage(error, "Failed to update team"),
       );
     },
   });
@@ -144,7 +145,7 @@ export const TeamsTab: React.FC<TeamsTabProps> = ({
     },
     onError: (error) => {
       toast.error(
-        error instanceof Error ? error.message : "Failed to delete team",
+        extractErrorMessage(error, "Failed to delete team"),
       );
     },
   });
@@ -158,7 +159,7 @@ export const TeamsTab: React.FC<TeamsTabProps> = ({
     },
     onError: (error) => {
       toast.error(
-        error instanceof Error ? error.message : "Failed to add member",
+        extractErrorMessage(error, "Failed to add member"),
       );
     },
   });
@@ -171,7 +172,7 @@ export const TeamsTab: React.FC<TeamsTabProps> = ({
     },
     onError: (error) => {
       toast.error(
-        error instanceof Error ? error.message : "Failed to remove member",
+        extractErrorMessage(error, "Failed to remove member"),
       );
     },
   });
@@ -183,7 +184,7 @@ export const TeamsTab: React.FC<TeamsTabProps> = ({
     },
     onError: (error) => {
       toast.error(
-        error instanceof Error ? error.message : "Failed to promote to manager",
+        extractErrorMessage(error, "Failed to promote to manager"),
       );
     },
   });
@@ -195,9 +196,7 @@ export const TeamsTab: React.FC<TeamsTabProps> = ({
     },
     onError: (error) => {
       toast.error(
-        error instanceof Error
-          ? error.message
-          : "Failed to remove manager role",
+        extractErrorMessage(error, "Failed to remove manager role"),
       );
     },
   });

package/src/components/UsersTab.tsx

@@ -23,6 +23,7 @@ import { usePluginClient } from "@checkstack/frontend-api";
 import { AuthApi } from "@checkstack/auth-common";
 import type { AuthUser, Role, AuthStrategy } from "../api";
 import { CreateUserDialog } from "./CreateUserDialog";
+import { extractErrorMessage } from "@checkstack/common";
 
 export interface UsersTabProps {
   users: (AuthUser & { roles: string[] })[];
@@ -66,7 +67,7 @@ export const UsersTab: React.FC<UsersTabProps> = ({
     },
     onError: (error) => {
       toast.error(
-        error instanceof Error ? error.message : "Failed to delete user",
+        extractErrorMessage(error, "Failed to delete user"),
       );
     },
   });
@@ -77,7 +78,7 @@ export const UsersTab: React.FC<UsersTabProps> = ({
     },
     onError: (error) => {
       toast.error(
-        error instanceof Error ? error.message : "Failed to update roles",
+        extractErrorMessage(error, "Failed to update roles"),
       );
     },
   });
@@ -89,7 +90,7 @@ export const UsersTab: React.FC<UsersTabProps> = ({
     },
     onError: (error) => {
       toast.error(
-        error instanceof Error ? error.message : "Failed to create user",
+        extractErrorMessage(error, "Failed to create user"),
       );
       throw error;
     },

package/src/index.tsx

@@ -108,6 +108,7 @@ class BetterAuthApi implements AuthApi {
   }
 
   useSession() {
+    // eslint-disable-next-line react-hooks/rules-of-hooks -- Class adapter delegates to hook; consumed as API, not a component
     return useSessionContext();
   }
 }
@@ -178,6 +179,7 @@ export const authPlugin = createFrontendPlugin({
     createSlotExtension(UserMenuItemsSlot, {
       id: "auth.user-menu.settings",
       component: ({ accessRules: userPerms }: UserMenuItemsContext) => {
+        // eslint-disable-next-line react-hooks/rules-of-hooks -- Inline component used via createSlotExtension
         const navigate = useNavigate();
         const qualifiedId = `${pluginMetadata.pluginId}.${authAccess.strategies.id}`;
         const canManage =
@@ -198,6 +200,7 @@ export const authPlugin = createFrontendPlugin({
     createSlotExtension(UserMenuItemsSlot, {
       id: "auth.user-menu.profile",
       component: () => {
+        // eslint-disable-next-line react-hooks/rules-of-hooks -- Inline component used via createSlotExtension
         const navigate = useNavigate();
 
         return (

package/src/lib/AuthAccessApi.ts

@@ -8,6 +8,7 @@ import type { AccessRule } from "@checkstack/common";
  */
 export class AuthAccessApi implements AccessApi {
   useAccess(accessRule: AccessRule): { loading: boolean; allowed: boolean } {
+    // eslint-disable-next-line react-hooks/rules-of-hooks -- Class adapter delegates to hook; consumed as API, not a component
     const { accessRules, loading } = useAccessRules();
 
     if (loading) {