@youversion/platform-react-hooks 0.6.0 → 0.8.0

package/src/useYVAuth.ts

@@ -0,0 +1,179 @@
+import { useMemo, useCallback } from 'react';
+import {
+  YouVersionAPIUsers,
+  YouVersionPlatformConfiguration,
+  type AuthenticationState,
+  type SignInWithYouVersionPermissionValues,
+  type SignInWithYouVersionResult,
+  type YouVersionUserInfo,
+} from '@youversion/platform-core';
+import { useYouVersionAuthContext } from './context/YouVersionAuthContext';
+
+export interface UseYVAuthReturn {
+  // Main auth state
+  auth: AuthenticationState;
+
+  // Actions
+  signIn: (params: {
+    redirectUrl: string;
+    permissions?: SignInWithYouVersionPermissionValues[];
+  }) => Promise<void>;
+  signOut: () => void;
+
+  // Callback processing (for callback page) - caches user info
+  processCallback: () => Promise<SignInWithYouVersionResult | null>;
+
+  // Cached user info (populated after successful callback)
+  userInfo: YouVersionUserInfo | null;
+}
+
+/**
+ * Comprehensive YouVersion authentication hook using vanilla React.
+ *
+ * Provides complete auth functionality without external dependencies.
+ * Sign-in redirects to YouVersion, callback processing caches user info.
+ *
+ * @returns Complete auth state and functionality
+ *
+ * @example
+ * ```tsx
+ * // Sign-in page
+ * import { useYVAuth, SignInWithYouVersionPermission } from '@youversion/platform-react-hooks';
+ *
+ * function SignInPage() {
+ *   const { auth, signIn } = useYVAuth();
+ *
+ *   const handleSignIn = async () => {
+ *     try {
+ *       await signIn({
+ *         redirectUrl: 'https://myapp.com/callback',
+ *         permissions: [SignInWithYouVersionPermission.bibles]
+ *       });
+ *     } catch (error) {
+ *       console.error('Sign in failed:', error);
+ *     }
+ *   };
+ *
+ *   if (auth.isAuthenticated) {
+ *     return <div>Already signed in!</div>;
+ *   }
+ *
+ *   return (
+ *     <button onClick={handleSignIn} disabled={auth.isLoading}>
+ *       {auth.isLoading ? 'Signing in...' : 'Sign In'}
+ *     </button>
+ *   );
+ * }
+ *
+ * // Callback page
+ * function CallbackPage() {
+ *   const { processCallback } = useYVAuth();
+ *   const [isProcessing, setIsProcessing] = useState(true);
+ *
+ *   useEffect(() => {
+ *     processCallback()
+ *       .then(result => {
+ *         if (result) {
+ *           console.log('Auth success:', result.name);
+ *           // User info is now cached
+ *           // Redirect to app
+ *         }
+ *       })
+ *       .catch(error => {
+ *         console.error('Auth failed:', error);
+ *       })
+ *       .finally(() => {
+ *         setIsProcessing(false);
+ *       });
+ *   }, [processCallback]);
+ *
+ *   return (
+ *     <div>
+ *       {isProcessing ? 'Processing authentication...' : 'Authentication complete'}
+ *     </div>
+ *   );
+ * }
+ *
+ * // App with cached user info
+ * function App() {
+ *   const { auth, userInfo, signOut } = useYVAuth();
+ *
+ *   if (!auth.isAuthenticated) {
+ *     return <SignInPage />;
+ *   }
+ *
+ *   return (
+ *     <div>
+ *       <p>Welcome, {userInfo?.name || 'User'}!</p>
+ *       <button onClick={signOut}>Sign Out</button>
+ *     </div>
+ *   );
+ * }
+ * ```
+ */
+export function useYVAuth(): UseYVAuthReturn {
+  // Get auth state from provider context
+  const { userInfo, setUserInfo, isLoading, error } = useYouVersionAuthContext();
+
+  // Derive authentication state
+  const isAuthenticated = !!userInfo;
+
+  // Get current tokens for actions
+  const authTokens = useMemo(() => {
+    if (typeof window !== 'undefined') {
+      return {
+        accessToken: YouVersionPlatformConfiguration.accessToken,
+        idToken: YouVersionPlatformConfiguration.idToken,
+      };
+    }
+    return { accessToken: null, idToken: null };
+  }, []);
+
+  // Sign in function
+  const signIn = useCallback(
+    async ({
+      redirectUrl,
+      permissions = [],
+    }: {
+      redirectUrl: string;
+      permissions?: SignInWithYouVersionPermissionValues[];
+    }) => {
+      await YouVersionAPIUsers.signIn(new Set(permissions), redirectUrl);
+      // Note: This will redirect, so code after this won't execute
+    },
+    [],
+  );
+
+  // Process callback function
+  const processCallback = useCallback(async (): Promise<SignInWithYouVersionResult | null> => {
+    const result = await YouVersionAPIUsers.handleAuthCallback();
+    return result;
+  }, []);
+
+  // Derive auth state
+  const auth: AuthenticationState = useMemo(
+    () => ({
+      isAuthenticated,
+      isLoading,
+      accessToken: authTokens.accessToken,
+      idToken: authTokens.idToken,
+      result: null,
+      error,
+    }),
+    [isAuthenticated, isLoading, authTokens.accessToken, authTokens.idToken, error],
+  );
+
+  // Sign out function
+  const signOut = useCallback(() => {
+    YouVersionPlatformConfiguration.clearAuthTokens();
+    setUserInfo(null);
+  }, []);
+
+  return {
+    auth,
+    signIn,
+    signOut,
+    processCallback,
+    userInfo,
+  };
+}

package/dist/context/BibleSDKContext.d.ts

@@ -1,8 +0,0 @@
-type BibleSDKContextData = {
-    appKey: string;
-    apiHost?: string;
-    installationId?: string;
-};
-export declare const BibleSDKContext: import("react").Context<BibleSDKContextData | null>;
-export {};
-//# sourceMappingURL=BibleSDKContext.d.ts.map

package/dist/context/BibleSDKContext.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"BibleSDKContext.d.ts","sourceRoot":"","sources":["../../src/context/BibleSDKContext.tsx"],"names":[],"mappings":"AAIA,KAAK,mBAAmB,GAAG;IACzB,MAAM,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,cAAc,CAAC,EAAE,MAAM,CAAC;CACzB,CAAC;AAEF,eAAO,MAAM,eAAe,qDAAkD,CAAC"}

package/dist/context/BibleSDKContext.js

@@ -1,4 +0,0 @@
-'use client';
-import { createContext } from 'react';
-export const BibleSDKContext = createContext(null);
-//# sourceMappingURL=BibleSDKContext.js.map

package/dist/context/BibleSDKContext.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"BibleSDKContext.js","sourceRoot":"","sources":["../../src/context/BibleSDKContext.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;AAEb,OAAO,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AAQtC,MAAM,CAAC,MAAM,eAAe,GAAG,aAAa,CAA6B,IAAI,CAAC,CAAC"}

package/dist/context/BibleSDKProvider.d.ts

@@ -1,9 +0,0 @@
-import type { PropsWithChildren, ReactNode } from 'react';
-type BibleSDKProviderProps = {
-    children: ReactNode;
-    appKey: string;
-    apiHost?: string;
-};
-export declare function BibleSDKProvider({ appKey, apiHost, children, }: PropsWithChildren<BibleSDKProviderProps>): React.ReactElement;
-export {};
-//# sourceMappingURL=BibleSDKProvider.d.ts.map

package/dist/context/BibleSDKProvider.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"BibleSDKProvider.d.ts","sourceRoot":"","sources":["../../src/context/BibleSDKProvider.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,iBAAiB,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAK1D,KAAK,qBAAqB,GAAG;IAC3B,QAAQ,EAAE,SAAS,CAAC;IACpB,MAAM,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,MAAM,CAAC;CAClB,CAAC;AAEF,wBAAgB,gBAAgB,CAAC,EAC/B,MAAM,EACN,OAA8B,EAC9B,QAAQ,GACT,EAAE,iBAAiB,CAAC,qBAAqB,CAAC,GAAG,KAAK,CAAC,YAAY,CAiB/D"}

package/dist/context/BibleSDKProvider.js

@@ -1,18 +0,0 @@
-'use client';
-import { jsx as _jsx } from "react/jsx-runtime";
-import { useEffect } from 'react';
-import { BibleSDKContext } from './BibleSDKContext';
-import { YouVersionPlatformConfiguration } from '@youversion/platform-core';
-export function BibleSDKProvider({ appKey, apiHost = 'api.youversion.com', children, }) {
-    // Syncing appKey and apiHost to YouVersionPlatformConfiguration
-    // so that this can be in sync with any other code that uses
-    // the YouVersionPlatformConfiguration, of which a lot of our
-    // core package uses this configuration.
-    useEffect(() => {
-        YouVersionPlatformConfiguration.appKey = appKey;
-        YouVersionPlatformConfiguration.apiHost = apiHost;
-    }, [appKey, apiHost]);
-    // Installation ID gets set automatically by YouVersionPlatformConfiguration
-    return (_jsx(BibleSDKContext.Provider, { value: { appKey, apiHost, installationId: YouVersionPlatformConfiguration.installationId }, children: children }));
-}
-//# sourceMappingURL=BibleSDKProvider.js.map

package/dist/context/BibleSDKProvider.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"BibleSDKProvider.js","sourceRoot":"","sources":["../../src/context/BibleSDKProvider.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAGb,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAClC,OAAO,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;AACpD,OAAO,EAAE,+BAA+B,EAAE,MAAM,2BAA2B,CAAC;AAQ5E,MAAM,UAAU,gBAAgB,CAAC,EAC/B,MAAM,EACN,OAAO,GAAG,oBAAoB,EAC9B,QAAQ,GACiC;IACzC,gEAAgE;IAChE,4DAA4D;IAC5D,6DAA6D;IAC7D,wCAAwC;IACxC,SAAS,CAAC,GAAG,EAAE;QACb,+BAA+B,CAAC,MAAM,GAAG,MAAM,CAAC;QAChD,+BAA+B,CAAC,OAAO,GAAG,OAAO,CAAC;IACpD,CAAC,EAAE,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC,CAAC;IACtB,4EAA4E;IAC5E,OAAO,CACL,KAAC,eAAe,CAAC,QAAQ,IACvB,KAAK,EAAE,EAAE,MAAM,EAAE,OAAO,EAAE,cAAc,EAAE,+BAA+B,CAAC,cAAc,EAAE,YAEzF,QAAQ,GACgB,CAC5B,CAAC;AACJ,CAAC"}

package/src/context/BibleSDKProvider.tsx

@@ -1,35 +0,0 @@
-'use client';
-
-import type { PropsWithChildren, ReactNode } from 'react';
-import { useEffect } from 'react';
-import { BibleSDKContext } from './BibleSDKContext';
-import { YouVersionPlatformConfiguration } from '@youversion/platform-core';
-
-type BibleSDKProviderProps = {
-  children: ReactNode;
-  appKey: string;
-  apiHost?: string;
-};
-
-export function BibleSDKProvider({
-  appKey,
-  apiHost = 'api.youversion.com',
-  children,
-}: PropsWithChildren<BibleSDKProviderProps>): React.ReactElement {
-  // Syncing appKey and apiHost to YouVersionPlatformConfiguration
-  // so that this can be in sync with any other code that uses
-  // the YouVersionPlatformConfiguration, of which a lot of our
-  // core package uses this configuration.
-  useEffect(() => {
-    YouVersionPlatformConfiguration.appKey = appKey;
-    YouVersionPlatformConfiguration.apiHost = apiHost;
-  }, [appKey, apiHost]);
-  // Installation ID gets set automatically by YouVersionPlatformConfiguration
-  return (
-    <BibleSDKContext.Provider
-      value={{ appKey, apiHost, installationId: YouVersionPlatformConfiguration.installationId }}
-    >
-      {children}
-    </BibleSDKContext.Provider>
-  );
-}