@sqrzro/auth 2.0.0-bz.0 → 2.0.0-bz.2

package/.turbo/turbo-build.log

@@ -1,4 +1,4 @@
 
-> @sqrzro/auth@2.0.0-bz.0 build /Users/richard/Sites/@sqrzro/sqrzro/packages/auth
+> @sqrzro/auth@2.0.0-bz.2 build /Users/richard/Sites/@sqrzro/sqrzro/packages/auth
 > tsc -p tsconfig.json
 

package/.turbo/turbo-dev.log

@@ -0,0 +1,32 @@
+
+> @sqrzro/auth@2.0.0-bz.1 dev /Users/richard/Sites/@sqrzro/sqrzro/packages/auth
+> tsc -p tsconfig.json --watch
+
+c[7:55:29 AM] Starting compilation in watch mode...
+
+[7:55:31 AM] Found 0 errors. Watching for file changes.
+
+c[7:55:34 AM] File change detected. Starting incremental compilation...
+
+[7:55:34 AM] Found 0 errors. Watching for file changes.
+
+c[7:55:38 AM] File change detected. Starting incremental compilation...
+
+[7:55:38 AM] Found 0 errors. Watching for file changes.
+
+c[11:04:28 AM] File change detected. Starting incremental compilation...
+
+[11:04:28 AM] Found 0 errors. Watching for file changes.
+
+c[11:04:35 AM] File change detected. Starting incremental compilation...
+
+[11:04:35 AM] Found 0 errors. Watching for file changes.
+
+c[11:04:43 AM] File change detected. Starting incremental compilation...
+
+[11:04:43 AM] Found 0 errors. Watching for file changes.
+
+c[11:04:52 AM] File change detected. Starting incremental compilation...
+
+[11:04:52 AM] Found 0 errors. Watching for file changes.
+

package/dist/components/Auth/index.d.ts

@@ -13,6 +13,7 @@ export interface AuthClassNames {
 export interface AuthProps extends ClassNameProps<AuthClassNames> {
     logo?: React.ReactElement;
     onLogin?: () => Promise<void>;
+    onPassword?: (email: string, token: string) => Promise<boolean>;
     params: {
         auth: string[];
     };
@@ -29,5 +30,5 @@ export interface AuthProps extends ClassNameProps<AuthClassNames> {
  * sessions etc), using the `getClassNames` pattern won't work, as it currently only works for
  * client components. So we have to pass the classNames directly to the component.
  */
-declare function Auth({ classNames, logo, onLogin, params: { auth }, searchParams, }: Readonly<AuthProps>): Promise<React.ReactElement>;
+declare function Auth({ classNames, logo, onLogin, onPassword, params: { auth }, searchParams, }: Readonly<AuthProps>): Promise<React.ReactElement>;
 export default Auth;

package/dist/components/Auth/index.js

@@ -4,7 +4,7 @@ import { notFound } from 'next/navigation';
 import LoginForm from '../LoginForm';
 import MFAPage from '../MFAPage';
 import PasswordPage from '../PasswordPage';
-import { registerAuthEvent } from '../../server';
+import { registerAuthEvents } from '../../server';
 /**
  * To make it easier for consumers to use Auth in their projects, this auth component uses a
  * Catch-All Segment to handle the rendering of all Auth pages. This function is used to determine
@@ -33,12 +33,12 @@ function getPage(route, props) {
  * sessions etc), using the `getClassNames` pattern won't work, as it currently only works for
  * client components. So we have to pass the classNames directly to the component.
  */
-async function Auth({ classNames, logo, onLogin, params: { auth }, searchParams, }) {
+async function Auth({ classNames, logo, onLogin, onPassword, params: { auth }, searchParams, }) {
     if (auth.length > 1) {
         return notFound();
     }
-    await registerAuthEvent(onLogin);
-    return (_jsxs("div", { className: tw('grid h-screen grid-rows-[1fr_auto_auto_2fr] justify-center', classNames?.root), children: [_jsx("div", { className: tw('row-start-2', classNames?.logo), children: logo }), _jsx("div", { className: tw('row-start-3 w-screen max-w-sm', classNames?.panel), children: getPage(auth[0], {
+    await registerAuthEvents({ login: onLogin, password: onPassword });
+    return (_jsxs("div", { className: tw(classNames?.root), children: [_jsx("div", { className: tw(classNames?.logo), children: logo }), _jsx("div", { className: tw(classNames?.panel), children: getPage(auth[0], {
                     classNames,
                     searchParams,
                 }) })] }));

package/dist/components/LogoutButton/index.js

@@ -7,6 +7,8 @@ function LogoutButton({ children = 'Log out', redirectTo, }) {
     async function handleLogout() {
         await logout();
         router.push(redirectTo || '/');
+        // It seems necessary to refresh to ensure the user is redirected to the login page
+        router.refresh();
     }
     return (_jsx("form", { action: handleLogout, className: "contents", children: _jsx("button", { type: "submit", children: children }) }));
 }

package/dist/index.d.ts

@@ -1,3 +1,3 @@
 export { default as Auth } from './components/Auth';
-export type { AuthProps } from './components/Auth';
+export type { AuthClassNames, AuthProps } from './components/Auth';
 export { default as LogoutButton } from './components/LogoutButton';

package/dist/server.d.ts

@@ -1,7 +1,11 @@
 import type { LoginFormFields, MFAFormFields, UserObject } from '@sqrzro/server/auth';
 import type { Errorable } from '@sqrzro/interfaces';
 export type { MFAFormFields, ScopeObject } from '@sqrzro/server/auth';
-export declare function registerAuthEvent(fn?: () => Promise<void>): Promise<void>;
+interface AuthEventObject {
+    login?: () => Promise<void>;
+    password?: (email: string, token: string) => Promise<boolean>;
+}
+export declare function registerAuthEvents(events: AuthEventObject): Promise<void>;
 export declare function checkUserHasMFA(user: UserObject): Promise<boolean>;
 export declare function generateMFA(name: string, email?: string): Promise<string | null>;
 export declare function getSessionUser(): Promise<UserObject | null>;

package/dist/server.js

@@ -1,9 +1,12 @@
 'use server';
 import { handleLoginForm, handleLogout, handleMFAForm, handlePasswordForm, handlePasswordResetForm, checkUserHasMFA as serverCheckUserHasMFA, generateMFA as serverGenerateMFA, getSessionUser as serverGetSessionUser, checkMFAEnabled as syncCheckMFAEnabled, } from '@sqrzro/server/auth';
-let authEvent; // eslint-disable-line @typescript-eslint/init-declarations
-export async function registerAuthEvent(fn) {
-    if (fn) {
-        authEvent = fn;
+const authEvents = {};
+export async function registerAuthEvents(events) {
+    if (events.login) {
+        authEvents.login = events.login;
+    }
+    if (events.password) {
+        authEvents.password = events.password;
     }
     return Promise.resolve();
 }
@@ -27,13 +30,13 @@ export async function checkMFAEnabled() {
     return Promise.resolve(syncCheckMFAEnabled());
 }
 export async function submitLoginForm(formData) {
-    return handleLoginForm(formData, authEvent);
+    return handleLoginForm(formData, authEvents.login);
 }
 export async function submitMFAForm(formData) {
     return handleMFAForm(formData);
 }
 async function sendPasswordResetMail(email, token) {
-    return true;
+    return authEvents.password?.(email, token) || false;
 }
 export async function submitPasswordForm(formData) {
     return handlePasswordForm(formData, sendPasswordResetMail);

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@sqrzro/auth",
   "type": "module",
-  "version": "2.0.0-bz.0",
+  "version": "2.0.0-bz.2",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
   "dependencies": {
@@ -17,6 +17,7 @@
     "typescript": "^5.4.4"
   },
   "scripts": {
-    "build": "tsc -p tsconfig.json"
+    "build": "tsc -p tsconfig.json",
+    "dev": "tsc -p tsconfig.json --watch"
   }
 }

package/src/components/Auth/index.tsx

@@ -6,7 +6,7 @@ import LoginForm from '../LoginForm';
 import MFAPage from '../MFAPage';
 import PasswordPage from '../PasswordPage';
 
-import { registerAuthEvent } from '../../server';
+import { registerAuthEvents } from '../../server';
 import type { ScopeObject } from '../../server';
 
 export interface AuthClassNames {
@@ -22,6 +22,7 @@ export interface AuthClassNames {
 export interface AuthProps extends ClassNameProps<AuthClassNames> {
     logo?: React.ReactElement;
     onLogin?: () => Promise<void>;
+    onPassword?: (email: string, token: string) => Promise<boolean>;
     params: { auth: string[] };
     scopes?: Partial<ScopeObject>;
     searchParams: { email?: string; r?: string; token?: string };
@@ -65,6 +66,7 @@ async function Auth({
     classNames,
     logo,
     onLogin,
+    onPassword,
     params: { auth },
     searchParams,
 }: Readonly<AuthProps>): Promise<React.ReactElement> {
@@ -72,17 +74,12 @@ async function Auth({
         return notFound();
     }
 
-    await registerAuthEvent(onLogin);
+    await registerAuthEvents({ login: onLogin, password: onPassword });
 
     return (
-        <div
-            className={tw(
-                'grid h-screen grid-rows-[1fr_auto_auto_2fr] justify-center',
-                classNames?.root
-            )}
-        >
-            <div className={tw('row-start-2', classNames?.logo)}>{logo}</div>
-            <div className={tw('row-start-3 w-screen max-w-sm', classNames?.panel)}>
+        <div className={tw(classNames?.root)}>
+            <div className={tw(classNames?.logo)}>{logo}</div>
+            <div className={tw(classNames?.panel)}>
                 {getPage(auth[0], {
                     classNames,
                     searchParams,

package/src/components/LogoutButton/index.tsx

@@ -18,6 +18,9 @@ function LogoutButton({
     async function handleLogout(): Promise<void> {
         await logout();
         router.push(redirectTo || '/');
+
+        // It seems necessary to refresh to ensure the user is redirected to the login page
+        router.refresh();
     }
 
     return (

package/src/index.ts

@@ -1,3 +1,3 @@
 export { default as Auth } from './components/Auth';
-export type { AuthProps } from './components/Auth';
+export type { AuthClassNames, AuthProps } from './components/Auth';
 export { default as LogoutButton } from './components/LogoutButton';

package/src/server.ts

@@ -16,11 +16,19 @@ import type { Errorable } from '@sqrzro/interfaces';
 
 export type { MFAFormFields, ScopeObject } from '@sqrzro/server/auth';
 
-let authEvent: () => Promise<void>; // eslint-disable-line @typescript-eslint/init-declarations
+interface AuthEventObject {
+    login?: () => Promise<void>;
+    password?: (email: string, token: string) => Promise<boolean>;
+}
+
+const authEvents: AuthEventObject = {};
 
-export async function registerAuthEvent(fn?: () => Promise<void>): Promise<void> {
-    if (fn) {
-        authEvent = fn;
+export async function registerAuthEvents(events: AuthEventObject): Promise<void> {
+    if (events.login) {
+        authEvents.login = events.login;
+    }
+    if (events.password) {
+        authEvents.password = events.password;
     }
     return Promise.resolve();
 }
@@ -59,7 +67,7 @@ interface PasswordResetFormFields {
 }
 
 export async function submitLoginForm(formData: LoginFormFields): Promise<Errorable<string>> {
-    return handleLoginForm(formData, authEvent);
+    return handleLoginForm(formData, authEvents.login);
 }
 
 export async function submitMFAForm(formData: MFAFormFields): Promise<Errorable<boolean>> {
@@ -67,7 +75,7 @@ export async function submitMFAForm(formData: MFAFormFields): Promise<Errorable<
 }
 
 async function sendPasswordResetMail(email: string, token: string): Promise<boolean> {
-    return true;
+    return authEvents.password?.(email, token) || false;
 }
 
 export async function submitPasswordForm(